.dx-button-mode-contained{ background:none; } .dx-button-mode-contained.dx-state-hover{ background:none; } .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-hover { background: none; } body.ff-app { --ff-dx-selection-tint: rgba(255, 214, 0, .20); --ff-dx-selection-tint-hover: rgba(255, 214, 0, .28); --ff-grid-row-height: 20px; --ff-grid-cell-padding-x: 6px; --ff-grid-cell-padding-y: 1px; --ff-grid-header-padding-y: 2px; --ff-page-font-size: 12px; --ff-control-font-size: 12px; } body.ff-app[data-grid-density="compact"] { --ff-grid-row-height: 12px; --ff-grid-cell-padding-x: 5px; --ff-grid-cell-padding-y: 0; --ff-grid-header-padding-y: 1px; --ff-page-font-size: 11px; --ff-control-font-size: 11px; } body.ff-app[data-theme="dark"] .dx-texteditor.dx-editor-outlined, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-headers, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-rowsview, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-total-footer, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-filter-panel { border-color: var(--border) !important; } body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-headers, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-rowsview, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-total-footer { border-left-color: var(--border) !important; border-right-color: var(--border) !important; } body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-rowsview, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-total-footer, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-filter-panel, body.ff-app[data-theme="dark"] .dx-datagrid .dx-row-lines > td, body.ff-app[data-theme="dark"] .dx-datagrid-headers .dx-datagrid-table .dx-row > td { border-bottom-color: var(--border) !important; } body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-filter-panel, body.ff-app[data-theme="dark"] .dx-datagrid-borders > .dx-datagrid-headers { border-top-color: var(--border) !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-column-lines > td { border-left-color: var(--border) !important; border-right-color: var(--border) !important; } body.ff-app[data-theme="dark"] .dx-datagrid, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-content, body.ff-app[data-theme="dark"] .dx-datagrid .dx-scrollable-content, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-total-footer { background-color: var(--surface) !important; color: var(--text) !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-headers, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-headers .dx-header-row > td { background-color: var(--surface-3) !important; color: var(--text) !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-filter-row > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-total-footer .dx-row > td { background-color: var(--surface-2) !important; color: var(--text) !important; } /* Keep these non-important so intentional row colours returned by queries/status grids can show. */ body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected) > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected) > tr > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-freespace-row > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-virtual-row > td { background-color: var(--surface); color: var(--text) !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > tr > td { background-color: #1a2231; background-color: color-mix(in srgb, var(--surface) 93%, var(--primary) 7%); } body.ff-app[data-theme="dark"] .ff-view-invoices .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > td, body.ff-app[data-theme="dark"] .ff-view-invoices .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > tr > td { background-color: #1a2231; background-color: color-mix(in srgb, var(--surface) 93%, var(--primary) 7%); } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-state-hover:not(.dx-selection):not(.ff-dx-row-selected) > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row.dx-state-hover:not(.dx-selection):not(.ff-dx-row-selected) > tr > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected):hover > td, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected):hover > tr > td { background-color: color-mix(in srgb, var(--surface) 86%, var(--primary) 14%); } body.ff-app .dx-datagrid { font-size: 12px; } body.ff-app[data-grid-density="compact"] .dx-datagrid { font-size: 11px; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-row { min-height: var(--ff-grid-row-height) !important; } body.ff-app .dx-datagrid .dx-datagrid-headers .dx-header-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-row > td, body.ff-app .dx-datagrid .dx-datagrid-total-footer .dx-row > td { line-height: 1.2 !important; vertical-align: middle !important; } body.ff-app .dx-datagrid .dx-datagrid-headers .dx-header-row > td { padding: var(--ff-grid-header-padding-y) var(--ff-grid-cell-padding-x) !important; min-height: var(--ff-grid-row-height); } body.ff-app .dx-datagrid .dx-datagrid-filter-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-group-row > td, body.ff-app .dx-datagrid .dx-datagrid-total-footer .dx-row > td { padding: var(--ff-grid-cell-padding-y) var(--ff-grid-cell-padding-x) !important; min-height: var(--ff-grid-row-height); } body.ff-app .dx-datagrid .dx-datagrid-filter-row > td { height: 34px !important; min-height: 34px !important; overflow: visible !important; padding: 4px 6px !important; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-datagrid-filter-row > td { height: 24px !important; min-height: 24px !important; padding: 1px 5px !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td { height: var(--ff-grid-row-height); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } body.ff-app .dx-datagrid .dx-datagrid-headers .dx-datagrid-text-content, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-text-content { line-height: 1.2 !important; } body.ff-app .dx-datagrid .dx-editor-cell .dx-texteditor, body.ff-app .dx-datagrid .dx-editor-cell .dx-texteditor-input, body.ff-app .dx-datagrid .dx-datagrid-filter-row .dx-texteditor, body.ff-app .dx-datagrid .dx-datagrid-filter-row .dx-texteditor-input { min-height: 24px !important; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-editor-cell .dx-texteditor, body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-editor-cell .dx-texteditor-input, body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-datagrid-filter-row .dx-texteditor, body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-datagrid-filter-row .dx-texteditor-input { min-height: 20px !important; } body.ff-app .dx-datagrid .dx-datagrid-filter-row .dx-texteditor { height: 26px !important; min-height: 26px !important; overflow: visible !important; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-datagrid-filter-row .dx-texteditor { height: 20px !important; min-height: 20px !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-filter-row .dx-texteditor.dx-editor-outlined { background-color: var(--surface) !important; border-color: var(--border) !important; box-shadow: inset 0 0 0 1px var(--border) !important; } body.ff-app .dx-datagrid .dx-editor-cell .dx-texteditor-input, body.ff-app .dx-datagrid .dx-datagrid-filter-row .dx-texteditor-input { padding-top: 2px !important; padding-bottom: 2px !important; } body.ff-app .dx-datagrid .dx-button { min-height: 24px; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-button { min-height: 20px; } body.ff-app .dx-datagrid .dx-button .dx-button-content { padding: 2px 6px; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-button .dx-button-content { padding: 0 4px; } body.ff-app .dx-datagrid .dx-checkbox { line-height: 1; } body.ff-app .dx-datagrid .dx-checkbox-icon { width: 16px; height: 16px; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-checkbox-icon { width: 11px; height: 11px; } body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-checkbox, body.ff-app[data-grid-density="compact"] .dx-datagrid .dx-checkbox-container { min-height: var(--ff-grid-row-height) !important; height: var(--ff-grid-row-height) !important; } body.ff-app table.table-condensed > thead > tr > th, body.ff-app table.table-condensed > thead > tr > td, body.ff-app table.table-condensed > tbody > tr > th, body.ff-app table.table-condensed > tbody > tr > td, body.ff-app table.table-condensed > tfoot > tr > th, body.ff-app table.table-condensed > tfoot > tr > td, body.ff-app table.custom-dx-table.table > thead > tr > th, body.ff-app table.custom-dx-table.table > thead > tr > td, body.ff-app table.custom-dx-table.table > tbody > tr > th, body.ff-app table.custom-dx-table.table > tbody > tr > td, body.ff-app table.custom-dx-table.table > tfoot > tr > th, body.ff-app table.custom-dx-table.table > tfoot > tr > td { padding: 4px 6px !important; line-height: 1.2 !important; vertical-align: middle !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row > tr > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:hover > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:hover > tr > td { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row.dx-row-alt > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row.dx-row-alt > tr > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row.dx-row-alt:hover > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row.dx-row-alt:hover > tr > td { background-color: var(--surface-2) !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:hover > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-selection.dx-row:hover > tr > td { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected > tr > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-focused.dx-data-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-focused.dx-data-row > tr > td { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-alt > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-alt > tr > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-alt.dx-row-focused.dx-data-row > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected.dx-row-alt.dx-row-focused.dx-data-row > tr > td { background-color: var(--surface-2) !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected:hover > td, body.ff-app .dx-datagrid .dx-datagrid-rowsview .ff-dx-row-selected:hover > tr > td { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } body.ff-app tr.row-selected, body.ff-app tr.row-selected-noshadow, body.ff-app tr.row-selected > td, body.ff-app tr.row-selected-noshadow > td { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } body.ff-app tr.row-selected.odd, body.ff-app tr.row-selected-noshadow.odd, body.ff-app tr.row-selected.odd > td, body.ff-app tr.row-selected-noshadow.odd > td { background-color: var(--topbar-hover) !important; } body.ff-app tr.row-selected.even, body.ff-app tr.row-selected-noshadow.even, body.ff-app tr.row-selected.even > td, body.ff-app tr.row-selected-noshadow.even > td { background-color: var(--surface) !important; } body.ff-app tr.row-selected:hover, body.ff-app tr.row-selected-noshadow:hover, body.ff-app tr.row-selected:hover > td, body.ff-app tr.row-selected-noshadow:hover > td { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-0 > td { background-color: color-mix(in srgb, var(--surface) 94%, var(--primary) 6%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-0 > td { background-color: color-mix(in srgb, var(--surface-2) 94%, var(--primary) 6%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-1 > td { background-color: color-mix(in srgb, var(--surface) 91%, var(--primary) 9%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-1 > td { background-color: color-mix(in srgb, var(--surface-2) 91%, var(--primary) 9%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-2 > td { background-color: color-mix(in srgb, var(--surface) 88%, var(--primary) 12%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-2 > td { background-color: color-mix(in srgb, var(--surface-2) 88%, var(--primary) 12%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-3 > td { background-color: color-mix(in srgb, var(--surface) 85%, var(--primary) 15%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-group-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected).ff-cons-group-3 > td { background-color: color-mix(in srgb, var(--surface-2) 85%, var(--primary) 15%) !important; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-master-row:not(.dx-selection):not(.ff-dx-row-selected) > td { font-weight: 600; } body.ff-app .ff-consolidation .dx-datagrid .dx-datagrid-rowsview .ff-cons-master-row:not(.dx-selection):not(.ff-dx-row-selected) > td:first-child { box-shadow: inset 3px 0 0 var(--primary); } body.ff-app .dx-datagrid .dx-datagrid-content-fixed, body.ff-app .dx-datagrid .dx-datagrid-content-fixed .dx-scrollable-content, body.ff-app .dx-datagrid .dx-datagrid-content-fixed .dx-datagrid-table { background-color: transparent !important; } body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-content-fixed.dx-datagrid-content, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-content-fixed .dx-scrollable-content, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-content-fixed .dx-datagrid-table { background-color: transparent !important; } body.ff-app .dx-datagrid .dx-datagrid-content-fixed td.dx-pointer-events-none, body.ff-app[data-theme="dark"] .dx-datagrid .dx-datagrid-content-fixed td.dx-pointer-events-none, body.ff-app .dx-datagrid .dx-datagrid-content-fixed .dx-datagrid-table .dx-row td.dx-pointer-events-none, body.ff-app .dx-datagrid .dx-datagrid-content-fixed .dx-datagrid-table .dx-row > td.dx-pointer-events-none, body.ff-app .dx-datagrid .dx-datagrid-content-fixed .dx-datagrid-table .dx-row > tr > td.dx-pointer-events-none { visibility: hidden !important; background-color: transparent !important; color: transparent !important; border-top-color: transparent !important; border-bottom-color: transparent !important; box-shadow: none !important; } body.ff-app .ff-consolidation .ff-cons-master-checkbox { display: flex; align-items: center; justify-content: center; min-height: 20px; } body.ff-app .ff-grid-boolean-checkbox { align-items: center; display: flex; justify-content: flex-start; min-height: 20px; width: 100%; } body.ff-app .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { margin-left: 0 !important; margin-right: 0 !important; } /* Final grid density lock. DevExtreme renders fixed and scrollable panes as separate tables; keep both panes on the same CSS row metrics. */ body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td { height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row > tr > td { overflow: hidden !important; text-overflow: ellipsis; white-space: nowrap !important; } body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row a, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row button, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .label { line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-grid-row-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-checkbox, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-checkbox-container, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-data-row .dx-select-checkbox { align-items: center !important; display: inline-flex !important; height: var(--ff-grid-row-height) !important; justify-content: center !important; line-height: var(--ff-grid-row-height) !important; margin: 0 !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding: 0 !important; } body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-page:not(.ff-view-waybills) .dx-datagrid .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest needs a real rows viewport after the search area is shown; otherwise DevExtreme can count rows and summaries while rendering no data rows. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview { min-height: calc(var(--ff-grid-row-height) * 3) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: calc(var(--ff-grid-row-height) * 3) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row { display: table-row !important; height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; visibility: visible !important; } /* Debriefing can collapse the data viewport after the compact grid chrome is applied; keep a real rows area when search results exist, same as Generate Manifest. */ body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid { min-height: max(calc(var(--ff-grid-row-height) * 20), calc(100vh - 420px)) !important; } body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview { min-height: max(calc(var(--ff-grid-row-height) * 18), calc(100vh - 500px)) !important; } body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: max(calc(var(--ff-grid-row-height) * 18), calc(100vh - 500px)) !important; } body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-data-row { display: table-row !important; height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; visibility: visible !important; } body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-debriefing:not(.ff-standard-grid-page) #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td { display: table-cell !important; visibility: visible !important; } /* Generate Invoice uses client/waybill grid IDs. Size the rows area to the visible data rows so summaries stay directly under short result sets. */ body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid { min-height: calc((var(--ff-invoice-generate-effective-row-height, var(--ff-grid-row-height)) * var(--ff-invoice-generate-row-slots, 1)) + 108px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview { min-height: calc((var(--ff-invoice-generate-effective-row-height, var(--ff-grid-row-height)) * var(--ff-invoice-generate-row-slots, 1)) + 2px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content { min-height: calc((var(--ff-invoice-generate-effective-row-height, var(--ff-grid-row-height)) * var(--ff-invoice-generate-row-slots, 1)) + 2px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row { display: table-row !important; height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; visibility: visible !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > tr > td { display: table-cell !important; visibility: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; max-width: 28px !important; min-width: 28px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: 28px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers .dx-command-select, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row .dx-command-select, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select { max-width: 22px !important; min-width: 22px !important; width: 22px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) .dx-editor-container { display: none !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers .dx-checkbox-icon, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-checkbox-icon { height: min(12px, calc(var(--ff-grid-row-height) - 3px)) !important; width: min(12px, calc(var(--ff-grid-row-height) - 3px)) !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-heading-row { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 1px 10px !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-heading-row > .ff-manifest-wb-entry-row { align-items: center !important; display: flex !important; flex: 1 1 360px !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 0 6px !important; justify-content: flex-end !important; margin-left: auto !important; min-width: 320px !important; padding-top: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-row > .ff-manifest-wb-entry-option, body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-row > .col-sm-2.ff-manifest-wb-entry-option { flex: 0 0 auto !important; float: none !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-row > .ff-manifest-wb-entry-input { flex: 0 0 clamp(240px, 16.666vw, 340px) !important; float: none !important; max-width: clamp(240px, 16.666vw, 340px) !important; min-width: 240px !important; padding-left: 0 !important; padding-right: 0 !important; width: clamp(240px, 16.666vw, 340px) !important; } body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-row > .ff-manifest-wb-entry-input .input-group { width: 100% !important; } /* View Manifest final density lock. Fixed columns render in a separate table, so clamp both panes and their templates identically. */ body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row a, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row button, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row .label { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action) { height: calc(var(--ff-grid-row-height) - 4px) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-row-actions { line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; overflow: hidden !important; text-align: center !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-button-content, .dx-button-text) { align-items: center !important; display: inline-flex !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-icon, .fa) { line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-command-select > td { box-sizing: border-box !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-freespace-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-virtual-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-virtual-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Tariffs final row-height lock. Editable cells can make the scrollable pane taller than the fixed selection pane; keep both panes on one row metric. */ body.ff-app .ff-tariffs { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-tariffs { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-editor-cell :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-command-select .dx-checkbox-checked .dx-checkbox-icon::before { top: calc(50% - 2px) !important; } /* View Invoices: keep compact command columns and the pager/footer from leaving dead space. */ body.ff-app .ff-view-invoices > .container-fullw, body.ff-app .ff-view-invoices > .container-fluid.container-fullw, body.ff-app .ff-view-invoices .ff-grid-result-row, body.ff-app .ff-view-invoices .ff-grid-result-row > .col-md-12, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-pager, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-pager, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-bottom-load-panel { margin-bottom: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer).ff-grid-empty :is(.dx-datagrid-header-panel, .dx-datagrid-pager, .dx-pager, .dx-datagrid-bottom-load-panel) { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers .dx-command-select, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select { box-sizing: border-box !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .ff-invoice-view-command-col { box-sizing: border-box !important; max-width: 24px !important; min-width: 24px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: 24px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .dx-command-edit { box-sizing: border-box !important; max-width: 24px !important; min-width: 24px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .ff-invoice-view-command-col .dx-button, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .ff-invoice-view-command-col .dx-button-content, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .dx-command-edit .dx-button, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .dx-command-edit .dx-button-content { align-items: center !important; display: inline-flex !important; height: var(--ff-grid-row-height) !important; justify-content: center !important; line-height: var(--ff-grid-row-height) !important; margin: 0 !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: top !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .ff-invoice-view-command-col .fa-eye, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #clientGridContainer .dx-command-edit .fa-eye { display: inline-block !important; font-size: 11px !important; line-height: var(--ff-grid-row-height) !important; transform: translateY(-1px) !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) > *, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) .dx-button, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) .dx-button-content { text-overflow: clip !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } /* Compact result-grid viewport safety net. Some DevExtreme grids are initialized while their result panel is hidden; keep the rows viewport from collapsing. */ body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-crdr):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-tracking) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content { min-height: calc(var(--ff-grid-row-height) * 18) !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: calc(var(--ff-grid-row-height) * 3) !important; } body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing) .ff-grid-result-row .dx-datagrid-rowsview .dx-data-row { display: table-row !important; visibility: visible !important; } body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing) .ff-grid-result-row .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-view-waybills):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-view-collections):not(.ff-view-invoices):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing) .ff-grid-result-row .dx-datagrid-rowsview .dx-data-row > tr > td { display: table-cell !important; visibility: visible !important; } /* View Manifests final row-height lock. Fixed columns are rendered as a separate table, so every row/cell/template in both panes must share one height. */ body.ff-app .ff-view-manifests { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests, body.ff-app[data-grid-font-size="small"] .ff-view-manifests { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"] .ff-view-manifests { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } /* View Quotes normal mode row lock. Compact mode is already stable; normal keeps fixed columns, so lock both panes to the same row metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } /* View Credits/Debits normal mode row lock. Normal mode uses fixed command/select panes, so clamp both sides to identical row metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } /* View Tracking final row-height lock. Fixed select/edit columns render in separate tables, so both panes need the same metrics. */ body.ff-app .ff-view-tracking { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 30px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking, body.ff-app[data-grid-font-size="small"] .ff-view-tracking { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"] .ff-view-tracking { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest final row-height lock. Fixed select/options columns render in separate tables, so clamp both panes identically. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 28px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 1px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-dropdownbutton-action) { max-width: 24px !important; min-width: 24px !important; overflow: visible !important; width: 24px !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { color: var(--primary) !important; display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Processing view grids shared override. Later page-specific guards tighten individual grids where fixed panes need extra protection. */ body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app[data-grid-font-size="small"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app :is(.ff-view-waybills.ff-view-waybills-compact, .ff-view-collections.ff-view-compact, .ff-view-manifests.ff-view-compact, .ff-view-manifest-routes.ff-view-compact, .ff-debriefing.ff-view-compact) { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-expand, .ff-manifest-command-col), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-expand, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; max-width: calc(var(--ff-grid-command-column-width) - 8px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .dx-command-expand, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Processing view grids final page guard. View Quotes has its own known-good guard above; keep these fixes scoped to the other Processing view pages. */ body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app[data-grid-font-size="small"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app :is(.ff-view-waybills.ff-view-waybills-compact, .ff-view-collections.ff-view-compact, .ff-view-manifests.ff-view-compact, .ff-view-manifest-routes.ff-view-compact, .ff-debriefing.ff-view-compact) { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-expand, .ff-manifest-command-col), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-expand, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; max-width: calc(var(--ff-grid-command-column-width) - 8px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .dx-command-expand, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing) :is(#gridContainer, #gridContainer2, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifests final fixed-pane lock. Kept late so it wins over generic compact grid and earlier page rules. */ body.ff-app .ff-view-manifests { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 30px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests, body.ff-app[data-grid-font-size="small"] .ff-view-manifests { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"] .ff-view-manifests { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, .dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Quotes final normal-density row lock. Fixed command panes and scrollable data panes must share identical metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-command-column-width: 32px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-select), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .dx-command-select) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } /* Debriefing final grid pass: compact selection column and unclipped filter inputs. */ body.ff-app .ff-debriefing { --ff-debrief-select-column-width: 24px; --ff-debrief-filter-row-height: 30px; --ff-debrief-filter-editor-height: 24px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debriefing { --ff-debrief-select-column-width: 22px; --ff-debrief-filter-row-height: 26px; --ff-debrief-filter-editor-height: 22px; } body.ff-app .ff-debriefing #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-debriefing #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-debrief-select-column-width) !important; min-width: var(--ff-debrief-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-debrief-select-column-width) !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-headers .dx-command-select, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-headers .dx-command-select > td, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-headers .dx-header-row > .dx-command-select { height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; } body.ff-app .ff-debriefing #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-debriefing #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row > td, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: var(--ff-debrief-filter-row-height) !important; line-height: var(--ff-debrief-filter-editor-height) !important; max-height: var(--ff-debrief-filter-row-height) !important; min-height: var(--ff-debrief-filter-row-height) !important; overflow: visible !important; padding-bottom: 2px !important; padding-top: 2px !important; vertical-align: middle !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row .dx-command-select, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row .dx-command-select > td { padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row .dx-command-select .dx-editor-container { display: none !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row :is(.dx-editor-cell, .dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { box-sizing: border-box !important; height: var(--ff-debrief-filter-editor-height) !important; line-height: calc(var(--ff-debrief-filter-editor-height) - 2px) !important; max-height: var(--ff-debrief-filter-editor-height) !important; min-height: var(--ff-debrief-filter-editor-height) !important; overflow: visible !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-filter-row .dx-texteditor-input { padding-bottom: 1px !important; padding-top: 1px !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-editor-cell :is(.dx-selectbox, .dx-texteditor, .dx-dropdowneditor-input-wrapper, .dx-texteditor-container), body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-selectbox, .dx-texteditor, .dx-dropdowneditor-input-wrapper, .dx-texteditor-container) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-editor-cell .dx-texteditor-input, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-texteditor-input { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-editor-cell .dx-placeholder::before, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-placeholder::before { line-height: calc(var(--ff-grid-row-height) - 4px) !important; padding-top: 0 !important; transform: translateY(-1px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-editor-cell .dx-placeholder::before, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-placeholder::before { transform: translateY(-2px); } /* Generate Manifest final grid pass. Fixed checkbox/options panes are separate tables, so keep every pane on the same metrics. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 22px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; } body.ff-app .ff-generate-manifest .ff-manifest-grid-panel { margin-bottom: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-panel .panel-body { padding-bottom: 2px !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-row { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin: 2px 0 0 !important; padding-top: 0 !important; position: static !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-row::before, body.ff-app .ff-generate-manifest .ff-manifest-footer-row::after { content: none !important; display: none !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-actions { flex: 1 1 auto !important; min-width: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-action-group { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 6px !important; justify-content: flex-end !important; margin: 0 !important; position: static !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-header-row > .dx-command-select { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td, body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-header-row > :is(.dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview td :is(span, div, .dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-dropdownbutton-action) { max-width: 24px !important; min-width: 24px !important; overflow: visible !important; width: 24px !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { color: var(--primary) !important; display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-pager, .dx-pager) { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Image Search final row-height lock. The view uses fixed command columns, so clamp fixed and scrollable panes to the same metrics. */ body.ff-app .ff-imaging-list { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; } body.ff-app[data-grid-font-size="large"] .ff-imaging-list { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .ff-image-select-col, body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .ff-image-select-col > td, body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-header-row > .dx-command-select { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-image-command-col), body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-image-command-col) > td, body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-header-row > :is(.dx-command-edit, .ff-image-command-col) { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-image-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview td :is(span, div, .dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-total-footer .dx-row > td > *, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { color: var(--primary) !important; display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-image-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-pager, .dx-pager) { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Last-pass grid row metric guard. Keep this at the end of dx-custom.css: fixed and scrollable DevExtreme panes render as separate tables. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-page { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview td :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Images: final grid header density pass. Keep this after the shared row metric guard so mode changes resize the header with the rows. */ body.ff-app .ff-imaging-list { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-header-row-height: 30px; --ff-grid-filter-row-height: 28px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-header-row-height: 24px; --ff-grid-filter-row-height: 22px; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-headers .dx-header-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-headers .dx-header-row > td { box-sizing: border-box !important; height: var(--ff-grid-header-row-height) !important; line-height: calc(var(--ff-grid-header-row-height) - 4px) !important; max-height: var(--ff-grid-header-row-height) !important; min-height: var(--ff-grid-header-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-header-padding-y) !important; padding-top: var(--ff-grid-header-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-headers .dx-datagrid-text-content { line-height: calc(var(--ff-grid-header-row-height) - 4px) !important; max-height: calc(var(--ff-grid-header-row-height) - 4px) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-filter-row > td { box-sizing: border-box !important; height: var(--ff-grid-filter-row-height) !important; max-height: var(--ff-grid-filter-row-height) !important; min-height: var(--ff-grid-filter-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { height: calc(var(--ff-grid-filter-row-height) - 2px) !important; line-height: calc(var(--ff-grid-filter-row-height) - 4px) !important; max-height: calc(var(--ff-grid-filter-row-height) - 2px) !important; min-height: 0 !important; } /* View Manifest and Route grids: final fixed-pane density pass. These pages use fixed checkbox/action columns, so lock both rendered panes to the same metrics. */ body.ff-app .ff-view-manifests, body.ff-app .ff-view-manifest-routes { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests, body.ff-app[data-grid-font-size="small"] .ff-view-manifests, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-manifests, body.ff-app[data-grid-font-size="large"] .ff-view-manifest-routes { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app .ff-view-manifest-routes .ff-route-results, body.ff-app .ff-view-manifest-routes .ff-route-results .ff-grid-result-row, body.ff-app .ff-view-manifest-routes .ff-route-results .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: calc(var(--ff-grid-row-height) * 3) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td, body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, .dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview td :is(span, div, .dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-button-text, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-pager, .dx-pager), body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-pager, .dx-pager) { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Quotes normal mode: final fixed-pane row-height lock. The scrollable pane can contain nested spans/divs that outgrow the fixed checkbox/action pane. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview td :is(span, div, input, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Waybills final page guard. Keep this page-scoped lock after generic grid fixes so other pages cannot shrink the fixed pane again. */ body.ff-app .ff-view-waybills { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills, body.ff-app[data-grid-font-size="small"] .ff-view-waybills, body.ff-app .ff-view-waybills.ff-view-waybills-compact { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-waybills { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest compact final page guard. Keep the fixed checkbox pane and scrollable data pane on the same row metric. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest, body.ff-app .ff-generate-manifest.ff-view-compact { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; max-width: calc(var(--ff-grid-command-column-width) - 8px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest final chrome polish. Keep the checkbox/options headers narrow and remove the spare grid footer band. */ body.ff-app .ff-generate-manifest { --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 28px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest, body.ff-app .ff-generate-manifest.ff-view-compact { --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 28px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 30px; } body.ff-app .ff-generate-manifest .ff-manifest-grid-panel, body.ff-app .ff-generate-manifest .ff-manifest-grid-panel .panel-body, body.ff-app .ff-generate-manifest .ff-grid-result-row, body.ff-app .ff-generate-manifest .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { height: auto !important; max-height: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { min-height: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers :is(.dx-header-row, .dx-filter-row, .dx-datagrid-filter-row) > :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col) { height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: var(--ff-grid-row-height) !important; padding: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col) :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input-container, .dx-texteditor-input) { display: none !important; height: 0 !important; max-width: 0 !important; min-height: 0 !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { border-radius: 4px !important; height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; margin: 0 !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager, .dx-datagrid-bottom-load-panel) { margin-bottom: 0 !important; margin-top: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-pager, .dx-pager) { line-height: 22px !important; min-height: 22px !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-row { margin-top: 2px !important; } /* Processing view grids final variable override. Keep compact page-class views on compact metrics after all page-specific grid guards. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app[data-grid-font-size="small"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-debriefing), body.ff-app :is(.ff-view-waybills.ff-view-waybills-compact, .ff-view-collections.ff-view-compact, .ff-view-manifests.ff-view-compact, .ff-view-manifest-routes.ff-view-compact, .ff-debriefing.ff-view-compact) { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } /* View Manifest Routes header row lock. Fixed and scrollable header panes render separately, so clamp both to the active mode height. */ body.ff-app .ff-view-manifest-routes { --ff-route-header-row-height: 26px; --ff-route-filter-row-height: 24px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes, body.ff-app .ff-view-manifest-routes.ff-view-compact { --ff-route-header-row-height: 22px; --ff-route-filter-row-height: 22px; } body.ff-app[data-grid-font-size="large"] .ff-view-manifest-routes { --ff-route-header-row-height: 32px; --ff-route-filter-row-height: 28px; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-header-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-header-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-header-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-header-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-header-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-route-header-row-height) !important; line-height: calc(var(--ff-route-header-row-height) - 2px) !important; max-height: var(--ff-route-header-row-height) !important; min-height: var(--ff-route-header-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-header-padding-y) !important; padding-top: var(--ff-grid-header-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-header-row > td > *, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-header-row .dx-datagrid-text-content { line-height: calc(var(--ff-route-header-row-height) - 2px) !important; max-height: calc(var(--ff-route-header-row-height) - 2px) !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row > td, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-route-filter-row-height) !important; line-height: calc(var(--ff-route-filter-row-height) - 2px) !important; max-height: var(--ff-route-filter-row-height) !important; min-height: var(--ff-route-filter-row-height) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { height: calc(var(--ff-route-filter-row-height) - 2px) !important; line-height: calc(var(--ff-route-filter-row-height) - 4px) !important; max-height: calc(var(--ff-route-filter-row-height) - 2px) !important; min-height: 0 !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row .dx-texteditor-buttons-container, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row .dx-texteditor-button, body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row .dx-button-content { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-route-filter-row-height) - 2px) !important; line-height: calc(var(--ff-route-filter-row-height) - 4px) !important; max-height: calc(var(--ff-route-filter-row-height) - 2px) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-filter-row :is(.dx-icon-search, .dx-icon-filter-operation-default, .dx-icon-filter-operation-contains) { display: inline-block !important; line-height: calc(var(--ff-route-filter-row-height) - 5px) !important; margin-top: -2px !important; max-height: calc(var(--ff-route-filter-row-height) - 4px) !important; overflow: visible !important; vertical-align: top !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-route-header-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-route-header-row-height) - 4px) !important; margin: 0 auto !important; max-height: calc(var(--ff-route-header-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-headers .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-route-header-row-height) - 6px)) !important; width: min(14px, calc(var(--ff-route-header-row-height) - 6px)) !important; } /* View Waybills compact baseline; kept in sync with the final standard-grid lock. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills, body.ff-app .ff-view-waybills.ff-view-waybills-compact { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } /* View Waybills fixed-pane hard lock. Keep this at the end: its fixed columns and scrollable columns are separate DevExtreme tables. */ body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > tr > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > tr > td { border-bottom-width: 1px !important; box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; display: block !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifests compact fixed-pane hard lock. Compact mode needs the same clamp as View Waybills because fixed and scrollable panes are separate tables. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests, body.ff-app[data-grid-font-size="small"] .ff-view-manifests { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col), body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > tr > td { border-bottom-width: 1px !important; box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; display: block !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Quotes final fixed-pane hard lock. The page keeps ff-view-compact for layout, so use body density only for row metrics. */ body.ff-app .ff-view-quotes { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-quotes, body.ff-app[data-grid-font-size="small"] .ff-view-quotes { --ff-grid-row-height: 14px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-quotes { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-quote-command-col), body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-quote-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-quote-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; overflow-wrap: normal !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; display: block !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) { cursor: pointer !important; overflow: hidden !important; position: relative !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) :is(.dx-link, a, .dx-button, .dx-button-content) { align-items: center !important; display: flex !important; height: 100% !important; inset: 0 !important; justify-content: center !important; line-height: var(--ff-grid-row-height) !important; margin: 0 !important; max-height: none !important; min-height: 0 !important; padding: 0 !important; position: absolute !important; width: 100% !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) :is(.dx-link, a, .dx-button, .dx-button-content) :is(.dx-icon, .fa) { display: inline-flex !important; line-height: 1 !important; max-height: none !important; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-quote-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Debriefing final viewport fit. Reserve enough data-row area for the default visible page so the last row is not hidden behind a tiny internal scroll. */ body.ff-app .ff-debriefing #gridContainer, body.ff-app .ff-debriefing #gridContainer .dx-datagrid { min-height: max(calc(var(--ff-grid-row-height) * 30), calc(100vh - 335px)) !important; } body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-debriefing #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: max(calc(var(--ff-grid-row-height) * 27), calc(100vh - 425px)) !important; } body.ff-app .ff-debriefing .ff-grid-result-row, body.ff-app .ff-debriefing .ff-grid-result-row > [class*="col-"], body.ff-app .ff-debriefing #gridContainer { margin-bottom: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing #gridContainer :is(.dx-datagrid-pager, .dx-pager) { margin-bottom: 0 !important; padding-top: 4px !important; padding-bottom: 0 !important; } /* Debriefing compact mode: keep normal mode unchanged, but make true compact rows visibly smaller. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debriefing, body.ff-app[data-grid-font-size="small"] .ff-debriefing { --ff-grid-row-height: 16px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 20px; --ff-grid-command-column-width: 30px; --ff-debrief-select-column-width: 20px; --ff-debrief-filter-row-height: 24px; --ff-debrief-filter-editor-height: 20px; } body.ff-app.ff-grid-density-compact .ff-debriefing #gridContainer .dx-datagrid { font-size: 11px; } /* Debriefing compact viewport grid fit. The controller measures the grid's visible top edge and writes these variables so compact mode keeps the pager visible while rows scroll inside the grid. */ html:has(body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid), body.ff-app:has(.ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid), body.ff-app:has(.ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid) { overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid.dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid { height: var(--ff-debriefing-grid-height, calc(100dvh - 300px)) !important; max-height: var(--ff-debriefing-grid-height, calc(100dvh - 300px)) !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview { min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { max-height: none !important; min-height: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } /* View Tracking page-only final row-height lock. Keep this late so fixed select/action panes use the same metrics as the scrollable table. */ body.ff-app .ff-view-tracking { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking, body.ff-app[data-grid-font-size="small"] .ff-view-tracking { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-tracking { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 36px; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) { border-bottom-width: 1px !important; box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; display: block !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.ff-tracking-command-col, .dx-command-edit) .dx-link { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-button-text) { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Credits/Debits final fixed-pane lock. Keep this late so the fixed select/action panes cannot drift from the scrollable table in normal mode. */ body.ff-app .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-crdr, body.ff-app[data-grid-font-size="small"] .ff-view-crdr { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; } body.ff-app[data-grid-font-size="large"] .ff-view-crdr { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 28px; } body.ff-app .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-virtual-row, body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-virtual-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Debtors normal mode fixed-pane lock. Compact mode is already aligned; this only clamps normal mode so fixed and scrollable panes use the same row metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments final late normal-mode row lock. This is intentionally last because the payment grid has fixed and scrollable row panes in normal mode. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } /* Query grid final row-density lock. This keeps fixed command/select panes and scrollable data panes on the same row metric. */ body.ff-app .ff-query { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-query, body.ff-app[data-grid-font-size="small"] .ff-query { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand) { border-bottom-width: 1px !important; box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, input, .ff-grid-boolean-checkbox), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row a, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row button, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .label, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row .ff-grid-boolean-checkbox, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; display: block !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-command-edit .dx-link { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } /* Generate Invoice final row/header density lock. This page has fixed select/action columns, so lock fixed and scrollable tables in one place. */ body.ff-app .ff-generate-invoice { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-invoice-generate-header-row-height: 30px; --ff-invoice-generate-filter-row-height: 32px; --ff-invoice-generate-select-column-width: 20px; --ff-invoice-generate-command-column-width: 28px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-invoice-generate-header-row-height: 24px; --ff-invoice-generate-filter-row-height: 26px; --ff-invoice-generate-select-column-width: 20px; --ff-invoice-generate-command-column-width: 26px; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-header-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-header-row > td { box-sizing: border-box !important; height: var(--ff-invoice-generate-header-row-height) !important; line-height: calc(var(--ff-invoice-generate-header-row-height) - 4px) !important; max-height: var(--ff-invoice-generate-header-row-height) !important; min-height: var(--ff-invoice-generate-header-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-header-padding-y) !important; padding-top: var(--ff-grid-header-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-datagrid-filter-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-datagrid-filter-row > td { box-sizing: border-box !important; height: var(--ff-invoice-generate-filter-row-height) !important; line-height: calc(var(--ff-invoice-generate-filter-row-height) - 4px) !important; max-height: var(--ff-invoice-generate-filter-row-height) !important; min-height: var(--ff-invoice-generate-filter-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; overflow-wrap: normal !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { overflow: visible !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-select-column-width) !important; min-width: var(--ff-invoice-generate-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-generate-select-column-width) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { max-width: var(--ff-invoice-generate-select-column-width) !important; min-width: var(--ff-invoice-generate-select-column-width) !important; width: var(--ff-invoice-generate-select-column-width) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col) > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:nth-child(2) { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-command-column-width) !important; min-width: var(--ff-invoice-generate-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col) > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:nth-child(2) { max-width: var(--ff-invoice-generate-command-column-width) !important; min-width: var(--ff-invoice-generate-command-column-width) !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: calc(var(--ff-invoice-generate-filter-row-height) - 4px) !important; line-height: calc(var(--ff-invoice-generate-filter-row-height) - 4px) !important; max-height: calc(var(--ff-invoice-generate-filter-row-height) - 4px) !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row .dx-texteditor { margin-bottom: 1px !important; margin-top: 1px !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { margin-bottom: 0 !important; margin-top: 0 !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) .dx-editor-container { display: none !important; } /* Generate Manifest final late row-height lock. Keep this page-scoped so fixed and scrollable panes stay aligned in both density modes. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row .ff-manifest-row-actions, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row a, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row button, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .label, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments final normal-mode row lock override. Keep this late so the normal fixed select pane and scrollable pane stay on the same row metric. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row a, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row button, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row .label, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments normal mode fixed-pane lock. Compact mode is already aligned; this only clamps normal mode so fixed and scrollable panes use the same row metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-command-select { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Invoices normal mode fixed-pane lock. Compact mode is already handled above; this keeps the invoice and waybill grids aligned in normal mode. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Invoices final normal-mode row lock override. Sticky/fixed command columns can be rendered in separate panes, so lock both paths with the same metrics. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-invoices-command-column-width: 24px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-command-select > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers .dx-datagrid-content-fixed .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row .dx-command-select { max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-edit, .ff-invoice-view-command-col), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-edit, .ff-invoice-view-command-col) { max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-virtual-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-virtual-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-freespace-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Credits/Debits final normal-mode row lock override. Keep this after the shared finance grid rules so normal mode cannot drift between fixed and scrollable panes. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row a, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row button, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row .label, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-virtual-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-virtual-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Credits/Debits normal-mode fixed-pane hard lock. Keep compact mode alone; this only aligns the normal fixed select/action pane with the scrollable pane. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit) { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } /* Debtors final normal-mode row lock override. Keep this late so the normal fixed select pane and scrollable pane stay on the same row metric. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-template-wrapper, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-datagrid-text-content, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row a, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row button, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row .btn, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row .label, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments final late normal-mode row lock. This is intentionally last because the payment grid has fixed and scrollable row panes in normal mode. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > tr > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } /* View Payments final normal-mode fixed-pane hard lock. This must stay at the end of dx-custom.css so payment row metrics win in normal mode only. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit) { overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-virtual-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-virtual-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Manifests final row lock. Keep this late so compact mode can override the page row variable and normal mode keeps fixed/scrollable panes aligned. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 13px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; overflow-wrap: normal !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { overflow: visible !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-button, .dx-button-content), body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-manifests #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-manifests #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(13px, calc(var(--ff-grid-row-height) - 3px)) !important; width: min(13px, calc(var(--ff-grid-row-height) - 3px)) !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Generate Manifest absolute final guard. This page has fixed select/action panes; keep every rendered pane on the same row metric. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 28px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest, body.ff-app .ff-generate-manifest.ff-view-compact { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 28px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-manifest { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 30px; } body.ff-app .ff-generate-manifest .ff-manifest-grid-panel > .panel-heading { min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-heading-row { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-heading-row h4, body.ff-app .ff-generate-manifest .ff-manifest-grid-heading-row strong { line-height: 20px !important; margin-bottom: 0 !important; margin-top: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-grid-panel .panel-body { display: block !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-manifest .ff-grid-result-row, body.ff-app .ff-generate-manifest .ff-grid-result-row > .col-md-12 { display: block !important; flex: 0 0 auto !important; margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; overflow-wrap: normal !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; max-width: calc(var(--ff-grid-command-column-width) - 4px) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; vertical-align: middle !important; width: calc(var(--ff-grid-command-column-width) - 4px) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-text, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-dropdownbutton-toggle .dx-icon-spindown { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-icon, .fa) { color: var(--primary) !important; display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; opacity: 1 !important; padding: 0 !important; vertical-align: middle !important; visibility: visible !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager, .dx-datagrid-bottom-load-panel) { margin-bottom: 0 !important; margin-top: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-footer-row { margin-top: 0 !important; padding-top: 0 !important; } /* Generate Manifest row-height parity repair. DevExtreme renders the fixed select/action pane and scrollable pane as separate tables. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox, .dx-button, .dx-button-content), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-dropdownbutton):not(.ff-manifest-row-actions):not(.dx-texteditor), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-dropdownbutton):not(.ff-manifest-row-actions):not(.dx-texteditor), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-button):not(.dx-dropdownbutton):not(.ff-manifest-row-actions):not(.dx-texteditor) { box-sizing: border-box !important; display: inline-block !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { line-height: 1 !important; top: calc(50% - 1px) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content > .dx-icon { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content::before { color: var(--primary) !important; content: "\f142"; display: inline-block !important; font-family: FontAwesome; font-size: 14px !important; height: calc(var(--ff-grid-row-height) - 6px) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; text-align: center !important; width: 14px !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-datagrid-content { padding-bottom: 0 !important; } /* View Invoices absolute final normal-mode row lock. Compact mode is already aligned; this only clamps the normal fixed/action panes. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-invoices-command-column-width: 24px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-view-command-col), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-view-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-link) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Invoices normal-mode final alignment guard. Keep compact mode untouched; normal mode was still getting uneven fixed/scrollable row heights. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content, .dx-datagrid-content, .dx-datagrid-content-fixed) { margin-top: 0 !important; padding-top: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } /* View Payments after-all page guard. This stays after the older payment rules so normal mode uses one row metric. */ body.ff-app .ff-view-payments .ff-finance-user-group, body.ff-app .ff-view-payments .ff-finance-user-row { display: contents !important; } body.ff-app .ff-view-payments .ff-finance-user-filter, body.ff-app .ff-view-payments .ff-finance-webuser-filter, body.ff-app .ff-view-payments .ff-finance-acc-filter { flex: 0 1 220px !important; float: none !important; max-width: 300px !important; min-width: 170px !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field, body.ff-app .ff-view-payments .ff-finance-payment-actions { align-self: flex-start !important; padding-top: 18px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-payment-unsettled-field, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-finance-payment-actions { padding-top: 14px !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .valuesonly { align-items: center !important; display: inline-flex !important; height: var(--ff-control-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-height) !important; } body.ff-app .ff-view-payments .ff-finance-payment-actions .ff-finance-search { align-self: center !important; height: var(--ff-control-height) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-payments-check-size: 14px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-payments-check-size) !important; left: 50% !important; line-height: var(--ff-view-payments-check-size) !important; margin: 0 !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-view-payments-check-size) !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Credits/Debits absolute final normal-mode row lock. Compact mode is already aligned; this only clamps the normal fixed/action panes. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-link) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Waybills staged density lock. The actual final override is repeated at EOF because later page locks follow this legacy block. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; --ff-standard-grid-action-size: 14px; --ff-view-waybill-check-width: 14px; --ff-view-waybill-check-height: 14px; --ff-view-waybill-check-size: var(--ff-view-waybill-check-width); --ff-view-waybill-action-icon-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills, body.ff-app[data-grid-font-size="small"] .ff-view-waybills, body.ff-app .ff-view-waybills.ff-view-waybills-compact { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; --ff-standard-grid-action-size: 14px; --ff-view-waybill-check-width: 14px; --ff-view-waybill-check-height: 14px; --ff-view-waybill-check-size: var(--ff-view-waybill-check-width); --ff-view-waybill-action-icon-size: 14px; --ff-view-waybill-compact-check-size: var(--ff-view-waybill-check-width); --ff-view-waybill-compact-action-icon-size: 14px; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { aspect-ratio: 1 / 1 !important; height: var(--ff-view-waybill-check-size) !important; left: 50% !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; display: inline-flex !important; height: var(--ff-view-waybill-check-size) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 4px !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-view-waybill-check-size) !important; height: var(--ff-view-waybill-check-size) !important; line-height: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-edit :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-waybill-action-icon-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-waybill-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-action-icon-size) !important; max-width: var(--ff-grid-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-view-waybill-action-icon-size) !important; height: var(--ff-view-waybill-action-icon-size) !important; line-height: var(--ff-view-waybill-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-action-icon-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifests final pane parity repair. The fixed select/action pane must use the same row metric as the scrollable pane. */ body.ff-app .ff-view-manifests { --ff-view-manifests-fixed-row-height: var(--ff-grid-row-height); } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-manifests-command-column-width) !important; min-width: var(--ff-view-manifests-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-manifests-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-manifests-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-manifests-check-size) !important; margin: 0 !important; max-height: var(--ff-view-manifests-check-size) !important; max-width: var(--ff-view-manifests-check-size) !important; min-height: var(--ff-view-manifests-check-size) !important; min-width: var(--ff-view-manifests-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-manifests-check-size) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-view-manifests-check-size) !important; line-height: var(--ff-view-manifests-check-size) !important; max-height: var(--ff-view-manifests-check-size) !important; max-width: var(--ff-view-manifests-check-size) !important; min-height: var(--ff-view-manifests-check-size) !important; min-width: var(--ff-view-manifests-check-size) !important; width: var(--ff-view-manifests-check-size) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-view-manifests-check-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-link, a), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col :is(.dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-grid-row-height) !important; justify-content: center !important; left: calc(50% - 1px) !important; line-height: var(--ff-grid-row-height) !important; margin: 0 !important; max-height: var(--ff-grid-row-height) !important; max-width: var(--ff-view-manifests-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-manifests-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-row-actions :is(.dx-icon, .dx-icon-overflow, .fa), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col .ff-manifest-view-link .fa { display: inline-block !important; font-size: var(--ff-view-manifests-action-size) !important; height: var(--ff-view-manifests-action-size) !important; line-height: var(--ff-view-manifests-action-size) !important; margin: 0 !important; max-height: var(--ff-view-manifests-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; transform: none !important; width: auto !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest final page-only grid correction. Keep this after the other page locks so older Generate Manifest rules cannot reopen row height gaps. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 24px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 28px; --ff-grid-command-column-width: 28px; --ff-manifest-checkbox-size: 14px; --ff-manifest-action-icon-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest, body.ff-app .ff-generate-manifest.ff-view-compact { --ff-grid-row-height: 12px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 26px; --ff-manifest-checkbox-size: 10px; --ff-manifest-action-icon-size: 12px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-manifest { --ff-grid-row-height: 28px; --ff-manifest-checkbox-size: 15px; --ff-manifest-action-icon-size: 15px; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-select-col, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: var(--ff-grid-row-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 2px !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) { padding-left: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; border-radius: 3px !important; display: inline-flex !important; height: var(--ff-manifest-checkbox-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-manifest-checkbox-size) !important; margin: 0 !important; max-height: var(--ff-manifest-checkbox-size) !important; max-width: var(--ff-manifest-checkbox-size) !important; min-height: var(--ff-manifest-checkbox-size) !important; min-width: var(--ff-manifest-checkbox-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-manifest-checkbox-size) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-manifest-checkbox-size) !important; line-height: var(--ff-manifest-checkbox-size) !important; max-height: var(--ff-manifest-checkbox-size) !important; max-width: var(--ff-manifest-checkbox-size) !important; min-height: var(--ff-manifest-checkbox-size) !important; min-width: var(--ff-manifest-checkbox-size) !important; position: relative !important; width: var(--ff-manifest-checkbox-size) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-manifest-checkbox-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-grid-row-height) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-grid-row-height) !important; margin: 0 !important; max-height: var(--ff-grid-row-height) !important; max-width: var(--ff-grid-command-column-width) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content > :is(.dx-icon, .fa), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content :is(.dx-icon, .fa, [class*="fa-"]), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-text, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-dropdownbutton-toggle .dx-icon-spindown { display: none !important; font-size: 0 !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content::before { color: var(--primary) !important; content: "\f142"; display: inline-block !important; font-family: FontAwesome; font-size: var(--ff-manifest-action-icon-size) !important; height: var(--ff-manifest-action-icon-size) !important; line-height: var(--ff-manifest-action-icon-size) !important; margin: 0 !important; text-align: center !important; width: var(--ff-manifest-action-icon-size) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) { border: 0 !important; display: table-row !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; visibility: collapse !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: table-cell !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; visibility: collapse !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr > td { min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Quotes page-only chrome spacing. Keep separate from row-height rules; this only removes empty toolbar/footer gaps. */ body.ff-app .ff-view-quotes .ff-grid-toolbar-row { margin-bottom: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-quotes .ff-grid-toolbar-inner { min-height: 22px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-quotes .ff-grid-toolbar-row + .ff-grid-result-row, body.ff-app .ff-view-quotes .ff-grid-result-row, body.ff-app .ff-view-quotes .ff-grid-result-row > .col-md-12 { margin-top: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-header-panel { margin-bottom: 0 !important; margin-top: -24px !important; min-height: 24px !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-header-panel .dx-toolbar, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-header-panel .dx-toolbar-items-container { height: 24px !important; min-height: 24px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview { margin-bottom: 0 !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer { margin-top: 0 !important; } /* View Quotes page-only EOF row lock. Keep isolated from the shared grid rules so fixing this page cannot move other view grids. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes { --ff-grid-row-height: 24px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; --ff-view-quotes-check-size: 14px; --ff-view-quotes-action-icon-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-quotes, body.ff-app[data-grid-font-size="small"] .ff-view-quotes, body.ff-app .ff-view-quotes.ff-view-quotes-compact { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; --ff-view-quotes-check-size: 14px; --ff-view-quotes-action-icon-size: 16px; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-quote-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-quote-command-col), body.ff-app .ff-view-quotes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-quote-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-quotes-check-size) !important; left: 50% !important; line-height: var(--ff-view-quotes-check-size) !important; margin: 0 !important; max-height: var(--ff-view-quotes-check-size) !important; max-width: var(--ff-view-quotes-check-size) !important; min-height: var(--ff-view-quotes-check-size) !important; min-width: var(--ff-view-quotes-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-quotes-check-size) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-view-quotes-check-size) !important; line-height: var(--ff-view-quotes-check-size) !important; max-height: var(--ff-view-quotes-check-size) !important; max-width: var(--ff-view-quotes-check-size) !important; min-height: var(--ff-view-quotes-check-size) !important; min-width: var(--ff-view-quotes-check-size) !important; width: var(--ff-view-quotes-check-size) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app .ff-view-quotes #gridContainer .ff-quote-command-col :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-quotes-action-icon-size) !important; justify-content: center !important; line-height: var(--ff-view-quotes-action-icon-size) !important; margin: 0 auto !important; max-height: var(--ff-view-quotes-action-icon-size) !important; max-width: var(--ff-grid-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: relative !important; top: 1px !important; transform: none !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa), body.ff-app .ff-view-quotes #gridContainer .ff-quote-command-col :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-view-quotes-action-icon-size) !important; height: var(--ff-view-quotes-action-icon-size) !important; line-height: var(--ff-view-quotes-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-quotes-action-icon-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-quote-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Tariffs absolute final row-height lock. Keep the editable scrollable pane and the fixed selection pane on the same row metric. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-tariffs-command-column-width: 34px; --ff-tariffs-check-size: 14px; --ff-tariffs-action-size: 16px; } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-tariffs-command-column-width: 32px; --ff-tariffs-check-size: 12px; --ff-tariffs-action-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 30px; --ff-tariffs-command-column-width: 38px; --ff-tariffs-check-size: 16px; --ff-tariffs-action-size: 18px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-tariffs { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-tariffs-command-column-width: 32px; --ff-tariffs-check-size: 12px; --ff-tariffs-action-size: 14px; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { border-bottom-width: 1px !important; box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; overflow-wrap: normal !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; word-break: normal !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-editor-cell :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height) - 2px) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-tariffs #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-tariffs #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-tariffs #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app .ff-tariffs #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { box-sizing: border-box !important; max-width: var(--ff-tariffs-command-column-width) !important; min-width: var(--ff-tariffs-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-tariffs-command-column-width) !important; } body.ff-app .ff-tariffs #gridContainer .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-tariffs-check-size) !important; left: 50% !important; line-height: var(--ff-tariffs-check-size) !important; margin: 0 !important; max-height: var(--ff-tariffs-check-size) !important; max-width: var(--ff-tariffs-check-size) !important; min-height: var(--ff-tariffs-check-size) !important; min-width: var(--ff-tariffs-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-tariffs-check-size) !important; } body.ff-app .ff-tariffs #gridContainer .dx-command-select .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-tariffs-check-size) !important; max-height: var(--ff-tariffs-check-size) !important; max-width: var(--ff-tariffs-check-size) !important; min-height: var(--ff-tariffs-check-size) !important; min-width: var(--ff-tariffs-check-size) !important; width: var(--ff-tariffs-check-size) !important; } body.ff-app .ff-tariffs #gridContainer .dx-command-edit :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-tariffs-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-tariffs-action-size) !important; margin: 0 !important; max-height: var(--ff-tariffs-action-size) !important; max-width: var(--ff-tariffs-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tariffs-command-column-width) !important; } body.ff-app .ff-tariffs #gridContainer .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-tariffs-action-size) !important; height: var(--ff-tariffs-action-size) !important; line-height: var(--ff-tariffs-action-size) !important; margin: 0 !important; max-height: var(--ff-tariffs-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments final page overrides. Keep finance filter wrapping page-specific: User, Webuser, and Acc # must wrap independently. */ body.ff-app .ff-view-payments .ff-finance-user-group, body.ff-app .ff-view-payments .ff-finance-user-row { display: contents !important; } body.ff-app .ff-view-payments .ff-finance-user-filter, body.ff-app .ff-view-payments .ff-finance-webuser-filter, body.ff-app .ff-view-payments .ff-finance-acc-filter { flex: 0 1 220px !important; float: none !important; max-width: 300px !important; min-width: 170px !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field, body.ff-app .ff-view-payments .ff-finance-payment-actions { align-self: flex-start !important; padding-top: 18px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-payment-unsettled-field, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-finance-payment-actions { padding-top: 14px !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .valuesonly { align-items: center !important; display: inline-flex !important; height: var(--ff-control-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-height) !important; } body.ff-app .ff-view-payments .ff-finance-payment-actions .ff-finance-search { align-self: center !important; height: var(--ff-control-height) !important; } /* View Payments final normal-mode row lock. Compact mode already lines up; normal mode needs both fixed and scrollable panes clamped together. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-payments-check-size: 14px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-payments-check-size) !important; left: 50% !important; line-height: var(--ff-view-payments-check-size) !important; margin: 0 !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-view-payments-check-size) !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Debtors absolute final normal-mode row lock. Compact mode is already aligned; keep this last so later finance grid rules do not stretch the normal fixed pane. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-debtors-check-size: 14px; --ff-debtors-action-size: 16px; } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-debtors-check-size: 12px; --ff-debtors-action-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 30px; --ff-debtors-check-size: 16px; --ff-debtors-action-size: 18px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { height: var(--ff-grid-row-height) !important; line-height: var(--ff-grid-row-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-debtors-check-size) !important; left: 50% !important; line-height: var(--ff-debtors-check-size) !important; margin: 0 !important; max-height: var(--ff-debtors-check-size) !important; max-width: var(--ff-debtors-check-size) !important; min-height: var(--ff-debtors-check-size) !important; min-width: var(--ff-debtors-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-debtors-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-command-select .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-debtors-check-size) !important; max-height: var(--ff-debtors-check-size) !important; max-width: var(--ff-debtors-check-size) !important; min-height: var(--ff-debtors-check-size) !important; min-width: var(--ff-debtors-check-size) !important; width: var(--ff-debtors-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-link) { align-items: center !important; display: inline-flex !important; height: var(--ff-debtors-action-size) !important; justify-content: center !important; line-height: var(--ff-debtors-action-size) !important; margin: 0 !important; max-height: var(--ff-debtors-action-size) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-debtors-action-size) !important; height: var(--ff-debtors-action-size) !important; line-height: var(--ff-debtors-action-size) !important; margin: 0 !important; max-height: var(--ff-debtors-action-size) !important; min-height: 0 !important; padding: 0 !important; width: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments page-specific filter compression and final normal-mode grid row lock. */ body.ff-app .ff-view-payments .ff-finance-primary-filters, body.ff-app .ff-view-payments .ff-finance-secondary-filters, body.ff-app .ff-view-payments .ff-finance-payment-options-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 0 12px !important; margin-bottom: 0 !important; } body.ff-app .ff-view-payments .ff-finance-primary-filters > [class*="col-"], body.ff-app .ff-view-payments .ff-finance-secondary-filters > [class*="col-"], body.ff-app .ff-view-payments .ff-finance-payment-options-row > [class*="col-"] { float: none !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-view-payments .ff-finance-primary-filters .form-group, body.ff-app .ff-view-payments .ff-finance-secondary-filters .form-group, body.ff-app .ff-view-payments .ff-finance-payment-options-row .form-group { margin-bottom: 2px !important; } body.ff-app .ff-view-payments .ff-finance-payment-id { flex: 0 1 130px !important; max-width: 150px !important; } body.ff-app .ff-view-payments .ff-finance-date-block { flex: 1 1 430px !important; max-width: 540px !important; } body.ff-app .ff-view-payments .ff-finance-branch-filter { flex: 1 1 220px !important; max-width: 310px !important; } body.ff-app .ff-view-payments .ff-finance-client-filter { flex: 2 1 360px !important; min-width: 280px !important; } body.ff-app .ff-view-payments .ff-payment-group-field { flex: 0 1 190px !important; } body.ff-app .ff-view-payments .ff-payment-order-field { flex: 0 1 200px !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field { align-items: center !important; display: flex !important; flex: 0 0 150px !important; min-height: var(--ff-control-height) !important; padding-top: 18px !important; } body.ff-app .ff-view-payments .ff-finance-payment-actions { align-items: center !important; display: flex !important; flex: 1 1 460px !important; gap: 0 14px !important; justify-content: flex-end !important; min-height: var(--ff-control-height) !important; padding-top: 18px !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .valuesonly { align-items: center !important; display: inline-flex !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-height) !important; } body.ff-app .ff-view-payments .ff-finance-payment-actions .ff-finance-search { flex: 0 0 140px !important; margin-left: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-payment-unsettled-field, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-finance-payment-actions { padding-top: 14px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; justify-content: center !important; line-height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; margin: 0 auto !important; max-height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; max-width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; vertical-align: middle !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { box-sizing: border-box !important; height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; max-height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; max-width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; min-height: 0 !important; min-width: 0 !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments absolute final normal-mode row lock. Compact mode is already aligned; this only clamps the normal fixed/action panes. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-link) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-icon, .fa) { display: inline-block !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; max-height: calc(var(--ff-grid-row-height) - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; width: min(14px, calc(var(--ff-grid-row-height) - 4px)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifests absolute final row lock. The page always has ff-view-compact, so normal/compact density must be decided from the body state only. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-manifests-command-column-width: 34px; --ff-view-manifests-row-height: 40px; --ff-view-manifests-check-height: 14px; --ff-view-manifests-check-left: 50%; --ff-view-manifests-check-size: 14px; --ff-view-manifests-check-width: 14px; --ff-view-manifests-action-size: 16px; --ff-view-manifests-fixed-row-height: var(--ff-view-manifests-row-height); } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-view-manifests-command-column-width: 32px; --ff-view-manifests-row-height: var(--ff-grid-row-height); --ff-view-manifests-check-height: 12px; --ff-view-manifests-check-left: 50%; --ff-view-manifests-check-size: 12px; --ff-view-manifests-check-width: 12px; --ff-view-manifests-action-size: 14px; --ff-view-manifests-fixed-row-height: var(--ff-grid-row-height); } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 30px; --ff-view-manifests-command-column-width: 38px; --ff-view-manifests-row-height: var(--ff-grid-row-height); --ff-view-manifests-check-height: 16px; --ff-view-manifests-check-left: 50%; --ff-view-manifests-check-size: 16px; --ff-view-manifests-check-width: 16px; --ff-view-manifests-action-size: 18px; --ff-view-manifests-fixed-row-height: var(--ff-grid-row-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-view-manifests-command-column-width: 32px; --ff-view-manifests-row-height: 33px; --ff-view-manifests-check-height: 11px; --ff-view-manifests-check-left: 50%; --ff-view-manifests-check-size: 12px; --ff-view-manifests-check-width: 12px; --ff-view-manifests-action-size: 15px; --ff-view-manifests-fixed-row-height: var(--ff-view-manifests-row-height); } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-manifests-command-column-width) !important; min-width: var(--ff-view-manifests-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-manifests-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; line-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; max-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { border-radius: 3px !important; height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; left: var(--ff-view-manifests-check-left, 50%) !important; line-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; margin: 0 !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-select .dx-checkbox-icon { border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-manifests-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-manifests-action-size) !important; margin: 0 !important; max-height: var(--ff-view-manifests-action-size) !important; max-width: var(--ff-view-manifests-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-manifests-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-link, a), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col :is(.dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; justify-content: center !important; left: calc(50% - 1px) !important; line-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; margin: 0 !important; max-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; max-width: var(--ff-view-manifests-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-manifests-command-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-row-actions :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-view-manifests-action-size) !important; height: var(--ff-view-manifests-action-size) !important; line-height: var(--ff-view-manifests-action-size) !important; margin: 0 !important; max-height: var(--ff-view-manifests-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit .fa-eye { color: var(--ff-primary, var(--primary)) !important; font-family: FontAwesome !important; opacity: 1 !important; transform: translateY(-1px) !important; visibility: visible !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td.ff-manifest-command-col::before, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td.dx-command-edit::before { content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td:not(.dx-command-select) > :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; left: auto !important; line-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; margin: 0 auto !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; position: static !important; top: auto !important; transform: none !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox-icon { border-radius: 3px !important; height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit .ff-manifest-view-link, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col .ff-manifest-view-link { color: var(--ff-primary, var(--primary)) !important; opacity: 1 !important; overflow: visible !important; text-decoration: none !important; visibility: visible !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-command-edit .ff-manifest-view-link .fa, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .ff-manifest-command-col .ff-manifest-view-link .fa { color: var(--ff-primary, var(--primary)) !important; display: inline-block !important; font-family: FontAwesome !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { height: var(--ff-view-manifests-fixed-row-height) !important; line-height: calc(var(--ff-view-manifests-fixed-row-height) - 2px) !important; max-height: var(--ff-view-manifests-fixed-row-height) !important; min-height: var(--ff-view-manifests-fixed-row-height) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-command-edit :is(.dx-link, a), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed .ff-manifest-command-col :is(.dx-link, a) { height: var(--ff-view-manifests-fixed-row-height) !important; line-height: var(--ff-view-manifests-fixed-row-height) !important; max-height: var(--ff-view-manifests-fixed-row-height) !important; } /* Generate Invoice absolute final normal-mode row lock. This mirrors the fixed/scrollable pane lock used on the corrected view grids. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-invoice-generate-select-column-width: 28px; --ff-invoice-generate-command-column-width: 34px; --ff-invoice-generate-check-size: 14px; --ff-invoice-generate-action-size: 16px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-select-column-width) !important; min-width: var(--ff-invoice-generate-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-invoice-generate-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:nth-child(2) { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-command-column-width) !important; min-width: var(--ff-invoice-generate-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview td :is(span, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { height: var(--ff-grid-row-height) !important; line-height: var(--ff-grid-row-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-invoice-generate-check-size) !important; left: 50% !important; line-height: var(--ff-invoice-generate-check-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-check-size) !important; max-width: var(--ff-invoice-generate-check-size) !important; min-height: var(--ff-invoice-generate-check-size) !important; min-width: var(--ff-invoice-generate-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-invoice-generate-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-invoice-generate-check-size) !important; max-height: var(--ff-invoice-generate-check-size) !important; max-width: var(--ff-invoice-generate-check-size) !important; min-height: var(--ff-invoice-generate-check-size) !important; min-width: var(--ff-invoice-generate-check-size) !important; width: var(--ff-invoice-generate-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-button, .dx-dropdownbutton, .dx-link) { align-items: center !important; display: inline-flex !important; height: var(--ff-invoice-generate-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; max-width: var(--ff-invoice-generate-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-invoice-generate-action-size) !important; justify-content: center !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-invoice-generate-action-size) !important; height: var(--ff-invoice-generate-action-size) !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Payments final after-payment-rules guard. Keep this after older payment blocks so normal mode does not drift from compact mode. */ body.ff-app .ff-view-payments .ff-finance-user-group, body.ff-app .ff-view-payments .ff-finance-user-row { display: contents !important; } body.ff-app .ff-view-payments .ff-finance-user-filter, body.ff-app .ff-view-payments .ff-finance-webuser-filter, body.ff-app .ff-view-payments .ff-finance-acc-filter { flex: 0 1 220px !important; float: none !important; max-width: 300px !important; min-width: 170px !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field, body.ff-app .ff-view-payments .ff-finance-payment-actions { align-self: flex-start !important; padding-top: 18px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-payment-unsettled-field, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments .ff-finance-payment-actions { padding-top: 14px !important; } body.ff-app .ff-view-payments .ff-payment-unsettled-field .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .checkbox, body.ff-app .ff-view-payments .ff-finance-payment-actions .valuesonly { align-items: center !important; display: inline-flex !important; height: var(--ff-control-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-height) !important; } body.ff-app .ff-view-payments .ff-finance-payment-actions .ff-finance-search { align-self: center !important; height: var(--ff-control-height) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-payments-check-size: 14px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-payments-check-size) !important; left: 50% !important; line-height: var(--ff-view-payments-check-size) !important; margin: 0 !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-view-payments-check-size) !important; max-height: var(--ff-view-payments-check-size) !important; max-width: var(--ff-view-payments-check-size) !important; min-height: var(--ff-view-payments-check-size) !important; min-width: var(--ff-view-payments-check-size) !important; width: var(--ff-view-payments-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Credits/Debits absolute final normal-mode row lock. The page root carries ff-view-compact for legacy layout, so only body density decides compact mode. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-view-crdr-command-column-width: 50px; --ff-view-crdr-check-size: 14px; --ff-view-crdr-action-size: 16px; } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-view-crdr-check-size: 12px; --ff-view-crdr-action-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-grid-select-column-width: 30px; --ff-view-crdr-check-size: 16px; --ff-view-crdr-action-size: 18px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { box-sizing: border-box !important; max-width: var(--ff-view-crdr-command-column-width) !important; min-width: var(--ff-view-crdr-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-crdr-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { height: var(--ff-grid-row-height) !important; line-height: var(--ff-grid-row-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: var(--ff-view-crdr-check-size) !important; left: 50% !important; line-height: var(--ff-view-crdr-check-size) !important; margin: 0 !important; max-height: var(--ff-view-crdr-check-size) !important; max-width: var(--ff-view-crdr-check-size) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-crdr-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-select .dx-checkbox-icon { box-sizing: border-box !important; height: var(--ff-view-crdr-check-size) !important; max-height: var(--ff-view-crdr-check-size) !important; max-width: var(--ff-view-crdr-check-size) !important; min-height: 0 !important; min-width: 0 !important; width: var(--ff-view-crdr-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-edit :is(.dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-crdr-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-crdr-action-size) !important; margin: 0 !important; max-height: var(--ff-view-crdr-action-size) !important; max-width: var(--ff-view-crdr-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-crdr-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-view-crdr-action-size) !important; height: var(--ff-view-crdr-action-size) !important; line-height: var(--ff-view-crdr-action-size) !important; margin: 0 !important; max-height: var(--ff-view-crdr-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Waybills compact density lock. The page no longer switches between normal and compact grid density. */ body.ff-app .ff-view-waybills { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; --ff-standard-grid-action-size: 14px; --ff-view-waybill-check-width: 14px; --ff-view-waybill-check-height: 14px; --ff-view-waybill-check-size: var(--ff-view-waybill-check-width); --ff-view-waybill-action-icon-size: 14px; --ff-view-waybill-compact-check-size: var(--ff-view-waybill-check-width); --ff-view-waybill-compact-action-icon-size: 14px; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { aspect-ratio: 1 / 1 !important; height: var(--ff-view-waybill-check-size) !important; left: 50% !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; display: inline-flex !important; height: var(--ff-view-waybill-check-size) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 4px !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-view-waybill-check-size) !important; height: var(--ff-view-waybill-check-size) !important; line-height: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-edit :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-waybill-action-icon-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-waybill-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-action-icon-size) !important; max-width: var(--ff-grid-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-view-waybill-action-icon-size) !important; height: var(--ff-view-waybill-action-icon-size) !important; line-height: var(--ff-view-waybill-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-action-icon-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit) .dx-editor-container { display: none !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Waybills checkbox shape lock. */ body.ff-app .ff-view-waybills { --ff-view-waybill-check-width: 14px; --ff-view-waybill-check-height: 14px; --ff-view-waybill-check-size: 14px; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-waybill-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-icon { border-radius: 3px !important; box-sizing: border-box !important; display: block !important; height: var(--ff-view-waybill-check-size) !important; line-height: var(--ff-view-waybill-check-size) !important; margin: 0 !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app[data-grid-font-size="small"] .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-waybills.ff-view-waybills-compact :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { aspect-ratio: 1 / 1 !important; flex: 0 0 var(--ff-view-waybill-check-size) !important; height: var(--ff-view-waybill-check-size) !important; line-height: var(--ff-view-waybill-check-size) !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon, body.ff-app[data-grid-font-size="small"] .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon, body.ff-app .ff-view-waybills.ff-view-waybills-compact :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: 3px !important; display: block !important; flex: 0 0 var(--ff-view-waybill-check-size) !important; height: var(--ff-view-waybill-check-size) !important; line-height: var(--ff-view-waybill-check-size) !important; max-height: var(--ff-view-waybill-check-size) !important; max-width: var(--ff-view-waybill-check-size) !important; min-height: var(--ff-view-waybill-check-size) !important; min-width: var(--ff-view-waybill-check-size) !important; transform: none !important; width: var(--ff-view-waybill-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-view-waybill-check-size) - 2px) !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; } /* Shared first-pass view-grid selector/action standard. Keep after page locks so row selector checkboxes match View Waybills and eye icons match View Quotes. */ body.ff-app :is(.ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation) { --ff-view-grid-action-icon-size: 16px; --ff-view-grid-row-selector-radius: 3px; --ff-view-grid-row-selector-size: 14px; } body.ff-app :is(.ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select, body.ff-app :is(.ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select > td { overflow: visible !important; position: relative !important; } body.ff-app :is(.ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-view-grid-row-selector-size) !important; height: var(--ff-view-grid-row-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-grid-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-view-grid-row-selector-size) !important; max-width: var(--ff-view-grid-row-selector-size) !important; min-height: var(--ff-view-grid-row-selector-size) !important; min-width: var(--ff-view-grid-row-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-grid-row-selector-size) !important; } body.ff-app :is(.ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-view-grid-row-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-view-grid-row-selector-size) !important; height: var(--ff-view-grid-row-selector-size) !important; line-height: var(--ff-view-grid-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-view-grid-row-selector-size) !important; max-width: var(--ff-view-grid-row-selector-size) !important; min-height: var(--ff-view-grid-row-selector-size) !important; min-width: var(--ff-view-grid-row-selector-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-view-grid-row-selector-size) !important; } body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-edit, body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.ff-manifest-command-col, .ff-quote-command-col, .ff-invoice-view-command-col, .ff-image-command-col, .ff-tracking-command-col) { cursor: pointer !important; overflow: visible !important; position: relative !important; } body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.ff-manifest-command-col, .ff-quote-command-col, .ff-invoice-view-command-col, .ff-image-command-col, .ff-tracking-command-col) :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-grid-action-icon-size) !important; justify-content: center !important; line-height: var(--ff-view-grid-action-icon-size) !important; margin: 0 auto !important; max-height: var(--ff-view-grid-action-icon-size) !important; max-width: var(--ff-grid-command-column-width, 34px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: relative !important; top: 1px !important; transform: none !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width, 34px) !important; } body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-edit .dx-button-text, body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.ff-manifest-command-col, .ff-quote-command-col, .ff-invoice-view-command-col, .ff-image-command-col, .ff-tracking-command-col) .dx-button-text { display: none !important; font-size: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-edit .fa-eye, body.ff-app :is(.ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-imaging-list, .ff-view-tracking) :is(#gridContainer, #clientGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.ff-manifest-command-col, .ff-quote-command-col, .ff-invoice-view-command-col, .ff-image-command-col, .ff-tracking-command-col) .fa-eye { display: inline-block !important; font-size: var(--ff-view-grid-action-icon-size) !important; height: var(--ff-view-grid-action-icon-size) !important; line-height: var(--ff-view-grid-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-view-grid-action-icon-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } /* Generate Manifest selector checkbox shape lock. Kept separate from the view/query first-pass rule because this is a generate workflow. */ body.ff-app .ff-generate-manifest { --ff-generate-manifest-check-radius: 3px; --ff-generate-manifest-check-size: 14px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-generate-manifest-check-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-generate-manifest-check-size: 14px; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select > td { overflow: visible !important; position: relative !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-generate-manifest-check-size) !important; height: var(--ff-generate-manifest-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-manifest-check-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-check-size) !important; max-width: var(--ff-generate-manifest-check-size) !important; min-height: var(--ff-generate-manifest-check-size) !important; min-width: var(--ff-generate-manifest-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-generate-manifest-check-size) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-generate-manifest-check-size) !important; height: var(--ff-generate-manifest-check-size) !important; justify-content: center !important; line-height: var(--ff-generate-manifest-check-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-check-size) !important; max-width: var(--ff-generate-manifest-check-size) !important; min-height: var(--ff-generate-manifest-check-size) !important; min-width: var(--ff-generate-manifest-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-generate-manifest-check-size) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-generate-manifest-check-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-generate-manifest-check-size) !important; height: var(--ff-generate-manifest-check-size) !important; line-height: var(--ff-generate-manifest-check-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-check-size) !important; max-width: var(--ff-generate-manifest-check-size) !important; min-height: var(--ff-generate-manifest-check-size) !important; min-width: var(--ff-generate-manifest-check-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-generate-manifest-check-size) !important; } /* Debriefing selector checkbox shape lock. Kept separate from row-height rules so the accepted grid density is not changed. */ body.ff-app .ff-debriefing { --ff-debriefing-check-radius: 3px; --ff-debriefing-check-size: 14px; } body.ff-app[data-grid-font-size="large"] .ff-debriefing { --ff-debriefing-check-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debriefing, body.ff-app[data-grid-font-size="small"] .ff-debriefing, body.ff-app .ff-debriefing.ff-view-compact { --ff-debriefing-check-size: 14px; } body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select > td { overflow: visible !important; position: relative !important; } body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-debriefing-check-size) !important; height: var(--ff-debriefing-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-debriefing-check-size) !important; margin: 0 !important; max-height: var(--ff-debriefing-check-size) !important; max-width: var(--ff-debriefing-check-size) !important; min-height: var(--ff-debriefing-check-size) !important; min-width: var(--ff-debriefing-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-debriefing-check-size) !important; } body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-debriefing-check-size) !important; height: var(--ff-debriefing-check-size) !important; justify-content: center !important; line-height: var(--ff-debriefing-check-size) !important; margin: 0 !important; max-height: var(--ff-debriefing-check-size) !important; max-width: var(--ff-debriefing-check-size) !important; min-height: var(--ff-debriefing-check-size) !important; min-width: var(--ff-debriefing-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-debriefing-check-size) !important; } body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-debriefing-check-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-debriefing-check-size) !important; height: var(--ff-debriefing-check-size) !important; line-height: var(--ff-debriefing-check-size) !important; margin: 0 !important; max-height: var(--ff-debriefing-check-size) !important; max-width: var(--ff-debriefing-check-size) !important; min-height: var(--ff-debriefing-check-size) !important; min-width: var(--ff-debriefing-check-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-debriefing-check-size) !important; } body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-debriefing :is(#gridContainer, #gridContainer2) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { top: calc(50% - 1px) !important; } /* View Quotes action icon centre lock. Keep after the shared eye-icon rule so the quote eye sits in the cell centre. */ body.ff-app .ff-view-quotes { --ff-view-quotes-action-size: 16px; --ff-view-quotes-command-column-width: 34px; } body.ff-app[data-grid-font-size="large"] .ff-view-quotes { --ff-view-quotes-action-size: 18px; --ff-view-quotes-command-column-width: 38px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-quotes, body.ff-app[data-grid-font-size="small"] .ff-view-quotes, body.ff-app .ff-view-quotes.ff-view-compact { --ff-view-quotes-action-size: 16px; --ff-view-quotes-command-column-width: 34px; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) { overflow: visible !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) :is(.dx-button, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-quotes-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-quotes-action-size) !important; margin: 0 !important; max-height: var(--ff-view-quotes-action-size) !important; max-width: var(--ff-view-quotes-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-quotes-action-size) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) .dx-button-content { align-items: center !important; display: inline-flex !important; height: var(--ff-view-quotes-action-size) !important; justify-content: center !important; line-height: var(--ff-view-quotes-action-size) !important; margin: 0 !important; max-height: var(--ff-view-quotes-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-quotes-action-size) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) .fa-eye { display: inline-block !important; font-size: var(--ff-view-quotes-action-size) !important; height: auto !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-quote-command-col) :is(.dx-button, .dx-link, a) { top: calc(50% - 6px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { top: calc(50% - 3px) !important; } body.ff-app .ff-view-quotes #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-quotes #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { top: calc(50% - 3px) !important; } /* Image Search fixed-column centre nudge. Keep after the shared selector/action rule so only this page is lifted slightly. */ body.ff-app .ff-imaging-list { --ff-view-images-action-size: 16px; --ff-view-images-command-column-width: 34px; --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-fixed-column-lift: 1px; --ff-view-images-row-height: var(--ff-grid-row-height); } body.ff-app[data-grid-font-size="large"] .ff-imaging-list { --ff-view-images-action-size: 18px; --ff-view-images-command-column-width: 38px; --ff-grid-cell-padding-y: 2px; --ff-grid-row-height: 32px; --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-row-height: var(--ff-grid-row-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-grid-cell-padding-y: 0; --ff-grid-row-height: 20px; --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-row-height: var(--ff-grid-row-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list, body.ff-app .ff-imaging-list.ff-view-compact { --ff-view-images-action-size: 16px; --ff-view-images-command-column-width: 34px; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { top: calc(50% - var(--ff-view-images-fixed-column-lift)) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-view-grid-row-selector-size, 14px) - 3px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-image-command-col) { overflow: visible !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-image-command-col) :is(.dx-button, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-images-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-view-images-action-size) !important; margin: 0 !important; max-height: var(--ff-view-images-action-size) !important; max-width: var(--ff-view-images-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: calc(50% - var(--ff-view-images-fixed-column-lift)) !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-images-command-column-width) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-image-command-col) .dx-button-content { align-items: center !important; display: inline-flex !important; height: var(--ff-view-images-action-size) !important; justify-content: center !important; line-height: var(--ff-view-images-action-size) !important; margin: 0 !important; max-height: var(--ff-view-images-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-images-command-column-width) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-image-command-col) .fa-eye { display: inline-block !important; font-size: var(--ff-view-images-action-size) !important; height: var(--ff-view-images-action-size) !important; line-height: var(--ff-view-images-action-size) !important; margin: 0 !important; max-height: var(--ff-view-images-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } /* View Images final row-height lock. Keep after the fixed-column icon nudge so the fixed and scrollable panes stay aligned. */ body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; line-height: calc(var(--ff-view-images-row-height, var(--ff-grid-row-height)) - 4px) !important; max-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-command-col), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-command-col) { overflow: hidden !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-image-command-col) { box-sizing: border-box !important; height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; line-height: calc(var(--ff-view-images-row-height, var(--ff-grid-row-height)) - 4px) !important; max-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-command-col) > *, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-command-col) :is(.dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-command-col) :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-view-images-row-height, var(--ff-grid-row-height)) - 4px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-view-images-row-height, var(--ff-grid-row-height)) - 4px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-image-command-col) { height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; line-height: calc(var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) - 4px) !important; max-height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; min-height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; } /* View Manifest Routes eye action nudge. Keep after the shared view-grid action rule so only this page's eye sits slightly higher. */ body.ff-app .ff-view-manifest-routes #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col):has(.fa-eye) :is(.dx-button, .dx-button-content, .dx-link, a) { top: -1px !important; } body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-manifest-routes #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; } /* View Manifests final fixed-pane lock. Keep last so the shared view-grid selector and eye-icon rules cannot stretch this page again. */ body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; max-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; font-size: 0 !important; height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; line-height: 0 !important; max-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-manifests-row-height, var(--ff-grid-row-height)) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select { overflow: visible !important; position: relative !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { aspect-ratio: auto !important; border-radius: 3px !important; height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; left: var(--ff-view-manifests-check-left, 50%) !important; line-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; margin: 0 !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { aspect-ratio: auto !important; border-radius: 3px !important; height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; line-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; min-height: var(--ff-view-manifests-check-height, var(--ff-view-manifests-check-size)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col):has(.fa-eye) :is(.dx-link.fa-eye, a.fa-eye) { align-items: center !important; color: var(--ff-primary, var(--primary)) !important; display: inline-flex !important; font-family: FontAwesome !important; font-size: var(--ff-view-manifests-action-size) !important; height: var(--ff-view-manifests-action-size) !important; justify-content: center !important; left: calc(50% - 1px) !important; line-height: var(--ff-view-manifests-action-size) !important; margin: 0 !important; max-height: var(--ff-view-manifests-action-size) !important; max-width: var(--ff-view-manifests-action-size) !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; visibility: visible !important; width: var(--ff-view-manifests-action-size) !important; } /* Generate Invoice/Manifest command control lock. Mirrors the accepted View Quotes compact eye/checkbox sizing without changing grid row density. */ body.ff-app .ff-generate-invoice { --ff-invoice-generate-action-size: 16px; --ff-invoice-generate-check-radius: 3px; --ff-invoice-generate-check-size: 14px; --ff-invoice-generate-command-column-width: 34px; --ff-invoice-generate-select-column-width: 24px; } body.ff-app .ff-generate-manifest { --ff-generate-manifest-action-size: 16px; --ff-generate-manifest-check-radius: 3px; --ff-generate-manifest-check-size: 14px; --ff-generate-manifest-command-column-width: 34px; --ff-generate-manifest-select-column-width: 24px; --ff-grid-command-column-width: var(--ff-generate-manifest-command-column-width); --ff-manifest-action-icon-size: var(--ff-generate-manifest-action-size); --ff-manifest-checkbox-size: var(--ff-generate-manifest-check-size); } body.ff-app[data-grid-font-size="large"] .ff-generate-invoice { --ff-invoice-generate-action-size: 18px; --ff-invoice-generate-check-size: 16px; --ff-invoice-generate-command-column-width: 38px; --ff-invoice-generate-select-column-width: 28px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-generate-manifest-action-size: 18px; --ff-generate-manifest-check-size: 16px; --ff-generate-manifest-command-column-width: 38px; --ff-generate-manifest-select-column-width: 28px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice, body.ff-app[data-grid-font-size="small"] .ff-generate-invoice, body.ff-app .ff-generate-invoice.ff-view-compact { --ff-invoice-generate-action-size: 16px; --ff-invoice-generate-check-size: 14px; --ff-invoice-generate-command-column-width: 34px; --ff-invoice-generate-select-column-width: 24px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest, body.ff-app .ff-generate-manifest.ff-view-compact { --ff-generate-manifest-action-size: 16px; --ff-generate-manifest-check-size: 14px; --ff-generate-manifest-command-column-width: 34px; --ff-generate-manifest-select-column-width: 24px; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-select-column-width) !important; min-width: var(--ff-invoice-generate-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-invoice-generate-select-column-width) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .ff-manifest-select-col, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .ff-manifest-select-col > td { box-sizing: border-box !important; max-width: var(--ff-generate-manifest-select-column-width) !important; min-width: var(--ff-generate-manifest-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-generate-manifest-select-column-width) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-generate-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-command-column-width) !important; min-width: var(--ff-invoice-generate-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-generate-manifest-command-column-width) !important; min-width: var(--ff-generate-manifest-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-generate-manifest-command-column-width) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .ff-manifest-select-col :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-generate-checkbox-size, 14px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-checkbox-size, 14px) !important; margin: 0 !important; max-height: var(--ff-generate-checkbox-size, 14px) !important; max-width: var(--ff-generate-checkbox-size, 14px) !important; min-height: var(--ff-generate-checkbox-size, 14px) !important; min-width: var(--ff-generate-checkbox-size, 14px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-generate-checkbox-size, 14px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { --ff-generate-checkbox-size: var(--ff-invoice-generate-check-size); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-select-checkbox) { --ff-generate-checkbox-size: var(--ff-generate-manifest-check-size); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox-container, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-generate-checkbox-size, 14px) !important; height: var(--ff-generate-checkbox-size, 14px) !important; justify-content: center !important; line-height: var(--ff-generate-checkbox-size, 14px) !important; margin: 0 !important; max-height: var(--ff-generate-checkbox-size, 14px) !important; max-width: var(--ff-generate-checkbox-size, 14px) !important; min-height: var(--ff-generate-checkbox-size, 14px) !important; min-width: var(--ff-generate-checkbox-size, 14px) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-generate-checkbox-size, 14px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-generate-checkbox-radius, 3px) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-generate-checkbox-size, 14px) !important; height: var(--ff-generate-checkbox-size, 14px) !important; line-height: var(--ff-generate-checkbox-size, 14px) !important; margin: 0 !important; max-height: var(--ff-generate-checkbox-size, 14px) !important; max-width: var(--ff-generate-checkbox-size, 14px) !important; min-height: var(--ff-generate-checkbox-size, 14px) !important; min-width: var(--ff-generate-checkbox-size, 14px) !important; padding: 0 !important; transform: none !important; width: var(--ff-generate-checkbox-size, 14px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox-icon { --ff-generate-checkbox-radius: var(--ff-invoice-generate-check-radius); --ff-generate-checkbox-size: var(--ff-invoice-generate-check-size); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { --ff-generate-checkbox-radius: var(--ff-generate-manifest-check-radius); --ff-generate-checkbox-size: var(--ff-generate-manifest-check-size); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-generate-checkbox-size, 14px) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-button, .dx-link, a), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) > :is(.dx-button, .dx-dropdownbutton, .dx-link, a), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-button, .dx-link, a), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) > :is(.dx-button, .dx-dropdownbutton, .dx-link, a) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-generate-action-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-generate-action-size, 16px) !important; max-width: var(--ff-generate-command-width, 34px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-generate-command-width, 34px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-button, .dx-link, a), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) > :is(.dx-button, .dx-dropdownbutton, .dx-link, a) { --ff-generate-action-size: var(--ff-invoice-generate-action-size); --ff-generate-command-width: var(--ff-invoice-generate-command-column-width); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-button, .dx-link, a), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) > :is(.dx-button, .dx-dropdownbutton, .dx-link, a) { --ff-generate-action-size: var(--ff-generate-manifest-action-size); --ff-generate-command-width: var(--ff-generate-manifest-command-column-width); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-generate-action-size, 16px) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-generate-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-generate-action-size, 16px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-generate-command-width, 34px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-invoice-generate-row-actions, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-generate-action-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-generate-action-size, 16px) !important; max-width: var(--ff-generate-command-width, 34px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-generate-command-width, 34px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-invoice-generate-row-actions { --ff-generate-action-size: var(--ff-invoice-generate-action-size); --ff-generate-command-width: var(--ff-invoice-generate-command-column-width); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .ff-manifest-row-actions { --ff-generate-action-size: var(--ff-generate-manifest-action-size); --ff-generate-command-width: var(--ff-generate-manifest-command-column-width); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-invoice-generate-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .ff-manifest-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-generate-action-size, 16px) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-generate-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-generate-action-size, 16px) !important; max-width: var(--ff-generate-command-width, 34px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-generate-command-width, 34px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) .dx-button-content::before, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) .dx-button-content::before, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content::before { content: none !important; display: none !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content > :is(.dx-icon, .fa), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content :is(.dx-icon, .fa, [class*="fa-"]) { color: var(--ff-primary, var(--primary)) !important; display: inline-block !important; font-family: FontAwesome !important; font-size: var(--ff-generate-action-size, 16px) !important; height: var(--ff-generate-action-size, 16px) !important; line-height: var(--ff-generate-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-generate-action-size, 16px) !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; visibility: visible !important; width: auto !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa) { --ff-generate-action-size: var(--ff-invoice-generate-action-size); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content > :is(.dx-icon, .fa), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content :is(.dx-icon, .fa, [class*="fa-"]) { --ff-generate-action-size: var(--ff-generate-manifest-action-size); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-invoice-generate-row-actions .dx-button-content:not(:has(.fa-eye)):not(:has(.dx-icon))::after, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content:not(:has(.fa-eye)):not(:has(.dx-icon))::after { color: var(--ff-primary, var(--primary)) !important; content: "\f06e"; display: inline-block !important; font-family: FontAwesome !important; font-size: var(--ff-generate-action-size, 16px) !important; height: var(--ff-generate-action-size, 16px) !important; line-height: var(--ff-generate-action-size, 16px) !important; text-align: center !important; width: var(--ff-generate-action-size, 16px) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-invoice-generate-row-actions .dx-button-content:not(:has(.fa-eye)):not(:has(.dx-icon))::after { --ff-generate-action-size: var(--ff-invoice-generate-action-size); } body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .ff-manifest-row-actions .dx-button-content:not(:has(.fa-eye)):not(:has(.dx-icon))::after { --ff-generate-action-size: var(--ff-generate-manifest-action-size); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-button-text, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-dropdownbutton-toggle .dx-icon-spindown, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-button-text, body.ff-app .ff-generate-manifest :is(#gridContainer, #gridContainer2) .dx-datagrid-rowsview .dx-dropdownbutton-toggle .dx-icon-spindown { display: none !important; font-size: 0 !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } /* View Collections row colour preservation. The collection grid uses status colours from the data; compact mode must not replace those with density/selection backgrounds. */ body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour > td, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour > tr > td, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-dx-preserved-row-colour-cell { background-color: var(--ff-preserved-row-bg) !important; color: var(--ff-preserved-row-fg, #000000) !important; } body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour > td > *, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-dx-preserved-row-colour-cell > *, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour td :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, button, .btn, .label) { background: transparent !important; background-color: transparent !important; } /* Generate Invoice final normal-mode selector/action visibility lock. Keep row heights unchanged; only prevent the fixed-column checkbox and eye glyphs from being clipped. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { overflow: visible !important; position: relative !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: auto !important; display: inline-flex !important; height: var(--ff-invoice-generate-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-invoice-generate-check-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-check-size) !important; max-width: var(--ff-invoice-generate-check-size) !important; min-height: var(--ff-invoice-generate-check-size) !important; min-width: var(--ff-invoice-generate-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-invoice-generate-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { aspect-ratio: auto !important; box-sizing: border-box !important; height: var(--ff-invoice-generate-check-size) !important; line-height: var(--ff-invoice-generate-check-size) !important; max-height: var(--ff-invoice-generate-check-size) !important; max-width: var(--ff-invoice-generate-check-size) !important; min-height: var(--ff-invoice-generate-check-size) !important; min-width: var(--ff-invoice-generate-check-size) !important; overflow: visible !important; padding: 0 !important; transform: none !important; width: var(--ff-invoice-generate-check-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-container { display: block !important; left: auto !important; position: relative !important; top: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { display: block !important; left: 0 !important; position: absolute !important; top: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { line-height: 1 !important; overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col):has(.fa-eye) :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-invoice-generate-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; max-width: var(--ff-invoice-generate-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col):has(.fa-eye) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa) { display: inline-block !important; font-size: var(--ff-invoice-generate-action-size) !important; height: var(--ff-invoice-generate-action-size) !important; line-height: var(--ff-invoice-generate-action-size) !important; max-height: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } /* Row selector hit target guard. Keep the visual checkbox compact, but make fixed selector cells reliably clickable on the first data row. */ body.ff-app .ff-query-grid-page .dx-datagrid .dx-datagrid-rowsview .dx-command-select, body.ff-app .ff-query-grid-page .dx-datagrid .dx-datagrid-rowsview .dx-command-select > td { overflow: visible !important; pointer-events: auto !important; position: relative !important; z-index: 4 !important; } body.ff-app .ff-query-grid-page .dx-datagrid .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox) { pointer-events: auto !important; z-index: 5 !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* View Invoices final eye icon size lock. Normal and compact mode should render the invoice row action at the same visual size. */ body.ff-app .ff-view-invoices { --ff-view-invoices-action-size: 16px; } body.ff-app .ff-view-invoices #clientGridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-view-command-col):has(.fa-eye) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa) { display: inline-block !important; font-size: var(--ff-view-invoices-action-size) !important; height: var(--ff-view-invoices-action-size) !important; line-height: var(--ff-view-invoices-action-size) !important; max-height: var(--ff-view-invoices-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } /* View Tracking final pane alignment lock. Keep last so later shared checkbox/icon rules cannot leave fixed and scrollable row heights out of step. */ body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-tracking-select-col):not(.ff-tracking-command-col) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, .ff-grid-boolean-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-tracking-select-col):not(.ff-tracking-command-col) > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.ff-tracking-select-col):not(.ff-tracking-command-col) :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, button, .btn, .label), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Tracking absolute row compression. Mirrors the accepted View Quotes/Image pattern and prevents small result sets from stretching rows to fill the rowsview. */ body.ff-app .ff-view-tracking { --ff-tracking-row-height: 24px; --ff-tracking-content-height: 22px; --ff-tracking-select-column-width: 24px; --ff-tracking-command-column-width: 34px; --ff-tracking-selector-size: 14px; --ff-tracking-action-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking, body.ff-app[data-grid-font-size="small"] .ff-view-tracking { --ff-tracking-row-height: 20px; --ff-tracking-content-height: 18px; --ff-tracking-select-column-width: 22px; --ff-tracking-command-column-width: 32px; --ff-tracking-selector-size: 14px; --ff-tracking-action-size: 16px; } body.ff-app[data-grid-font-size="large"] .ff-view-tracking { --ff-tracking-row-height: 32px; --ff-tracking-content-height: 28px; --ff-tracking-select-column-width: 28px; --ff-tracking-command-column-width: 38px; --ff-tracking-selector-size: 16px; --ff-tracking-action-size: 18px; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody { height: auto !important; min-height: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table { table-layout: fixed !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { block-size: var(--ff-tracking-row-height) !important; box-sizing: border-box !important; height: var(--ff-tracking-row-height) !important; line-height: var(--ff-tracking-content-height) !important; max-height: var(--ff-tracking-row-height) !important; min-height: var(--ff-tracking-row-height) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-tracking-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-tracking-select-column-width) !important; min-width: var(--ff-tracking-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-tracking-select-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-tracking-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-tracking-command-column-width) !important; min-width: var(--ff-tracking-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-tracking-command-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: var(--ff-tracking-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-tracking-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-tracking #gridContainer .ff-tracking-select-col :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tracking-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-tracking-selector-size) !important; margin: 0 !important; max-height: var(--ff-tracking-selector-size) !important; max-width: var(--ff-tracking-selector-size) !important; min-height: var(--ff-tracking-selector-size) !important; min-width: var(--ff-tracking-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tracking-selector-size) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-command-select, .ff-tracking-select-col) .dx-checkbox-icon, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox { aspect-ratio: 1 / 1 !important; border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-tracking-selector-size) !important; line-height: var(--ff-tracking-selector-size) !important; margin: 0 !important; max-height: var(--ff-tracking-selector-size) !important; max-width: var(--ff-tracking-selector-size) !important; min-height: var(--ff-tracking-selector-size) !important; min-width: var(--ff-tracking-selector-size) !important; padding: 0 !important; width: var(--ff-tracking-selector-size) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app .ff-view-tracking #gridContainer .ff-tracking-command-col :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-tracking-action-size) !important; justify-content: center !important; line-height: var(--ff-tracking-action-size) !important; margin: 0 auto !important; max-height: var(--ff-tracking-action-size) !important; max-width: var(--ff-tracking-command-column-width) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: relative !important; transform: none !important; vertical-align: middle !important; width: var(--ff-tracking-command-column-width) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa), body.ff-app .ff-view-tracking #gridContainer .ff-tracking-command-col :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-tracking-action-size) !important; height: var(--ff-tracking-action-size) !important; line-height: var(--ff-tracking-action-size) !important; margin: 0 !important; max-height: var(--ff-tracking-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; width: auto !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) .dx-editor-container { display: none !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; display: none !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Image Search late normal-mode row lock. Fixed selector/action rows need the same data-row rules before later page locks continue. */ body.ff-app .ff-imaging-list { --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-row-height: var(--ff-grid-row-height); } /* Dashboard Master final row/selector lock. The editable menu grid has a generated fixed selector column, so lock both rendered panes. */ body.ff-app .ff-dashboard-master { --ff-dashboard-master-row-height: 26px; --ff-dashboard-master-cell-height: 24px; --ff-dashboard-master-cell-padding-y: 1px; --ff-dashboard-master-select-column-width: 24px; --ff-dashboard-master-selector-radius: 3px; --ff-dashboard-master-selector-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-dashboard-master, body.ff-app[data-grid-font-size="small"] .ff-dashboard-master { --ff-dashboard-master-row-height: 20px; --ff-dashboard-master-cell-height: 18px; --ff-dashboard-master-cell-padding-y: 0; --ff-dashboard-master-select-column-width: 22px; --ff-dashboard-master-selector-size: 14px; } body.ff-app[data-grid-font-size="large"] .ff-dashboard-master { --ff-dashboard-master-row-height: 32px; --ff-dashboard-master-cell-height: 28px; --ff-dashboard-master-cell-padding-y: 2px; --ff-dashboard-master-select-column-width: 28px; --ff-dashboard-master-selector-size: 16px; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview .dx-datagrid-table, body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody { height: auto !important; min-height: 0 !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-dashboard-master-row-height) !important; line-height: var(--ff-dashboard-master-cell-height) !important; max-height: var(--ff-dashboard-master-row-height) !important; min-height: var(--ff-dashboard-master-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-dashboard-master-cell-padding-y) !important; padding-top: var(--ff-dashboard-master-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-dashboard-master #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-dashboard-master #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-dashboard-master-select-column-width) !important; min-width: var(--ff-dashboard-master-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-dashboard-master-select-column-width) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview .dx-command-select { height: var(--ff-dashboard-master-row-height) !important; line-height: var(--ff-dashboard-master-cell-height) !important; max-height: var(--ff-dashboard-master-row-height) !important; min-height: var(--ff-dashboard-master-row-height) !important; padding-bottom: var(--ff-dashboard-master-cell-padding-y) !important; padding-top: var(--ff-dashboard-master-cell-padding-y) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select) > *, body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: var(--ff-dashboard-master-cell-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-dashboard-master-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview td :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: var(--ff-dashboard-master-cell-height) !important; line-height: calc(var(--ff-dashboard-master-cell-height) - 2px) !important; max-height: var(--ff-dashboard-master-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-dashboard-master #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-dashboard-master-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-dashboard-master-selector-size) !important; margin: 0 !important; max-height: var(--ff-dashboard-master-selector-size) !important; max-width: var(--ff-dashboard-master-selector-size) !important; min-height: var(--ff-dashboard-master-selector-size) !important; min-width: var(--ff-dashboard-master-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-dashboard-master-selector-size) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-command-select .dx-checkbox-container, body.ff-app .ff-dashboard-master #gridContainer .dx-data-row > td .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-dashboard-master-selector-size) !important; height: var(--ff-dashboard-master-selector-size) !important; justify-content: center !important; line-height: var(--ff-dashboard-master-selector-size) !important; margin: 0 !important; max-height: var(--ff-dashboard-master-selector-size) !important; max-width: var(--ff-dashboard-master-selector-size) !important; min-height: var(--ff-dashboard-master-selector-size) !important; min-width: var(--ff-dashboard-master-selector-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-dashboard-master-selector-size) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-dashboard-master-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-dashboard-master-selector-size) !important; height: var(--ff-dashboard-master-selector-size) !important; line-height: var(--ff-dashboard-master-selector-size) !important; margin: 0 !important; max-height: var(--ff-dashboard-master-selector-size) !important; max-width: var(--ff-dashboard-master-selector-size) !important; min-height: var(--ff-dashboard-master-selector-size) !important; min-width: var(--ff-dashboard-master-selector-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-dashboard-master-selector-size) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-dashboard-master-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-dashboard-master #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View/grid toolbar checkbox hit-area guard. DevExtreme header panels are pulled upward on many pages; keep them from stealing toolbar checkbox clicks. */ body.ff-app .ff-page :is(.ff-grid-toolbar-row, .ff-view-waybills-grid-toolbar-row, .ff-grid-toolbar-inner) { pointer-events: auto !important; position: relative !important; z-index: 20 !important; } body.ff-app .ff-page :is(.ff-grid-toolbar-row, .ff-view-waybills-grid-toolbar-row, .ff-grid-toolbar-inner) :is(.valuesonly, .checkbox, .checkbox-inline, .clip-check, .clip-check label, label, input[type="checkbox"]) { cursor: pointer !important; pointer-events: auto !important; } body.ff-app .ff-page :is(.ff-grid-toolbar-row, .ff-view-waybills-grid-toolbar-row, .ff-grid-toolbar-inner) .clip-check label::before, body.ff-app .ff-page :is(.ff-grid-toolbar-row, .ff-view-waybills-grid-toolbar-row, .ff-grid-toolbar-inner) .clip-check label::after { pointer-events: none !important; } body.ff-app .ff-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel { pointer-events: none !important; position: relative !important; z-index: 1 !important; } body.ff-app .ff-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel :is(.dx-toolbar-after, .dx-toolbar-item, .dx-button, .dx-button-content, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-button) { pointer-events: auto !important; } /* Shared replacement grid tools. Keep export/column chooser beside the view-page checkbox toolbar so DevExtreme header buttons cannot overlap it. */ body.ff-app .ff-page .ff-grid-actions-host { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; margin-left: auto !important; min-height: 0 !important; white-space: nowrap !important; } body.ff-app .ff-page .ff-grid-status-filters + .ff-grid-actions-host { margin-left: 4px !important; } body.ff-app .ff-page .ff-grid-actions { align-items: center !important; display: inline-flex !important; gap: 4px !important; min-height: 0 !important; white-space: nowrap !important; } body.ff-app .ff-page .ff-grid-actions .btn-group, body.ff-app .ff-page .ff-grid-actions .btn { align-items: center !important; display: inline-flex !important; float: none !important; margin: 0 !important; } body.ff-app .ff-page .ff-grid-actions .ff-grid-action-btn { gap: 5px !important; height: 26px !important; justify-content: center !important; line-height: 1 !important; min-height: 26px !important; min-width: 30px !important; padding: 0 8px !important; white-space: nowrap !important; } body.ff-app .ff-page .ff-grid-actions .ff-grid-action-btn .fa { line-height: 1 !important; margin: 0 !important; } body.ff-app .ff-page .ff-grid-actions .ff-grid-action-btn .caret { margin-left: 5px !important; } body.ff-app .ff-page .ff-grid-actions .ff-grid-action-btn span:not(.caret) { display: inline-block !important; line-height: 1 !important; max-width: none !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-query-grid-page .ff-grid-actions .ff-grid-column-chooser { gap: 0 !important; min-width: 26px !important; padding-left: 0 !important; padding-right: 0 !important; width: 26px !important; } body.ff-app .ff-query-grid-page .ff-grid-actions .ff-grid-column-chooser > span { display: none !important; } body.ff-app .ff-query-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel .dx-datagrid-column-chooser-button { min-width: 28px !important; padding-left: 0 !important; padding-right: 0 !important; width: 28px !important; } body.ff-app .ff-query-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel .dx-datagrid-column-chooser-button .dx-button-content { justify-content: center !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-query-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel .dx-datagrid-column-chooser-button .dx-button-text { display: none !important; } body.ff-app .ff-page .ff-grid-actions .dropdown-menu { min-width: 160px !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-page .ff-grid-actions .ff-grid-action-btn, body.ff-app[data-grid-font-size="small"] .ff-page .ff-grid-actions .ff-grid-action-btn { height: 22px !important; min-height: 22px !important; min-width: 28px !important; padding-left: 6px !important; padding-right: 6px !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only { margin-left: auto !important; order: 999 !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-actions { gap: 2px !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn { gap: 0 !important; height: 24px !important; min-height: 24px !important; min-width: 26px !important; padding: 0 !important; width: 26px !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-export .ff-grid-action-btn { min-width: 30px !important; width: 30px !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn span:not(.caret) { display: none !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn .fa { font-size: 13px !important; } body.ff-app .ff-view-waybills .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn .caret { margin-left: 1px !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only { margin-left: auto !important; order: 999 !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-actions { gap: 2px !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn { gap: 0 !important; height: 24px !important; min-height: 24px !important; min-width: 26px !important; overflow: hidden !important; padding: 0 !important; width: 26px !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-export .ff-grid-action-btn { min-width: 32px !important; width: 32px !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn span:not(.caret) { display: none !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn .fa { font-size: 13px !important; line-height: 1 !important; } body.ff-app .ff-page .ff-grid-actions-host.ff-grid-actions-host--icon-only .ff-grid-action-btn .caret { margin-left: 1px !important; } /* View grid toolbar: remove blank closed-filter rows and keep grid tools compact. */ body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page > .container-fullw, body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page > .container-fluid.container-fullw { padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page > .container-fullw > .row:has(.accordion-no-display):not(:has(.panel-collapse.in)):not(.ff-standard-filter-overlay-row):not(.ff-standard-filter-inline-row):not(.ff-finance-filter-inline-row), body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page > .container-fluid.container-fullw > .row:has(.accordion-no-display):not(:has(.panel-collapse.in)):not(.ff-standard-filter-overlay-row):not(.ff-standard-filter-inline-row):not(.ff-finance-filter-inline-row) { display: none !important; margin: 0 !important; } body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page .ff-grid-toolbar-row { margin: 0 !important; min-height: 24px !important; padding: 0 !important; } body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { gap: 2px 8px !important; min-height: 24px !important; padding: 0 !important; width: 100% !important; } body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page .ff-grid-toolbar-row :is(.label, .btn, .checkbox, .checkbox-inline, .valuesonly) { margin-bottom: 0 !important; margin-top: 0 !important; } body.ff-app :is(.ff-view-manifests, .ff-view-crdr).ff-query-grid-page .ff-grid-result-row { margin-top: 0 !important; } body.ff-app .ff-page.ff-grid-tools-page .dx-datagrid-header-panel .dx-toolbar-item:has(:is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button)), body.ff-app .ff-page:has(.ff-grid-actions-host) .dx-datagrid-header-panel .dx-toolbar-item:has(:is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button)) { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-page.ff-grid-tools-page .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button), body.ff-app .ff-page:has(.ff-grid-actions-host) .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button) { display: none !important; pointer-events: none !important; visibility: hidden !important; } /* View Invoices uses the shared blue grid tools; suppress DevExtreme's native export/column chooser buttons in both summary and invoice-waybill detail. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices :is(#clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-header-panel .dx-toolbar-item:has(:is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button)), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices :is(#clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button) { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-row-height: var(--ff-grid-row-height); } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; line-height: calc(var(--ff-view-images-row-height, var(--ff-grid-row-height)) - 4px) !important; max-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-view-images-row-height, var(--ff-grid-row-height)) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-image-command-col) { height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; line-height: calc(var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) - 4px) !important; max-height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; min-height: var(--ff-view-images-fixed-row-height, var(--ff-view-images-row-height, var(--ff-grid-row-height))) !important; } /* Generate Manifest selector/action final lock. Keep last so the generate workflow uses the same square selector and visible row action as the view grids. */ body.ff-app .ff-generate-manifest { --ff-generate-manifest-row-selector-radius: 3px; --ff-generate-manifest-row-selector-size: 14px; --ff-generate-manifest-row-eye-size: 16px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-generate-manifest-row-eye-size: 18px; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col), body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) > td { overflow: visible !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; border-radius: var(--ff-generate-manifest-row-selector-radius) !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-generate-manifest-row-selector-size) !important; height: var(--ff-generate-manifest-row-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-manifest-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-selector-size) !important; max-width: var(--ff-generate-manifest-row-selector-size) !important; min-height: var(--ff-generate-manifest-row-selector-size) !important; min-width: var(--ff-generate-manifest-row-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-generate-manifest-row-selector-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { left: calc(50% - 1px) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-container { position: relative !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-generate-manifest-row-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-generate-manifest-row-selector-size) !important; height: var(--ff-generate-manifest-row-selector-size) !important; line-height: var(--ff-generate-manifest-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-selector-size) !important; max-width: var(--ff-generate-manifest-row-selector-size) !important; min-height: var(--ff-generate-manifest-row-selector-size) !important; min-width: var(--ff-generate-manifest-row-selector-size) !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-generate-manifest-row-selector-size) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon::after { border-radius: var(--ff-generate-manifest-row-selector-radius) !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-generate-manifest-row-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) { overflow: visible !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; left: 50% !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; max-width: var(--ff-grid-command-column-width, 34px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width, 34px) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-menu, body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-menu :is(.dx-dropdownbutton, .dx-button, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-button-content) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; box-sizing: border-box !important; display: inline-flex !important; height: 100% !important; inset: 0 !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 !important; max-height: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; transform: none !important; vertical-align: middle !important; width: 100% !important; z-index: 1 !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-menu .dx-button-content::before, body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-menu .dx-button-content::after, body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-menu .dx-button-content :is(.dx-icon, .fa, [class*="fa-"]) { content: none !important; display: none !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-row-eye { align-items: center !important; color: var(--ff-primary, var(--primary)) !important; display: inline-flex !important; font-family: FontAwesome !important; font-size: var(--ff-generate-manifest-row-eye-size) !important; height: var(--ff-generate-manifest-row-eye-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-manifest-row-eye-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-eye-size) !important; max-width: var(--ff-generate-manifest-row-eye-size) !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; pointer-events: none !important; position: absolute !important; text-align: center !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; visibility: visible !important; width: var(--ff-generate-manifest-row-eye-size) !important; z-index: 2 !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-view-link { align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--ff-primary, var(--primary)) !important; cursor: pointer !important; display: inline-flex !important; font-size: var(--ff-generate-manifest-row-eye-size) !important; height: var(--ff-generate-manifest-row-eye-size) !important; justify-content: center !important; line-height: var(--ff-generate-manifest-row-eye-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-eye-size) !important; max-width: var(--ff-generate-manifest-command-column-width, 34px) !important; min-height: 0 !important; min-width: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; pointer-events: auto !important; text-align: center !important; text-decoration: none !important; vertical-align: middle !important; visibility: visible !important; width: var(--ff-generate-manifest-command-column-width, 34px) !important; z-index: 3 !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-view-link .fa, body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-view-link .fa::before { color: var(--ff-primary, var(--primary)) !important; display: inline-block !important; font-family: FontAwesome !important; font-size: var(--ff-generate-manifest-row-eye-size) !important; height: var(--ff-generate-manifest-row-eye-size) !important; line-height: var(--ff-generate-manifest-row-eye-size) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-eye-size) !important; max-width: var(--ff-generate-manifest-row-eye-size) !important; min-height: 0 !important; min-width: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; visibility: visible !important; width: var(--ff-generate-manifest-row-eye-size) !important; } body.ff-app .ff-generate-manifest :is(#gridContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-row-actions .ff-manifest-view-link[disabled] { cursor: default !important; opacity: 0.35 !important; } /* Query page final data-row density lock. Keep height on cells only; table rows stretch when padding/line-height is applied to the TR. */ body.ff-app .ff-query { --ff-query-row-height: 26px; --ff-query-cell-line-height: 22px; --ff-query-footer-row-height: 30px; --ff-query-pager-height: 50px; --ff-query-pager-inner-height: 38px; --ff-grid-row-height: var(--ff-query-row-height); --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 26px; --ff-grid-command-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-query, body.ff-app[data-grid-font-size="small"] .ff-query { --ff-query-row-height: 18px; --ff-query-cell-line-height: 16px; --ff-query-footer-row-height: 26px; --ff-query-pager-height: 44px; --ff-query-pager-inner-height: 32px; --ff-grid-row-height: var(--ff-query-row-height); --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query { --ff-query-row-height: 30px; --ff-query-cell-line-height: 26px; --ff-query-footer-row-height: 34px; --ff-query-pager-height: 54px; --ff-query-pager-inner-height: 42px; --ff-grid-row-height: var(--ff-query-row-height); --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: auto !important; line-height: 0 !important; max-height: none !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: auto !important; line-height: var(--ff-query-cell-line-height) !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, input, button, .btn, .label, .ff-grid-boolean-checkbox), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, button, .btn, .label), body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: var(--ff-query-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-query-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand) { box-sizing: border-box !important; height: auto !important; line-height: var(--ff-query-cell-line-height) !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { max-width: var(--ff-grid-select-column-width) !important; min-width: var(--ff-grid-select-column-width) !important; width: var(--ff-grid-select-column-width) !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-edit > td { max-width: var(--ff-grid-command-column-width) !important; min-width: var(--ff-grid-command-column-width) !important; width: var(--ff-grid-command-column-width) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: var(--ff-query-cell-line-height) !important; justify-content: center !important; line-height: var(--ff-query-cell-line-height) !important; margin: 0 auto !important; max-height: var(--ff-query-cell-line-height) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { height: min(14px, calc(var(--ff-query-cell-line-height) - 2px)) !important; line-height: min(14px, calc(var(--ff-query-cell-line-height) - 2px)) !important; width: min(14px, calc(var(--ff-query-cell-line-height) - 2px)) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit { font-size: 0 !important; line-height: 0 !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-link, a, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-icon, .fa) { align-items: center !important; display: inline-flex !important; font-size: min(16px, var(--ff-query-cell-line-height)) !important; height: var(--ff-query-cell-line-height) !important; justify-content: center !important; line-height: var(--ff-query-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-query-cell-line-height) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } /* Receiver/Sender master selector and actions. Matches the standard view-grid selector shape without affecting toolbar/filter checkboxes. */ body.ff-app .ff-receivers { --ff-receivers-action-icon-size: 16px; --ff-receivers-command-column-width: 54px; --ff-receivers-select-column-width: 24px; --ff-receivers-selector-radius: 3px; --ff-receivers-selector-size: 14px; } body.ff-app[data-grid-font-size="large"] .ff-receivers { --ff-receivers-action-icon-size: 18px; --ff-receivers-command-column-width: 58px; --ff-receivers-select-column-width: 28px; --ff-receivers-selector-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-receivers, body.ff-app[data-grid-font-size="small"] .ff-receivers, body.ff-app .ff-receivers.ff-view-compact { --ff-receivers-action-icon-size: 16px; --ff-receivers-command-column-width: 54px; --ff-receivers-select-column-width: 24px; --ff-receivers-selector-size: 14px; } body.ff-app .ff-receivers #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-receivers-select-col), body.ff-app .ff-receivers #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-receivers-select-col) > td { box-sizing: border-box !important; max-width: var(--ff-receivers-select-column-width) !important; min-width: var(--ff-receivers-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-receivers-select-column-width) !important; } body.ff-app .ff-receivers #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-receivers-command-col), body.ff-app .ff-receivers #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-receivers-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-receivers-command-column-width) !important; min-width: var(--ff-receivers-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-receivers-command-column-width) !important; } body.ff-app .ff-receivers #gridContainer .dx-command-select :is(.dx-checkbox, .dx-select-checkbox), body.ff-app .ff-receivers #gridContainer .ff-receivers-select-col :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-receivers-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-receivers-selector-size) !important; margin: 0 !important; max-height: var(--ff-receivers-selector-size) !important; max-width: var(--ff-receivers-selector-size) !important; min-height: var(--ff-receivers-selector-size) !important; min-width: var(--ff-receivers-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-receivers-selector-size) !important; } body.ff-app .ff-receivers #gridContainer :is(.dx-command-select, .ff-receivers-select-col) .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-receivers-selector-size) !important; height: var(--ff-receivers-selector-size) !important; justify-content: center !important; line-height: var(--ff-receivers-selector-size) !important; margin: 0 !important; max-height: var(--ff-receivers-selector-size) !important; max-width: var(--ff-receivers-selector-size) !important; min-height: var(--ff-receivers-selector-size) !important; min-width: var(--ff-receivers-selector-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-receivers-selector-size) !important; } body.ff-app .ff-receivers #gridContainer :is(.dx-command-select, .ff-receivers-select-col) .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-receivers-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-receivers-selector-size) !important; height: var(--ff-receivers-selector-size) !important; line-height: var(--ff-receivers-selector-size) !important; margin: 0 !important; max-height: var(--ff-receivers-selector-size) !important; max-width: var(--ff-receivers-selector-size) !important; min-height: var(--ff-receivers-selector-size) !important; min-width: var(--ff-receivers-selector-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-receivers-selector-size) !important; } body.ff-app .ff-receivers #gridContainer :is(.dx-command-select, .ff-receivers-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-receivers-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-receivers #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-receivers-command-col) .ff-receivers-row-actions, body.ff-app .ff-receivers #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-receivers-command-col) :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-receivers-action-icon-size) !important; justify-content: center !important; line-height: var(--ff-receivers-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-receivers-action-icon-size) !important; max-width: var(--ff-receivers-command-column-width) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-receivers-command-column-width) !important; } body.ff-app .ff-receivers #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-receivers-command-col) :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-receivers-action-icon-size) !important; height: var(--ff-receivers-action-icon-size) !important; line-height: var(--ff-receivers-action-icon-size) !important; margin: 0 !important; max-height: var(--ff-receivers-action-icon-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } body.ff-app .ff-receivers #gridContainer .dx-datagrid-filter-row :is(.dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col) .dx-editor-container, body.ff-app .ff-receivers #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-receivers-command-col) .dx-button-text, body.ff-app .ff-receivers #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-receivers-command-col) .dx-dropdownbutton-toggle .dx-icon-spindown { display: none !important; } /* Receiver Master pager base. The final footer/scrollbar parity block below aligns the footer with View Manifests. */ body.ff-app .ff-receivers.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; min-height: 34px !important; overflow: visible !important; padding: 0 12px 6px !important; visibility: visible !important; width: 100% !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-info { display: none !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-selection { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-navigate-button { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; transform: translateY(-3px) !important; vertical-align: middle !important; } /* Receiver Master final footer parity. Leave row scrolling to DevExtreme standard scrolling; native overflow overrides break the scroll range. */ body.ff-app .ff-receivers.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager.dx-pager, .dx-pager) { gap: 0 !important; height: 26px !important; line-height: 20px !important; max-height: 26px !important; min-height: 20px !important; padding: 0 4px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-receivers.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager.dx-pager, .dx-pager) { height: 22px !important; max-height: 22px !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-info { display: inline-flex !important; line-height: 20px !important; margin: 0 4px !important; max-width: none !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; white-space: nowrap !important; width: auto !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages) { height: 22px !important; line-height: 20px !important; margin: 0 !important; min-width: 0 !important; order: 0 !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-page-sizes { margin-left: 0 !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { height: auto !important; line-height: 18px !important; margin: 0 1px !important; min-height: 20px !important; padding: 0 5px !important; transform: none !important; } body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-receivers.ff-query-grid-page #gridContainer .dx-pager .dx-selection { height: 18px !important; line-height: 18px !important; margin: 1px !important; max-height: 18px !important; min-height: 18px !important; padding: 0 6px !important; } /* Credits/Debits, Payments, and Debtors final action/selector lock. Keep the normal-mode eye action at the same size as compact mode, and keep the Debtors selector column tight. */ body.ff-app .ff-view-crdr, body.ff-app .ff-view-payments, body.ff-app .ff-debtors { --ff-finance-view-action-size: 16px; } body.ff-app .ff-debtors { --ff-debtors-select-column-width: 24px; } body.ff-app .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-debtors #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-debtors-select-column-width) !important; min-width: var(--ff-debtors-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-debtors-select-column-width) !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: var(--ff-finance-view-action-size) !important; justify-content: center !important; line-height: var(--ff-finance-view-action-size) !important; max-height: var(--ff-finance-view-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-crdr #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-view-payments #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-debtors #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa) { display: inline-block !important; font-size: var(--ff-finance-view-action-size) !important; height: var(--ff-finance-view-action-size) !important; line-height: var(--ff-finance-view-action-size) !important; max-height: var(--ff-finance-view-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-view-grid-row-selector-size, 14px) - 2px) !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-crdr #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-view-grid-row-selector-size, 14px) - 2px) !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 2px) !important; transform: translate(-50%, -50%) !important; } /* Query page final pane alignment lock. Keep fixed ID/selector panes and scrollable query results on the same row metrics in both modes. */ body.ff-app .ff-query { --ff-query-grid-header-row-height: calc(var(--ff-grid-row-height) + 6px); --ff-query-grid-filter-row-height: calc(var(--ff-grid-row-height) + 6px); } body.ff-app .ff-query #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-header-row, body.ff-app .ff-query #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-header-row > td { box-sizing: border-box !important; height: var(--ff-query-grid-header-row-height) !important; line-height: calc(var(--ff-query-grid-header-row-height) - 4px) !important; max-height: var(--ff-query-grid-header-row-height) !important; min-height: var(--ff-query-grid-header-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-header-padding-y) !important; padding-top: var(--ff-grid-header-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-datagrid-filter-row, body.ff-app .ff-query #gridContainer .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-datagrid-filter-row > td { box-sizing: border-box !important; height: var(--ff-query-grid-filter-row-height) !important; line-height: calc(var(--ff-query-grid-filter-row-height) - 4px) !important; max-height: var(--ff-query-grid-filter-row-height) !important; min-height: var(--ff-query-grid-filter-row-height) !important; overflow: hidden !important; padding-bottom: 2px !important; padding-top: 2px !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { box-sizing: border-box !important; height: calc(var(--ff-query-grid-filter-row-height) - 4px) !important; line-height: calc(var(--ff-query-grid-filter-row-height) - 6px) !important; max-height: calc(var(--ff-query-grid-filter-row-height) - 4px) !important; min-height: 0 !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row { box-sizing: border-box !important; height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; line-height: 0 !important; max-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-query #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; line-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; max-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand) { box-sizing: border-box !important; height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; line-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; max-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) { overflow: hidden !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) > *, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) :is(.dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.dx-command-expand) :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; justify-content: center !important; line-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; margin: 0 auto !important; max-height: var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px)) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { box-sizing: border-box !important; height: min(14px, var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px))) !important; line-height: min(14px, var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px))) !important; max-height: min(14px, var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px))) !important; max-width: min(14px, var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px))) !important; min-height: 0 !important; min-width: 0 !important; width: min(14px, var(--ff-query-cell-line-height, calc(var(--ff-grid-row-height) - 4px))) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit, body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit.dx-hidden-cell { font-size: 0 !important; line-height: 0 !important; overflow: visible !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-link, a, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-icon, .fa) { align-items: center !important; display: inline-flex !important; font-size: min(16px, calc(var(--ff-grid-row-height) - 4px)) !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td.dx-command-edit { font-size: 0 !important; line-height: 0 !important; overflow: visible !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td.dx-command-edit :is(.dx-link, a, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td.dx-command-edit :is(.dx-icon, .fa) { align-items: center !important; display: inline-flex !important; font-size: min(16px, calc(var(--ff-grid-row-height) - 4px)) !important; height: calc(var(--ff-grid-row-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } /* View Tracking final data-row density lock. The page keeps ff-view-compact for layout, so only body density/font settings decide row height. */ body.ff-app .ff-view-tracking { --ff-grid-row-height: 24px; --ff-grid-cell-padding-y: 0; --ff-tracking-content-height: 22px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking, body.ff-app[data-grid-font-size="small"] .ff-view-tracking { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-tracking-content-height: 18px; } body.ff-app[data-grid-font-size="large"] .ff-view-tracking { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-tracking-content-height: 28px; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody { height: auto !important; min-height: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: var(--ff-tracking-content-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: var(--ff-tracking-content-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td * { box-sizing: border-box !important; line-height: var(--ff-tracking-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-tracking-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-tracking-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox { align-items: center !important; display: inline-flex !important; height: min(14px, var(--ff-tracking-content-height)) !important; justify-content: center !important; line-height: min(14px, var(--ff-tracking-content-height)) !important; margin: 0 auto !important; max-height: min(14px, var(--ff-tracking-content-height)) !important; max-width: min(14px, var(--ff-tracking-content-height)) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: min(14px, var(--ff-tracking-content-height)) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-checkbox-icon { border-radius: 3px !important; box-sizing: border-box !important; height: min(14px, var(--ff-tracking-content-height)) !important; line-height: min(14px, var(--ff-tracking-content-height)) !important; max-height: min(14px, var(--ff-tracking-content-height)) !important; max-width: min(14px, var(--ff-tracking-content-height)) !important; min-height: 0 !important; min-width: 0 !important; width: min(14px, var(--ff-tracking-content-height)) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-button, .dx-button-content, .dx-link, a), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-icon, .fa) { align-items: center !important; display: inline-flex !important; font-size: min(16px, var(--ff-tracking-content-height)) !important; height: var(--ff-tracking-content-height) !important; justify-content: center !important; line-height: var(--ff-tracking-content-height) !important; margin: 0 !important; max-height: var(--ff-tracking-content-height) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; display: none !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Image Search end-of-file row lock. Fixed selector/action columns and scrollable columns render as separate tables. */ body.ff-app .ff-imaging-list { --ff-view-images-fixed-row-height: var(--ff-grid-row-height); --ff-view-images-row-height: var(--ff-grid-row-height); } /* Town/Hub master grid lock. Towns/Hubs uses one fixed grid density; compact/normal UI modes must not resize data rows. */ body.ff-app .ff-towns { --ff-townhub-content-height: 16px; --ff-townhub-pager-height: 22px; --ff-townhub-row-height: 18px; --ff-townhub-select-column-width: 32px; --ff-townhub-selector-radius: var(--ff-view-grid-row-selector-radius, 3px); --ff-townhub-selector-size: var(--ff-view-grid-row-selector-size, 14px); --ff-grid-row-height: var(--ff-townhub-row-height); --ff-grid-cell-padding-y: 0; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns { --ff-townhub-content-height: 16px; --ff-townhub-row-height: 18px; --ff-townhub-select-column-width: 32px; --ff-townhub-selector-size: var(--ff-view-grid-row-selector-size, 14px); } body.ff-app[data-grid-font-size="small"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns { --ff-townhub-content-height: 16px; --ff-townhub-row-height: 18px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns { --ff-townhub-content-height: 16px; --ff-townhub-row-height: 18px; --ff-townhub-select-column-width: 32px; --ff-townhub-selector-size: var(--ff-view-grid-row-selector-size, 14px); } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) { box-sizing: border-box !important; max-height: calc(100vh - 150px) !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-datagrid-table > tbody { min-height: 0 !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: auto !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-content-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) > *, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit) :is(.dx-template-wrapper, .dx-datagrid-text-content), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit) :is(.dx-link, a, button, .btn, .label, span), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-townhub-select-column-width) !important; min-width: var(--ff-townhub-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-townhub-select-column-width) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-command-select { height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-content-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-townhub-selector-size) !important; height: var(--ff-townhub-selector-size) !important; justify-content: center !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-townhub-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-townhub-selector-size) !important; height: var(--ff-townhub-selector-size) !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; padding: 0 !important; transform: none !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-townhub-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-pager, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-pager { align-items: center !important; border-top-width: 1px !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-townhub-pager-height) !important; margin: 0 !important; min-height: var(--ff-townhub-pager-height) !important; padding: 0 4px !important; } /* Town/Hub master toolbar guard. Explicit page-toolbar buttons now own add/export/column actions, so hide the duplicate DevExtreme header toolbar. */ body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-header-panel { display: none !important; height: 0 !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 0 !important; overflow: hidden !important; pointer-events: none !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-header-panel .dx-toolbar, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-header-panel .dx-toolbar-items-container { height: 26px !important; min-height: 26px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-header-panel .dx-toolbar-after { align-items: center !important; display: flex !important; gap: 4px !important; justify-content: flex-end !important; pointer-events: auto !important; right: 0 !important; width: 100% !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-header-panel :is(.dx-toolbar-item, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { pointer-events: auto !important; } body.ff-app .ff-towns .ff-grid-toolbar-inner { padding-right: 0 !important; } body.ff-app .ff-towns .ff-town-grid-actions { align-items: center !important; display: inline-flex !important; gap: 4px !important; margin-left: auto !important; white-space: nowrap !important; } body.ff-app .ff-towns .ff-town-grid-actions .btn-group, body.ff-app .ff-towns .ff-town-grid-actions .btn { align-items: center !important; display: inline-flex !important; float: none !important; margin: 0 !important; } body.ff-app .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn { gap: 5px !important; height: 26px !important; justify-content: center !important; line-height: 1 !important; min-height: 26px !important; min-width: 30px !important; padding: 0 8px !important; white-space: nowrap !important; } body.ff-app .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn .fa { line-height: 1 !important; margin: 0 !important; } body.ff-app .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn .caret { margin-left: 5px !important; } body.ff-app .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn span:not(.caret) { display: inline-block !important; line-height: 1 !important; max-width: none !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-towns .ff-town-grid-actions .dropdown-menu { min-width: 160px !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn, body.ff-app[data-grid-font-size="small"] .ff-towns .ff-town-grid-actions .ff-town-grid-action-btn { height: 22px !important; min-height: 22px !important; min-width: 28px !important; padding-left: 6px !important; padding-right: 6px !important; } body.ff-app .ff-towns .ff-grid-toolbar-row .btn[disabled], body.ff-app .ff-towns .ff-grid-toolbar-row .btn[disabled]:hover, body.ff-app .ff-towns .ff-grid-toolbar-row .btn[disabled]:focus { cursor: not-allowed !important; opacity: .45 !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox-icon { border-radius: 3px !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) :is(.ff-grid-boolean-checkbox, .dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-selector-size) !important; justify-content: center !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 auto !important; max-height: var(--ff-townhub-selector-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox-icon { height: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-pager, .dx-pager) :is(.dx-page-sizes, .dx-pages, .dx-info), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-pager, .dx-pager) :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-townhub-pager-height) - 2px) !important; line-height: calc(var(--ff-townhub-pager-height) - 4px) !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-freespace-row, .dx-virtual-row) > td, body.ff-app .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-bottom-load-panel { border: 0 !important; display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Invoice final selector/boolean checkbox lock. Keep the row selector hit target above the scrollable pane and keep POD/Verified flags square. */ body.ff-app .ff-generate-invoice { --ff-invoice-generate-effective-row-height: var(--ff-grid-row-height, 26px); --ff-invoice-generate-flag-check-radius: 3px; --ff-invoice-generate-flag-check-size: 14px; } body.ff-app[data-grid-font-size="large"] .ff-generate-invoice { --ff-invoice-generate-flag-check-size: 16px; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content-fixed { pointer-events: auto !important; z-index: 6 !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select { pointer-events: auto !important; z-index: 7 !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-grid-boolean-checkbox, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-generate-flag-check-size) !important; justify-content: center !important; line-height: var(--ff-invoice-generate-flag-check-size) !important; margin: 0 auto !important; max-height: var(--ff-invoice-generate-flag-check-size) !important; max-width: var(--ff-invoice-generate-flag-check-size) !important; min-height: var(--ff-invoice-generate-flag-check-size) !important; min-width: var(--ff-invoice-generate-flag-check-size) !important; overflow: visible !important; padding: 0 !important; transform: none !important; vertical-align: middle !important; width: var(--ff-invoice-generate-flag-check-size) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-invoice-generate-flag-check-radius) !important; box-sizing: border-box !important; display: block !important; height: var(--ff-invoice-generate-flag-check-size) !important; line-height: var(--ff-invoice-generate-flag-check-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-flag-check-size) !important; max-width: var(--ff-invoice-generate-flag-check-size) !important; min-height: var(--ff-invoice-generate-flag-check-size) !important; min-width: var(--ff-invoice-generate-flag-check-size) !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-invoice-generate-flag-check-size) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: calc(var(--ff-invoice-generate-flag-check-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Generate Invoice final normal-mode icon/tick alignment. Keep the eye action visually the same size as compact mode and lift the selector tick into the box. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col):has(.fa-eye) :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-link, a) { font-size: var(--ff-invoice-generate-action-size) !important; height: var(--ff-invoice-generate-action-size) !important; line-height: var(--ff-invoice-generate-action-size) !important; max-height: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; overflow: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col):has(.fa-eye) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-edit, .ff-invoice-generate-command-col):has(.fa-eye) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa)::before { display: inline-block !important; font-size: var(--ff-invoice-generate-action-size) !important; height: var(--ff-invoice-generate-action-size) !important; line-height: var(--ff-invoice-generate-action-size) !important; max-height: var(--ff-invoice-generate-action-size) !important; max-width: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; width: var(--ff-invoice-generate-action-size) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { top: calc(50% - 2px) !important; transform: translate(-50%, -50%) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice { --ff-invoice-generate-select-column-width: 28px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { max-width: var(--ff-invoice-generate-select-column-width) !important; min-width: var(--ff-invoice-generate-select-column-width) !important; width: var(--ff-invoice-generate-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; } /* Generate Invoice horizontal grid scroll. DevExtreme owns vertical height; horizontal overflow must remain scrollable when generated invoice columns are wider than the pane. */ body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper { max-width: 100% !important; overflow: hidden !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-width: none !important; min-width: var(--ff-invoice-generate-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-invoice-generate-horizontal-width, auto) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; } /* Generate Invoice waybill drill-in row-height lock. The waybill grid is initialized hidden, so clamp both panes after it is revealed. */ body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-detail-eye-icon-offset-y: 0px; --ff-invoice-generate-detail-eye-offset-y: 0px; --ff-invoice-generate-effective-row-height: var(--ff-grid-row-height, 20px); --ff-invoice-generate-detail-cell-height: calc(var(--ff-invoice-generate-detail-row-height) - 2px); --ff-invoice-generate-detail-cell-padding-y: 0; --ff-invoice-generate-detail-grid-min-height: 220px; --ff-invoice-generate-detail-grid-vh-offset: 360px; --ff-invoice-generate-detail-row-height: var(--ff-invoice-generate-effective-row-height); --ff-invoice-generate-detail-rows-min-height: 80px; --ff-invoice-generate-detail-rows-vh-offset: 500px; --ff-invoice-generate-detail-grid-content-height: calc((var(--ff-invoice-generate-effective-row-height, var(--ff-grid-row-height)) * var(--ff-invoice-generate-row-slots, 1)) + 108px); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-invoice-generate-effective-row-height, var(--ff-grid-row-height)) * var(--ff-invoice-generate-row-slots, 1)) + 2px); --ff-invoice-generate-detail-grid-height: max(var(--ff-invoice-generate-detail-grid-min-height), calc(100vh - var(--ff-invoice-generate-detail-grid-vh-offset))); --ff-invoice-generate-detail-rows-height: max(var(--ff-invoice-generate-detail-rows-min-height), calc(100vh - var(--ff-invoice-generate-detail-rows-vh-offset))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer, body.ff-app[data-grid-font-size="small"] .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-detail-eye-icon-offset-y: 0px; --ff-invoice-generate-detail-grid-min-height: 260px; --ff-invoice-generate-detail-grid-vh-offset: 255px; --ff-invoice-generate-detail-rows-vh-offset: 345px; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid { height: var(--ff-invoice-generate-detail-grid-height) !important; max-height: var(--ff-invoice-generate-detail-grid-height) !important; min-height: var(--ff-invoice-generate-detail-grid-height) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-invoice-generate-detail-rows-height) !important; max-height: var(--ff-invoice-generate-detail-rows-height) !important; min-height: var(--ff-invoice-generate-detail-rows-height) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-invoice-generate-detail-rows-content-height)) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollbar-vertical, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-scrollbar-vertical { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: var(--ff-invoice-generate-detail-row-height) !important; line-height: var(--ff-invoice-generate-detail-cell-height) !important; max-height: var(--ff-invoice-generate-detail-row-height) !important; min-height: var(--ff-invoice-generate-detail-row-height) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-invoice-generate-detail-row-height) !important; line-height: var(--ff-invoice-generate-detail-cell-height) !important; max-height: var(--ff-invoice-generate-detail-row-height) !important; min-height: var(--ff-invoice-generate-detail-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-generate-command-col) { overflow: visible !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn) { box-sizing: border-box !important; line-height: var(--ff-invoice-generate-detail-cell-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-invoice-generate-detail-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-invoice-generate-action-size) !important; justify-content: center !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-invoice-generate-command-column-width) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions { position: relative !important; top: var(--ff-invoice-generate-detail-eye-offset-y) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions .dx-button-content, body.ff-app[data-grid-font-size="small"] .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions .dx-button-content { position: static !important; transform: none !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .ff-invoice-generate-row-actions :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa)::before { color: var(--ff-primary, var(--primary)) !important; display: inline-block !important; font-family: FontAwesome !important; font-size: var(--ff-invoice-generate-action-size) !important; height: var(--ff-invoice-generate-action-size) !important; line-height: var(--ff-invoice-generate-action-size) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-action-size) !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-generate-action-size) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-return-btn { align-items: center !important; display: inline-flex !important; gap: 6px !important; justify-content: center !important; min-width: 104px !important; padding-left: 12px !important; padding-right: 12px !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-return-btn .fa { line-height: 1 !important; } /* Generate Invoice final summary/detail grid parity. dx-custom loads last, so keep the shared visual height here for both grids. */ body.ff-app .ff-generate-invoice { --ff-invoice-generate-grid-chrome-height: 146px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice, body.ff-app[data-grid-font-size="small"] .ff-generate-invoice { --ff-invoice-generate-grid-chrome-height: 138px; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-grid-height: clamp(520px, calc(100vh - 238px), 1320px); --ff-invoice-generate-detail-grid-height: var(--ff-invoice-generate-grid-height); --ff-invoice-generate-detail-row-height: var(--ff-grid-row-height); --ff-invoice-generate-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); --ff-invoice-generate-detail-rows-height: max(calc(var(--ff-grid-row-height) * 3), calc(var(--ff-invoice-generate-grid-height) - var(--ff-invoice-generate-grid-chrome-height))); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-grid-row-height) * var(--ff-invoice-generate-row-slots, 1)) + 2px); height: var(--ff-invoice-generate-grid-height) !important; max-height: var(--ff-invoice-generate-grid-height) !important; min-height: var(--ff-invoice-generate-grid-height) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer), body.ff-app[data-grid-font-size="small"] .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-grid-height: clamp(540px, calc(100vh - 218px), 1360px); --ff-invoice-generate-detail-grid-height: var(--ff-invoice-generate-grid-height); --ff-invoice-generate-detail-row-height: var(--ff-grid-row-height); --ff-invoice-generate-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); --ff-invoice-generate-detail-rows-height: max(calc(var(--ff-grid-row-height) * 3), calc(var(--ff-invoice-generate-grid-height) - var(--ff-invoice-generate-grid-chrome-height))); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-grid-row-height) * var(--ff-invoice-generate-row-slots, 1)) + 2px); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid { height: var(--ff-invoice-generate-grid-height) !important; max-height: var(--ff-invoice-generate-grid-height) !important; min-height: var(--ff-invoice-generate-grid-height) !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-detail-grid-height: var(--ff-invoice-generate-grid-height); --ff-invoice-generate-detail-row-height: var(--ff-grid-row-height); --ff-invoice-generate-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-invoice-generate-detail-rows-height) !important; max-height: var(--ff-invoice-generate-detail-rows-height) !important; min-height: var(--ff-invoice-generate-detail-rows-height) !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-invoice-generate-detail-rows-content-height)) !important; } /* Tariffs final toolbar and selector lock. The DevExtreme header panel can sit close to the custom toolbar; keep toolbar checkbox clicks and the normal selector tick clear. */ body.ff-app .ff-tariffs .ff-grid-toolbar-row { position: relative !important; z-index: 6 !important; } body.ff-app .ff-tariffs .ff-grid-toolbar-row :is(.checkbox, .checkbox-inline, .valuesonly, .clip-check, .clip-check label) { pointer-events: auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page > .container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer { overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer { box-sizing: border-box !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: 0 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) * { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-bottom-load-panel { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-header-panel { pointer-events: none !important; z-index: 1 !important; } body.ff-app .ff-tariffs #gridContainer .dx-datagrid-header-panel .dx-toolbar-after, body.ff-app .ff-tariffs #gridContainer .dx-datagrid-header-panel .dx-toolbar-after :is(.dx-button, .dx-texteditor, .dx-toolbar-item) { pointer-events: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon { color: var(--text) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs #gridContainer .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { color: var(--text) !important; font-size: calc(var(--ff-tariffs-check-size) - 1px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Query page row selector final lock. Keep the selector square centred inside the command cell so the checkbox edge and tick do not clip. */ body.ff-app .ff-query { --ff-query-row-selector-radius: 3px; --ff-query-row-selector-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query { --ff-query-row-selector-size: 16px; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-row-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-query-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-query-row-selector-size) !important; max-width: var(--ff-query-row-selector-size) !important; min-height: var(--ff-query-row-selector-size) !important; min-width: var(--ff-query-row-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-query-row-selector-size) !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-query-row-selector-size) !important; height: var(--ff-query-row-selector-size) !important; justify-content: center !important; line-height: var(--ff-query-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-query-row-selector-size) !important; max-width: var(--ff-query-row-selector-size) !important; min-height: var(--ff-query-row-selector-size) !important; min-width: var(--ff-query-row-selector-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-query-row-selector-size) !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-query-row-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-query-row-selector-size) !important; height: var(--ff-query-row-selector-size) !important; line-height: var(--ff-query-row-selector-size) !important; margin: 0 !important; max-height: var(--ff-query-row-selector-size) !important; max-width: var(--ff-query-row-selector-size) !important; min-height: var(--ff-query-row-selector-size) !important; min-width: var(--ff-query-row-selector-size) !important; overflow: visible !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-query-row-selector-size) !important; } body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-query #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { font-size: calc(var(--ff-query-row-selector-size) - 2px) !important; height: auto !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: auto !important; } /* Query page row action final lock. Keep the eye icon centred with the selector checkbox and prevent the bottom edge from clipping. */ body.ff-app .ff-query { --ff-query-row-eye-size: 16px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-query, body.ff-app[data-grid-font-size="small"] .ff-query { --ff-query-row-eye-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query { --ff-query-row-eye-size: 18px; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit { box-sizing: border-box !important; font-size: 0 !important; height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; line-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; max-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; min-height: var(--ff-query-row-height, var(--ff-grid-row-height)) !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .dx-link, a) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-row-eye-size) !important; justify-content: center !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-query-row-eye-size) !important; min-height: var(--ff-query-row-eye-size) !important; min-width: var(--ff-query-row-eye-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-query-row-eye-size) !important; } body.ff-app .ff-query #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-edit :is(.fa-eye, .dx-icon.fa-eye, .dx-icon-eyeopen, .dx-icon-eye) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; font-size: var(--ff-query-row-eye-size) !important; height: var(--ff-query-row-eye-size) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-query-row-eye-size) !important; max-width: var(--ff-query-row-eye-size) !important; min-height: var(--ff-query-row-eye-size) !important; min-width: var(--ff-query-row-eye-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-query-row-eye-size) !important; } /* View Collections final selector/colour lock. Density rebuilds and selected-row styling must not wash out status colours, and the row-selector tick sits slightly high inside the square. */ body.ff-app .ff-view-collections { --ff-collection-row-selector-radius: 3px; --ff-collection-row-selector-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-collections { --ff-collection-row-selector-size: 16px; } body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour > td, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row.ff-dx-preserved-row-colour > tr > td, body.ff-app .ff-view-collections.ff-preserve-row-colours #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-dx-preserved-row-colour-cell { background-color: var(--ff-preserved-row-bg) !important; color: var(--ff-preserved-row-fg, #000000) !important; } body.ff-app .ff-view-collections #gridContainer .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon { border-radius: var(--ff-collection-row-selector-radius) !important; height: var(--ff-collection-row-selector-size) !important; line-height: var(--ff-collection-row-selector-size) !important; max-height: var(--ff-collection-row-selector-size) !important; max-width: var(--ff-collection-row-selector-size) !important; min-height: var(--ff-collection-row-selector-size) !important; min-width: var(--ff-collection-row-selector-size) !important; overflow: visible !important; position: relative !important; width: var(--ff-collection-row-selector-size) !important; } body.ff-app .ff-view-collections #gridContainer .dx-datagrid-rowsview .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-collections #gridContainer .dx-datagrid-rowsview .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { font-size: calc(var(--ff-collection-row-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: calc(50% - 1px) !important; transform: translate(-50%, -50%) !important; } /* View Tracking absolute final row/selector lock. Fixed columns and scrollable data render as separate tables, so the page needs one late CSS row contract after every shared view/query selector rule. */ body.ff-app .ff-view-tracking { --ff-tracking-row-height-final: 24px; --ff-tracking-cell-height-final: 22px; --ff-tracking-cell-padding-y-final: 0px; --ff-tracking-select-column-width-final: 30px; --ff-tracking-command-column-width-final: 38px; --ff-tracking-selector-size-final: 14px; --ff-tracking-selector-radius-final: 3px; --ff-tracking-action-size-final: 16px; --ff-grid-row-height: var(--ff-tracking-row-height-final); --ff-grid-cell-padding-y: var(--ff-tracking-cell-padding-y-final); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking, body.ff-app[data-grid-font-size="small"] .ff-view-tracking { --ff-tracking-row-height-final: 14px; --ff-tracking-cell-height-final: 13px; --ff-tracking-select-column-width-final: 24px; --ff-tracking-command-column-width-final: 30px; --ff-tracking-selector-size-final: 12px; --ff-tracking-action-size-final: 16px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking { --ff-tracking-row-height-final: 32px; --ff-tracking-cell-height-final: 28px; --ff-tracking-select-column-width-final: 32px; --ff-tracking-command-column-width-final: 40px; --ff-tracking-selector-size-final: 16px; --ff-tracking-action-size-final: 18px; } body.ff-app .ff-view-tracking #gridContainer, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid, body.ff-app .ff-view-tracking #gridContainer .dx-gridbase-container, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(table, .dx-datagrid-table, .dx-datagrid-table-fixed), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { height: auto !important; min-height: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: var(--ff-tracking-row-height-final) !important; line-height: var(--ff-tracking-cell-height-final) !important; max-height: var(--ff-tracking-row-height-final) !important; min-height: var(--ff-tracking-row-height-final) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-tracking-row-height-final) !important; line-height: var(--ff-tracking-cell-height-final) !important; max-height: var(--ff-tracking-row-height-final) !important; min-height: var(--ff-tracking-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-tracking-cell-padding-y-final) !important; padding-top: var(--ff-tracking-cell-padding-y-final) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-tracking-select-col):not(.ff-tracking-command-col) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-tracking-select-col):not(.ff-tracking-command-col) :is(.dx-link, .dx-button, .dx-button-content, .btn) { box-sizing: border-box !important; line-height: var(--ff-tracking-cell-height-final) !important; max-height: var(--ff-tracking-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, td.ff-tracking-select-col), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col { box-sizing: border-box !important; max-width: var(--ff-tracking-select-column-width-final) !important; min-width: var(--ff-tracking-select-column-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-tracking-select-column-width-final) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox), body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tracking-selector-size-final) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-tracking-selector-size-final) !important; margin: 0 !important; max-height: var(--ff-tracking-selector-size-final) !important; max-width: var(--ff-tracking-selector-size-final) !important; min-height: var(--ff-tracking-selector-size-final) !important; min-width: var(--ff-tracking-selector-size-final) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tracking-selector-size-final) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-container, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col .dx-checkbox-container { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-tracking-selector-size-final) !important; height: var(--ff-tracking-selector-size-final) !important; justify-content: center !important; line-height: var(--ff-tracking-selector-size-final) !important; margin: 0 !important; max-height: var(--ff-tracking-selector-size-final) !important; max-width: var(--ff-tracking-selector-size-final) !important; min-height: var(--ff-tracking-selector-size-final) !important; min-width: var(--ff-tracking-selector-size-final) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-tracking-selector-size-final) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-tracking-selector-radius-final) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-tracking-selector-size-final) !important; height: var(--ff-tracking-selector-size-final) !important; line-height: var(--ff-tracking-selector-size-final) !important; margin: 0 !important; max-height: var(--ff-tracking-selector-size-final) !important; max-width: var(--ff-tracking-selector-size-final) !important; min-height: var(--ff-tracking-selector-size-final) !important; min-width: var(--ff-tracking-selector-size-final) !important; overflow: visible !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-tracking-selector-size-final) !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-tracking #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .ff-tracking-select-col .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { font-size: calc(var(--ff-tracking-selector-size-final) - 2px) !important; height: auto !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: auto !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-command-edit, .ff-tracking-command-col) { box-sizing: border-box !important; max-width: var(--ff-tracking-command-column-width-final) !important; min-width: var(--ff-tracking-command-column-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-tracking-command-column-width-final) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.ff-tracking-command-col) :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tracking-action-size-final) !important; justify-content: center !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-tracking-action-size-final) !important; min-height: var(--ff-tracking-action-size-final) !important; min-width: var(--ff-tracking-action-size-final) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tracking-action-size-final) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.ff-tracking-command-col) :is(.dx-button-text, .dx-button-content > span:not(.fa-eye):not(.dx-icon)) { display: none !important; height: 0 !important; line-height: 0 !important; width: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.ff-tracking-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon-eyeopen, .dx-icon-eye) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; font-size: var(--ff-tracking-action-size-final) !important; height: var(--ff-tracking-action-size-final) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-tracking-action-size-final) !important; max-width: var(--ff-tracking-action-size-final) !important; min-height: var(--ff-tracking-action-size-final) !important; min-width: var(--ff-tracking-action-size-final) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-tracking-action-size-final) !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-freespace-row > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Tracking fixed-pane parity lock. DevExtreme can leave the selection fixed table on a different row metric than the scrollable table; keep both concrete tables on the same row contract. */ body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table-fixed { border-collapse: collapse !important; height: auto !important; min-height: 0 !important; table-layout: fixed !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table-fixed > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-tracking-row-height-final) !important; line-height: var(--ff-tracking-cell-height-final) !important; max-height: var(--ff-tracking-row-height-final) !important; min-height: var(--ff-tracking-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-tracking-cell-padding-y-final) !important; padding-top: var(--ff-tracking-cell-padding-y-final) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td.dx-command-select, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td.dx-command-select, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td.ff-tracking-select-col, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td.ff-tracking-select-col, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td.dx-command-edit, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td.dx-command-edit, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td.ff-tracking-command-col, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td.ff-tracking-command-col { overflow: visible !important; position: relative !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-data-row):not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-data-row):not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row), body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-data-row):not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row) > td, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-data-row):not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-data-row) .dx-command-select .dx-checkbox, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-data-row) .dx-command-select .dx-checkbox, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-row:not(.dx-data-row) .ff-tracking-select-col .dx-checkbox, body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-data-row) .ff-tracking-select-col .dx-checkbox { display: none !important; } /* View Tracking short-result viewport lock. The page still has the legacy ff-view-compact class, whose shared safety net reserves a six-row rowsview. Tracking should shrink to the rows it actually has. */ body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-gridbase-container, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-compact.ff-view-tracking .ff-grid-result-row #gridContainer:not(.ff-tracking-scroll-rows) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-total-footer .dx-datagrid-summary-item { overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: scroll !important; scrollbar-gutter: stable !important; scrollbar-width: auto !important; } body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows .dx-datagrid-rowsview .dx-scrollable-scrollbar-vertical, body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows .dx-datagrid-rowsview .dx-scrollbar-vertical { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows :is(.dx-datagrid-pager, .dx-pager) { display: block !important; flex: 0 0 auto !important; min-height: 28px !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows .dx-datagrid-rowsview .dx-virtual-row, body.ff-app .ff-view-tracking #gridContainer.ff-tracking-scroll-rows .dx-datagrid-rowsview .dx-virtual-row > td { background: transparent !important; border: 0 !important; box-shadow: none !important; line-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-tracking #gridContainer :is(.dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper) { display: none !important; pointer-events: none !important; } body.ff-app .ff-view-tracking.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading { min-height: 160px !important; position: relative !important; } body.ff-app .ff-view-tracking.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading::before { align-items: center; background: rgba(255, 255, 255, 0.94); border: 1px solid #cfd8e3; border-radius: 6px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16); color: #1f2937; content: "Loading..."; display: flex; font-weight: 700; height: 46px; justify-content: center; left: 50%; min-width: 170px; pointer-events: none; position: absolute; top: 58px; transform: translateX(-50%); z-index: 50; } body.ff-app .ff-view-tracking.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading:not(.ff-grid-has-data):not(.ff-grid-loading-with-data) .dx-datagrid-rowsview { opacity: 0 !important; pointer-events: none !important; } body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading { min-height: 160px !important; position: relative !important; } body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading::before { align-items: center; background: rgba(255, 255, 255, 0.94); border: 1px solid #cfd8e3; border-radius: 6px; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16); color: #1f2937; content: none; display: none; font-weight: 700; height: 46px; justify-content: center; left: 50%; min-width: 170px; pointer-events: none; position: absolute; top: 58px; transform: translateX(-50%); z-index: 50; } body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading:not(.ff-grid-has-data):not(.ff-grid-loading-with-data) .dx-datagrid-rowsview { opacity: 0 !important; pointer-events: none !important; } body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-loading::before { content: "Loading..." !important; display: flex !important; } /* Query viewport scroll lock. The Query controller sets a viewport-based grid height so totals/pager stay visible and rows scroll inside DevExtreme. */ body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer { box-sizing: border-box !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { min-height: 0 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-row { margin-bottom: 4px !important; margin-top: 4px !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-row > .col-md-12 { padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-label { align-items: center; display: inline-flex; min-height: 24px; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-row.ng-hide, body.ff-app .ff-query.ff-query-grid-page .ff-grid-toolbar-row.ng-hide, body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row.ng-hide { display: none !important; } body.ff-app .ff-query.ff-query-grid-page > .container-fullw, body.ff-app .ff-query.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row, body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row > [class*="col-"], body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .form-group, body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container { overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row { position: relative !important; z-index: 3000 !important; } body.ff-app .ff-query.ff-query-grid-page:has(.ff-query-select-row .ui-select-container), body.ff-app .ff-query.ff-query-grid-page:has(.ff-query-select-row .ui-select-container) > .container-fullw, body.ff-app .ff-query.ff-query-grid-page:has(.ff-query-select-row .ui-select-container) > .container-fluid.container-fullw, body.ff-app .main-content > .container:has(.ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container) { min-height: 340px !important; overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container { position: relative !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container.open { z-index: 3000 !important; } body.ff-app > .ui-select-container.open { z-index: 30000 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container.open .ui-select-choices, body.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container.open .ui-select-dropdown, body.ff-app .ui-select-bootstrap.open .ui-select-choices.ui-select-dropdown.dropdown-menu, body.ff-app > .ui-select-container .ui-select-choices.ui-select-dropdown.dropdown-menu { z-index: 30000 !important; } /* Generate Manifest fixed-pane parity lock. The fixed checkbox/eye pane and the scrollable pane are separate tables; lock them to the same data-row contract after all earlier generator rules. */ body.ff-app .ff-generate-manifest { --ff-generate-manifest-parity-row-height: 30px; --ff-generate-manifest-parity-line-height: 26px; --ff-generate-manifest-parity-padding-y: 2px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-generate-manifest-parity-row-height: 30px; --ff-generate-manifest-parity-line-height: 26px; --ff-generate-manifest-parity-padding-y: 1px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-generate-manifest-parity-row-height: 34px; --ff-generate-manifest-parity-line-height: 30px; --ff-generate-manifest-parity-padding-y: 2px; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; height: auto !important; min-height: 0 !important; table-layout: auto !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-generate-manifest-parity-row-height) !important; line-height: var(--ff-generate-manifest-parity-line-height) !important; max-height: var(--ff-generate-manifest-parity-row-height) !important; min-height: var(--ff-generate-manifest-parity-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-generate-manifest-parity-padding-y) !important; padding-top: var(--ff-generate-manifest-parity-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col) { overflow: visible !important; position: relative !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest direct eye action: no wrapper element around the icon. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) > .ff-manifest-view-link, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) .ff-manifest-view-link { align-items: center !important; color: var(--ff-primary, var(--primary)) !important; cursor: pointer !important; display: inline-flex !important; font-family: FontAwesome !important; font-size: var(--ff-generate-manifest-row-eye-size) !important; height: auto !important; justify-content: center !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; text-align: center !important; text-decoration: none !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; visibility: visible !important; width: auto !important; z-index: 3 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) > .ff-manifest-view-link::before, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) .ff-manifest-view-link::before { display: inline-block !important; font-family: FontAwesome !important; font-size: var(--ff-generate-manifest-row-eye-size) !important; height: auto !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; overflow: visible !important; padding: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) .ff-manifest-view-link.disabled { cursor: default !important; opacity: 0.35 !important; } /* Debtors detail drill-in row-height lock. Detail rows use an overflow dropdown action, so clamp both panes after the detail grid is rendered. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) { --ff-debtors-detail-action-size: 16px; --ff-debtors-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); --ff-debtors-detail-row-height: var(--ff-grid-row-height); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; height: auto !important; min-height: 0 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-debtors-detail-row-height) !important; line-height: var(--ff-debtors-detail-cell-height) !important; max-height: var(--ff-debtors-detail-row-height) !important; min-height: var(--ff-debtors-detail-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .btn) { box-sizing: border-box !important; line-height: var(--ff-debtors-detail-cell-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-debtors-detail-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-debtors-detail-row-height) !important; line-height: var(--ff-debtors-detail-cell-height) !important; max-height: var(--ff-debtors-detail-row-height) !important; min-height: var(--ff-debtors-detail-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; vertical-align: middle !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview .dx-command-edit :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-debtors-detail-action-size) !important; justify-content: center !important; line-height: var(--ff-debtors-detail-action-size) !important; margin: 0 auto !important; max-height: var(--ff-debtors-detail-action-size) !important; max-width: var(--ff-grid-command-column-width, 34px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-grid-command-column-width, 34px) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview .dx-command-edit :is(.dx-icon, .dx-icon-overflow, .fa) { display: inline-block !important; font-size: var(--ff-debtors-detail-action-size) !important; height: var(--ff-debtors-detail-action-size) !important; line-height: var(--ff-debtors-detail-action-size) !important; margin: 0 !important; max-height: var(--ff-debtors-detail-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer:has(.dx-command-edit .dx-dropdownbutton) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Image Search fixed-pane parity lock. DevExtreme renders the selector/action columns in a separate table, so keep the final data-row contract identical in both rendered panes. */ body.ff-app .ff-imaging-list { --ff-image-row-height-final: var(--ff-grid-row-height); --ff-image-cell-height-final: calc(var(--ff-image-row-height-final) - var(--ff-grid-cell-padding-y) - var(--ff-grid-cell-padding-y)); } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(table, .dx-datagrid-table, .dx-datagrid-table-fixed), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { border-collapse: collapse !important; border-spacing: 0 !important; height: auto !important; min-height: 0 !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: auto !important; line-height: 0 !important; max-height: none !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-image-row-height-final) !important; line-height: var(--ff-image-cell-height-final) !important; max-height: var(--ff-image-row-height-final) !important; min-height: var(--ff-image-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-command-select, .ff-image-select-col, .dx-command-edit, .ff-image-command-col) { box-sizing: border-box !important; height: var(--ff-image-row-height-final) !important; line-height: var(--ff-image-cell-height-final) !important; max-height: var(--ff-image-row-height-final) !important; min-height: var(--ff-image-row-height-final) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-select-col):not(.ff-image-command-col) > :is(.dx-template-wrapper, .dx-datagrid-text-content, span, a, button, .btn, .label), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.ff-image-select-col):not(.ff-image-command-col) :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: var(--ff-image-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-image-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Debtors detail final pane/overflow lock. The drilled-in detail grid uses a dropdown action column; keep that fixed pane, the selector pane, and the scrollable table on the same row contract in every density. */ body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid { --ff-debtors-detail-action-size: 16px; --ff-debtors-detail-cell-height: calc(var(--ff-debtors-detail-row-height) - 2px); --ff-debtors-detail-command-column-width: 34px; --ff-debtors-detail-row-height: 26px; --ff-debtors-detail-select-column-width: 24px; box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid, body.ff-app[data-grid-font-size="small"] .ff-debtors #gridContainer.ff-debtors-detail-grid { --ff-debtors-detail-action-size: 14px; --ff-debtors-detail-cell-height: 18px; --ff-debtors-detail-command-column-width: 28px; --ff-debtors-detail-row-height: 20px; --ff-debtors-detail-select-column-width: 22px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid { --ff-debtors-detail-action-size: 18px; --ff-debtors-detail-cell-height: 30px; --ff-debtors-detail-command-column-width: 36px; --ff-debtors-detail-row-height: 34px; --ff-debtors-detail-select-column-width: 26px; } body.ff-app .ff-debtors .ff-debtors-detail-results, body.ff-app .ff-debtors .ff-debtors-detail-results .ff-grid-result-row, body.ff-app .ff-debtors .ff-debtors-detail-results .ff-grid-result-row > .col-md-12, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-scrollable-content { max-width: 100% !important; overflow: hidden !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-debtors-detail-select-column-width) !important; min-width: var(--ff-debtors-detail-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-debtors-detail-select-column-width) !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-debtors-detail-command-col), body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-debtors-detail-command-col) > td { box-sizing: border-box !important; color: transparent !important; font-size: 0 !important; max-width: var(--ff-debtors-detail-command-column-width) !important; min-width: var(--ff-debtors-detail-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-debtors-detail-command-column-width) !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; height: auto !important; min-height: 0 !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-debtors-detail-row-height) !important; line-height: var(--ff-debtors-detail-cell-height) !important; max-height: var(--ff-debtors-detail-row-height) !important; min-height: var(--ff-debtors-detail-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y, 1px) !important; padding-top: var(--ff-grid-cell-padding-y, 1px) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td { padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-debtors-detail-command-col) { box-sizing: border-box !important; height: var(--ff-debtors-detail-row-height) !important; line-height: var(--ff-debtors-detail-cell-height) !important; max-height: var(--ff-debtors-detail-row-height) !important; min-height: var(--ff-debtors-detail-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-grid-cell-padding-y, 1px) !important; padding-top: var(--ff-grid-cell-padding-y, 1px) !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-debtors-detail-command-col) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit):not(.ff-debtors-detail-command-col) :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: var(--ff-debtors-detail-cell-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-debtors-detail-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-debtors-detail-command-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-debtors-detail-command-col) .ff-debtors-detail-row-actions, body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-edit, .ff-debtors-detail-command-col) :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border-color: transparent !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-debtors-detail-action-size) !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: var(--ff-debtors-detail-action-size) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; text-overflow: clip !important; vertical-align: middle !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-edit, .ff-debtors-detail-command-col) :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .ff-debtors-detail-row-actions) { max-width: var(--ff-debtors-detail-command-column-width) !important; width: var(--ff-debtors-detail-command-column-width) !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-edit, .ff-debtors-detail-command-col) :is(.dx-button-text, .dx-button-content > span:not(.dx-icon):not(.fa), .dx-dropdownbutton-toggle .dx-icon-spindown) { display: none !important; font-size: 0 !important; height: 0 !important; line-height: 0 !important; max-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-command-edit, .ff-debtors-detail-command-col) :is(.dx-icon, .dx-icon-overflow, .fa) { color: var(--text) !important; display: inline-block !important; font-size: var(--ff-debtors-detail-action-size) !important; height: var(--ff-debtors-detail-action-size) !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-debtors-detail-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-debtors #gridContainer.ff-debtors-detail-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Final grid command icon reset. Do not use full-cell invisible wrappers around eye / 3-dot commands; keep the command cell sized by the grid, but let the clickable icon wrapper hug the icon. */ body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) { --ff-view-grid-icon-lift: 0px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice), body.ff-app[data-grid-font-size="small"] :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) { --ff-view-grid-icon-lift: 1px; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.dx-command-expand, td[class*="-command-col"]) { overflow: visible !important; position: relative !important; text-align: center !important; text-overflow: clip !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.dx-command-expand, td[class*="-command-col"]) :is(.dx-link, a, .dx-button, .dx-dropdownbutton):has(:is(.fa-eye, .fa-ellipsis-v, .dx-icon-eyeopen, .dx-icon-eye, .dx-icon-overflow)) { align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-grid-action-icon-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-view-grid-action-icon-size, 16px) !important; max-width: var(--ff-view-grid-action-icon-size, 16px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: absolute !important; text-overflow: clip !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-grid-action-icon-size, 16px) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.dx-command-expand, td[class*="-command-col"]) :is(.dx-link, a, .dx-button, .dx-dropdownbutton):has(:is(.fa-eye, .fa-ellipsis-v, .dx-icon-eyeopen, .dx-icon-eye, .dx-icon-overflow)) :is(.dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-grid-action-icon-size, 16px) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-view-grid-action-icon-size, 16px) !important; max-width: var(--ff-view-grid-action-icon-size, 16px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; text-overflow: clip !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-grid-action-icon-size, 16px) !important; } body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.dx-command-expand, td[class*="-command-col"]) :is(.fa-eye, .fa-ellipsis-v, .dx-icon-eyeopen, .dx-icon-eye, .dx-icon-overflow), body.ff-app :is(.ff-view-waybills, .ff-view-collections, .ff-view-manifests, .ff-view-manifest-routes, .ff-view-quotes, .ff-view-invoices, .ff-view-crdr, .ff-view-payments, .ff-debtors, .ff-statement, .ff-consolidation, .ff-imaging-list, .ff-view-tracking, .ff-query, .ff-tariffs, .ff-escalation, .ff-generate-manifest, .ff-generate-invoice) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.dx-command-expand, td[class*="-command-col"]) :is(.dx-link, a, .dx-button, .dx-dropdownbutton):has(:is(.fa-eye, .fa-ellipsis-v, .dx-icon-eyeopen, .dx-icon-eye, .dx-icon-overflow)) :is(.fa-eye, .fa-ellipsis-v, .dx-icon-eyeopen, .dx-icon-eye, .dx-icon-overflow) { box-sizing: border-box !important; display: inline-block !important; font-size: var(--ff-view-grid-action-icon-size, 16px) !important; height: auto !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; text-overflow: clip !important; transform: translateY(calc(-1 * var(--ff-view-grid-icon-lift, 0px))) !important; vertical-align: middle !important; width: auto !important; } body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-option .clip-check label { margin-right: 0 !important; } body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-option .clip-check input[type="checkbox"]:checked + label::after, body.ff-app .ff-generate-manifest .ff-manifest-wb-entry-option .clip-check input[type="checkbox"]:checked + label:after { left: 2px !important; } /* Generate Invoice final summary/detail row and action parity. This sits after the shared command-icon reset so both grids keep identical row/action metrics. */ body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); --ff-invoice-generate-detail-row-height: var(--ff-grid-row-height); --ff-view-grid-action-icon-size: var(--ff-invoice-generate-action-size, 16px); --ff-view-grid-icon-lift: 0px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer), body.ff-app[data-grid-font-size="small"] .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) { --ff-view-grid-icon-lift: 1px; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; font-size: var(--ff-control-font-size) !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor):not(.ff-invoice-generate-row-actions) { box-sizing: border-box !important; font-size: var(--ff-control-font-size) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.ff-invoice-generate-command-col) { overflow: visible !important; position: relative !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-grid-toolbar { margin-bottom: 1px !important; margin-top: 0 !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-grid-toolbar .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; min-height: 24px !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 0 !important; margin-bottom: 1px !important; min-width: 0 !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row > .ff-invoice-generate-selected-inner { align-items: center !important; display: flex !important; flex: 1 1 auto !important; flex-wrap: nowrap !important; gap: 4px 12px !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-client-heading { flex: 1 1 360px !important; margin: 0 !important; min-width: 180px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-client-heading .text-primary { overflow: hidden !important; text-overflow: ellipsis !important; vertical-align: bottom !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-detail-toolbar { align-items: center !important; display: inline-flex !important; flex: 0 1 auto !important; flex-wrap: wrap !important; gap: 4px 8px !important; justify-content: flex-end !important; min-height: 24px !important; min-width: 0 !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-return-btn { flex: 0 0 auto !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-row { align-items: flex-end !important; gap: 4px 14px !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-row > .ff-invoice-generate-date-toolbar { align-items: center !important; display: flex !important; flex: 1 1 0 !important; flex-wrap: wrap !important; gap: 4px 8px !important; justify-content: flex-start !important; margin-left: 12px !important; max-width: none !important; min-height: var(--ff-control-h) !important; min-width: 0 !important; padding-bottom: 0 !important; width: auto !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-grid-row-count-label { align-items: center !important; display: inline-flex !important; line-height: 16px !important; margin: 0 !important; min-height: 20px !important; padding: 2px 6px !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar :is(.ff-invoice-generate-summary-tools-left, .ff-invoice-generate-summary-tools-right) { align-items: center !important; display: inline-flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; min-width: 0 !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-invoice-generate-summary-tools-left { flex: 0 1 auto !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-invoice-generate-summary-tools-right { flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-invoice-generate-summary-tools-left .checkbox-inline { margin-left: 2px !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-invoice-generate-summary-tools-right .ff-grid-toolbar-action { margin-left: 0 !important; } body.ff-app .ff-generate-invoice :is(.ff-invoice-generate-grid-toolbar, .ff-invoice-generate-date-toolbar, .ff-invoice-generate-detail-toolbar) .ff-grid-toolbar-action { gap: 4px !important; min-width: 74px !important; } body.ff-app .ff-generate-invoice :is(.ff-invoice-generate-grid-toolbar, .ff-invoice-generate-date-toolbar, .ff-invoice-generate-detail-toolbar) .checkbox-inline { margin-left: 6px !important; } @media (max-width: 720px) { body.ff-app .ff-generate-invoice .ff-invoice-generate-date-toolbar .ff-invoice-generate-summary-tools-right { flex: 1 1 100% !important; margin-left: 0 !important; } } @media (max-width: 900px) { body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row > .ff-invoice-generate-selected-inner { flex-wrap: wrap !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-client-heading { flex: 1 1 100% !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-selected-row .ff-invoice-generate-detail-toolbar { justify-content: flex-start !important; } } /* Generate Invoice final detail row-height parity. Earlier detail-only rules have a stronger selector, so repeat the row contract here with the same detail scope to keep waybill rows identical to summary rows. */ body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-detail-cell-height: calc(var(--ff-grid-row-height) - 2px); --ff-invoice-generate-detail-row-height: var(--ff-grid-row-height); --ff-invoice-generate-effective-row-height: var(--ff-grid-row-height); } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-generate-invoice .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor):not(.ff-invoice-generate-row-actions) { line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Invoices final row-density lock. The waybill drill-down is a single table now; keep the late cell contract so normal/compact text and selector/action cells stay inside the same row box. */ body.ff-app .ff-view-invoices { --ff-view-invoices-cell-line-height: calc(var(--ff-view-invoices-row-height) - 4px); --ff-view-invoices-command-column-width: 24px; --ff-view-invoices-row-height: 30px; --ff-view-invoices-select-column-width: 26px; --ff-grid-cell-padding-y: 1px; --ff-grid-command-column-width: var(--ff-view-invoices-command-column-width); --ff-grid-row-height: var(--ff-view-invoices-row-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices, body.ff-app[data-grid-font-size="small"] .ff-view-invoices { --ff-view-invoices-command-column-width: 24px; --ff-view-invoices-row-height: 22px; --ff-view-invoices-select-column-width: 24px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices { --ff-view-invoices-command-column-width: 28px; --ff-view-invoices-row-height: 36px; --ff-view-invoices-select-column-width: 28px; --ff-grid-cell-padding-y: 2px; } body.ff-app .ff-view-invoices #waybillGridContainer { --ff-view-invoices-cell-line-height: calc(var(--ff-view-invoices-row-height) - 4px); --ff-view-invoices-command-column-width: 42px; --ff-view-invoices-row-height: 42px; --ff-view-invoices-select-column-width: 28px; --ff-grid-row-height: var(--ff-view-invoices-row-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-invoices #waybillGridContainer, body.ff-app[data-grid-font-size="small"] .ff-view-invoices #waybillGridContainer { --ff-view-invoices-command-column-width: 36px; --ff-view-invoices-row-height: 32px; --ff-view-invoices-select-column-width: 24px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #waybillGridContainer { --ff-view-invoices-command-column-width: 46px; --ff-view-invoices-row-height: 50px; --ff-view-invoices-select-column-width: 30px; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { box-sizing: border-box !important; max-width: var(--ff-view-invoices-select-column-width) !important; min-width: var(--ff-view-invoices-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-invoices-select-column-width) !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-view-command-col), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-invoice-view-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { box-sizing: border-box !important; height: var(--ff-view-invoices-row-height) !important; line-height: var(--ff-view-invoices-cell-line-height) !important; max-height: var(--ff-view-invoices-row-height) !important; min-height: var(--ff-view-invoices-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-invoice-generate-detail-cell-padding-y) !important; padding-top: var(--ff-invoice-generate-detail-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-command-col) { overflow: visible !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn) { box-sizing: border-box !important; line-height: var(--ff-view-invoices-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-view-invoices-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: var(--ff-view-invoices-cell-line-height) !important; justify-content: center !important; line-height: var(--ff-view-invoices-cell-line-height) !important; margin: 0 auto !important; max-height: var(--ff-view-invoices-cell-line-height) !important; min-height: 0 !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-data-row > td .dx-checkbox-icon { height: min(14px, var(--ff-view-invoices-cell-line-height)) !important; width: min(14px, var(--ff-view-invoices-cell-line-height)) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { font-size: 12px !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 3px) !important; transform: translate(-50%, -50%) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col):has(.fa-eye) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa.fa-eye, .dx-button .fa-eye, .dx-button-content .fa-eye) { display: inline-block !important; font-size: var(--ff-view-grid-action-icon-size, 16px) !important; height: var(--ff-view-grid-action-icon-size, 16px) !important; line-height: var(--ff-view-grid-action-icon-size, 16px) !important; margin: 0 !important; max-height: var(--ff-view-grid-action-icon-size, 16px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; text-decoration: none !important; width: auto !important; } body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-invoices :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest compact fixed-pane final lock. Keep the checkbox/eye fixed tables and the scrollable data table on one achievable row height; a 20px row is below the rendered icon/text minimum. */ body.ff-app .ff-generate-manifest { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 1px; --ff-generate-manifest-parity-row-height: 30px; --ff-generate-manifest-parity-line-height: 26px; --ff-generate-manifest-parity-padding-y: 1px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-grid-row-height: 30px; --ff-grid-cell-padding-y: 1px; --ff-generate-manifest-parity-row-height: 30px; --ff-generate-manifest-parity-line-height: 26px; --ff-generate-manifest-parity-padding-y: 1px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-generate-manifest-parity-row-height: 34px; --ff-generate-manifest-parity-line-height: 30px; --ff-generate-manifest-parity-padding-y: 2px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; height: auto !important; min-height: 0 !important; table-layout: auto !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: var(--ff-generate-manifest-parity-row-height) !important; line-height: var(--ff-generate-manifest-parity-line-height) !important; max-height: var(--ff-generate-manifest-parity-row-height) !important; min-height: var(--ff-generate-manifest-parity-row-height) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-generate-manifest-parity-row-height) !important; line-height: var(--ff-generate-manifest-parity-line-height) !important; max-height: var(--ff-generate-manifest-parity-row-height) !important; min-height: var(--ff-generate-manifest-parity-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-generate-manifest-parity-padding-y) !important; padding-top: var(--ff-generate-manifest-parity-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col) { overflow: visible !important; position: relative !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, span, a, button, .label, .badge), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-texteditor), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, span, a, button, .label, .badge), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-texteditor), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn) { box-sizing: border-box !important; line-height: var(--ff-generate-manifest-parity-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-generate-manifest-parity-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-view-link, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-view-link::before, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-view-link, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .ff-manifest-view-link::before { height: auto !important; line-height: 1 !important; max-height: none !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app[data-grid-font-size="small"] .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifest Routes viewport scroll lock. The controller caps this grid to the visible viewport so rows scroll inside DevExtreme. */ body.ff-app .ff-view-manifest-routes .ff-route-results .ff-grid-result-row, body.ff-app .ff-view-manifest-routes .ff-route-results .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid { height: var(--ff-route-grid-height) !important; max-height: var(--ff-route-grid-height) !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview { height: var(--ff-route-rowsview-height) !important; max-height: var(--ff-route-rowsview-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: auto !important; } body.ff-app .ff-view-manifest-routes .ff-route-results #gridContainer.ff-route-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { min-height: 0 !important; } /* View Manifests selector final fit. DevExtreme's fixed pane uses generated colgroup widths, so size the first fixed column as well as the command cells to stop the row selector from clipping. */ body.ff-app .ff-view-manifests { --ff-view-manifests-selector-column-width: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests, body.ff-app[data-grid-font-size="small"] .ff-view-manifests { --ff-view-manifests-selector-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-manifests { --ff-view-manifests-selector-column-width: 38px; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-view-manifests-selector-column-width) !important; min-width: var(--ff-view-manifests-selector-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; width: var(--ff-view-manifests-selector-column-width) !important; } body.ff-app .ff-view-manifests #gridContainer .dx-datagrid-content-fixed { min-width: calc(var(--ff-view-manifests-selector-column-width) + var(--ff-view-manifests-command-column-width, 34px)) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content-fixed col:first-child, body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-table-fixed col:first-child { width: var(--ff-view-manifests-selector-column-width) !important; } body.ff-app .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { left: 50% !important; margin: 0 !important; max-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size, 14px)) !important; min-width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size, 14px)) !important; overflow: visible !important; position: absolute !important; transform: translate(-50%, -50%) !important; width: var(--ff-view-manifests-check-width, var(--ff-view-manifests-check-size, 14px)) !important; } /* View Manifests compact row-height trim. Keep the font, eye icon, and checkbox sizes stable while reducing the row box. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests { --ff-grid-row-height: 16px; --ff-grid-cell-padding-y: 0; --ff-view-manifests-row-height: 16px; --ff-view-manifests-fixed-row-height: 16px; --ff-view-manifests-check-height: 12px; --ff-view-manifests-check-size: 12px; --ff-view-manifests-check-width: 12px; --ff-view-manifests-action-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row) > td { height: var(--ff-view-manifests-row-height) !important; min-height: var(--ff-view-manifests-row-height) !important; max-height: var(--ff-view-manifests-row-height) !important; padding-top: 0 !important; padding-bottom: 0 !important; line-height: var(--ff-view-manifests-row-height) !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(span, div, a, button, .dx-template-wrapper, .ff-grid-link, .ff-grid-cell-value) { max-height: var(--ff-view-manifests-row-height) !important; line-height: var(--ff-view-manifests-row-height) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td.dx-editor-cell.dx-editor-inline-block:not(.dx-command-select)::before { box-sizing: border-box !important; height: calc(var(--ff-view-manifests-row-height) - 4px) !important; line-height: calc(var(--ff-view-manifests-row-height) - 4px) !important; max-height: calc(var(--ff-view-manifests-row-height) - 4px) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { top: 50% !important; width: var(--ff-view-manifests-check-width) !important; min-width: var(--ff-view-manifests-check-width) !important; height: var(--ff-view-manifests-check-height) !important; min-height: var(--ff-view-manifests-check-height) !important; line-height: var(--ff-view-manifests-check-height) !important; transform: translate(-50%, -50%) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon { width: var(--ff-view-manifests-check-size) !important; height: var(--ff-view-manifests-check-size) !important; min-width: var(--ff-view-manifests-check-size) !important; min-height: var(--ff-view-manifests-check-size) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-edit :is(.dx-link, a, .fa, .dx-icon, .ff-manifest-row-actions), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .ff-manifest-command-col :is(.dx-link, a, .fa, .dx-icon, .ff-manifest-row-actions) { height: var(--ff-view-manifests-action-size) !important; min-height: var(--ff-view-manifests-action-size) !important; max-height: var(--ff-view-manifests-action-size) !important; line-height: var(--ff-view-manifests-action-size) !important; font-size: var(--ff-view-manifests-action-size) !important; } /* Generate Manifest command eye final lock. The eye is painted on the command cell itself so there is no child wrapper that can add row height, shift the icon, or clip the glyph. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-manifest-command-col).ff-manifest-view-cell { cursor: pointer !important; line-height: var(--ff-generate-manifest-parity-line-height, 26px) !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-manifest-command-col).ff-manifest-view-cell > * { display: none !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-manifest-command-col).ff-manifest-view-cell::before { color: var(--ff-primary, var(--primary)) !important; content: "\f06e"; display: block !important; font-family: FontAwesome !important; font-size: var(--ff-generate-manifest-row-eye-size, 16px) !important; height: auto !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; max-width: none !important; overflow: visible !important; padding: 0 !important; pointer-events: none !important; position: absolute !important; text-align: center !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: auto !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-manifest-command-col).ff-manifest-view-cell.disabled { cursor: default !important; opacity: .35 !important; } /* Generate Manifest final fixed/scrollable row parity. DevExtreme paints fixed columns and scrollable columns as separate tables, so the page needs one late row contract that applies to both panes in every mode. */ body.ff-app .ff-generate-manifest { --ff-generate-manifest-row-height-final: var(--ff-generate-manifest-parity-row-height, 30px); --ff-generate-manifest-cell-line-final: var(--ff-generate-manifest-parity-line-height, 26px); --ff-generate-manifest-cell-padding-final: var(--ff-generate-manifest-parity-padding-y, 1px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest, body.ff-app[data-grid-font-size="small"] .ff-generate-manifest { --ff-generate-manifest-row-height-final: 30px; --ff-generate-manifest-cell-line-final: 26px; --ff-generate-manifest-cell-padding-final: 1px; } body.ff-app[data-grid-font-size="large"] .ff-generate-manifest { --ff-generate-manifest-row-height-final: 34px; --ff-generate-manifest-cell-line-final: 30px; --ff-generate-manifest-cell-padding-final: 2px; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; border-spacing: 0 !important; min-height: 0 !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-generate-manifest-row-height-final) !important; line-height: var(--ff-generate-manifest-cell-line-final) !important; max-height: var(--ff-generate-manifest-row-height-final) !important; min-height: var(--ff-generate-manifest-row-height-final) !important; padding-bottom: var(--ff-generate-manifest-cell-padding-final) !important; padding-top: var(--ff-generate-manifest-cell-padding-final) !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-manifest-select-col, .dx-command-edit, .ff-manifest-command-col) { box-sizing: border-box !important; height: var(--ff-generate-manifest-row-height-final) !important; line-height: var(--ff-generate-manifest-cell-line-final) !important; max-height: var(--ff-generate-manifest-row-height-final) !important; min-height: var(--ff-generate-manifest-row-height-final) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, span, a, button, .label, .badge), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-texteditor), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn) { box-sizing: border-box !important; line-height: var(--ff-generate-manifest-cell-line-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-generate-manifest-cell-line-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-manifest-select-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: var(--ff-generate-manifest-row-height-final) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-generate-manifest-row-height-final) !important; margin: 0 !important; max-height: var(--ff-generate-manifest-row-height-final) !important; min-height: var(--ff-generate-manifest-row-height-final) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .ff-manifest-select-col) .dx-checkbox-icon { height: min(14px, calc(var(--ff-generate-manifest-row-height-final) - 6px)) !important; width: min(14px, calc(var(--ff-generate-manifest-row-height-final) - 6px)) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col).ff-manifest-view-cell { height: var(--ff-generate-manifest-row-height-final) !important; line-height: var(--ff-generate-manifest-cell-line-final) !important; max-height: var(--ff-generate-manifest-row-height-final) !important; min-height: var(--ff-generate-manifest-row-height-final) !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Generate Manifest single-table column contract. Column fixing is disabled on this grid now, and the controller supplies explicit field-aware widths. Avoid physical col-index pins here because hidden/generated command columns can differ between rendered tables. */ body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { table-layout: fixed !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .ff-manifest-select-col) { max-width: 24px !important; min-width: 24px !important; width: 24px !important; } body.ff-app .ff-generate-manifest #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-edit, .ff-manifest-command-col) { max-width: 34px !important; min-width: 34px !important; width: 34px !important; } /* Generate Manifest filter row interaction guard. Keep the filter editors clickable/editable after late grid-width and action column locks are applied. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row > tr > td, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row :is(.dx-editor-cell, .dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { pointer-events: auto !important; user-select: auto !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { position: relative !important; z-index: 3 !important; } /* Generate Manifest hidden-column guard. Earlier viewport safety rules must not resurrect DevExtreme's hidden/helper cells in the body table; doing so creates blank row-only columns and shifts the visible data away from the header/filter colgroup. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td[style*="display: none"], body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td[style*="display:none"], body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td[style*="width: 0px"], body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td[style*="width:0px"], body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td[aria-hidden="true"], body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-hidden-cell { border: 0 !important; display: none !important; max-width: 0 !important; min-width: 0 !important; padding: 0 !important; visibility: collapse !important; width: 0 !important; } /* Generate Invoice viewport and detail-density final lock. Keep the shell/page from adding a second scroll lane, then let the grid own vertical scrolling while the waybill detail rows stay tighter than before. */ html:has(body.ff-app .ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid), html:has(body.ff-app .ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid), body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid), body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid) { overflow-y: auto !important; } body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid) #app, body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid) #app, body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid) .main-content, body.ff-app:has(.ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid), body.ff-app .main-content > .container:has(.ff-generate-invoice.ff-query-grid-page #waybillGridContainer .dx-datagrid) { overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page, body.ff-app .ff-generate-invoice.ff-query-grid-page > .container-fullw, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page > .container-fullw { overflow: visible !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-grid-height: clamp(560px, calc(100dvh - 188px), 1500px); --ff-invoice-generate-detail-grid-height: var(--ff-invoice-generate-grid-height); --ff-invoice-generate-detail-rows-height: max(calc(var(--ff-grid-row-height) * 3), calc(var(--ff-invoice-generate-grid-height) - var(--ff-invoice-generate-grid-chrome-height, 146px))); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-grid-row-height) * var(--ff-invoice-generate-row-slots, 1)) + 2px); height: var(--ff-invoice-generate-grid-height) !important; max-height: var(--ff-invoice-generate-grid-height) !important; min-height: var(--ff-invoice-generate-grid-height) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer), body.ff-app[data-grid-font-size="small"] .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-grid-height: clamp(560px, calc(100dvh - 172px), 1520px); } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid { height: var(--ff-invoice-generate-grid-height) !important; max-height: var(--ff-invoice-generate-grid-height) !important; min-height: var(--ff-invoice-generate-grid-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-invoice-generate-detail-rows-height) !important; max-height: var(--ff-invoice-generate-detail-rows-height) !important; min-height: var(--ff-invoice-generate-detail-rows-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-invoice-generate-detail-rows-content-height)) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-grid-chrome-height: 112px; --ff-invoice-generate-detail-row-height-final: max(14px, calc(var(--ff-grid-row-height) - 4px)); --ff-invoice-generate-detail-cell-height-final: max(12px, calc(var(--ff-grid-row-height) - 6px)); --ff-invoice-generate-detail-row-height: var(--ff-invoice-generate-detail-row-height-final); --ff-invoice-generate-detail-cell-height: var(--ff-invoice-generate-detail-cell-height-final); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-invoice-generate-detail-row-height-final) * var(--ff-invoice-generate-row-slots, 1)) + 2px); --ff-invoice-generate-effective-row-height: var(--ff-invoice-generate-detail-row-height-final); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-grid-cell-padding-y: 0; --ff-grid-row-height: 14px; --ff-invoice-generate-grid-chrome-height: 96px; --ff-invoice-generate-detail-row-height-final: 14px; --ff-invoice-generate-detail-cell-height-final: 12px; --ff-invoice-generate-detail-row-height: var(--ff-invoice-generate-detail-row-height-final); --ff-invoice-generate-detail-cell-height: var(--ff-invoice-generate-detail-cell-height-final); --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-invoice-generate-detail-row-height-final) * var(--ff-invoice-generate-row-slots, 1)) + 2px); --ff-invoice-generate-effective-row-height: var(--ff-invoice-generate-detail-row-height-final); } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-generate-command-col) { box-sizing: border-box !important; height: var(--ff-invoice-generate-detail-row-height-final) !important; line-height: var(--ff-invoice-generate-detail-cell-height-final) !important; max-height: var(--ff-invoice-generate-detail-row-height-final) !important; min-height: var(--ff-invoice-generate-detail-row-height-final) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor):not(.ff-invoice-generate-row-actions), body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, .dx-button, .dx-button-content, .btn) { box-sizing: border-box !important; line-height: var(--ff-invoice-generate-detail-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-invoice-generate-detail-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-select, td.dx-command-edit, td.ff-invoice-generate-command-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-link, .dx-button, .dx-button-content, a) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-generate-detail-row-height-final) !important; justify-content: center !important; line-height: var(--ff-invoice-generate-detail-cell-height-final) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-detail-row-height-final) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox-icon) { height: min(14px, calc(var(--ff-invoice-generate-detail-row-height-final) - 4px)) !important; width: min(14px, calc(var(--ff-invoice-generate-detail-row-height-final) - 4px)) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox-icon) { height: 10px !important; width: 10px !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar.dx-scrollbar-horizontal, .dx-scrollbar-horizontal) { bottom: 0 !important; z-index: 4 !important; } /* Town/Hub master compact legacy lock. Keep the historic compact selector active without letting it shrink/expand grid rows. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns { --ff-grid-cell-padding-y: 0; --ff-grid-row-height: 18px; --ff-townhub-content-height: 16px; --ff-townhub-row-height: 18px; --ff-townhub-select-column-width: 32px; --ff-townhub-selector-radius: var(--ff-view-grid-row-selector-radius, 3px); --ff-townhub-selector-size: var(--ff-view-grid-row-selector-size, 14px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-content-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-texteditor), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) :is(.dx-link, .dx-button, .dx-button-content, .btn) { box-sizing: border-box !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .dx-command-select > td) { max-width: var(--ff-townhub-select-column-width) !important; min-width: var(--ff-townhub-select-column-width) !important; width: var(--ff-townhub-select-column-width) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) :is(.ff-grid-boolean-checkbox, .dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-townhub-selector-size) !important; height: var(--ff-townhub-selector-size) !important; justify-content: center !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 auto !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-command-select .dx-checkbox-icon, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox-icon { aspect-ratio: 1 / 1 !important; border-radius: var(--ff-townhub-selector-radius) !important; box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-townhub-selector-size) !important; height: var(--ff-townhub-selector-size) !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; overflow: visible !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-townhub-selector-size) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-towns :is(#gridContainer, #gridContainer1) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { font-size: calc(var(--ff-townhub-selector-size) - 2px) !important; height: auto !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: auto !important; } /* Generate Invoice detail grid final lock. Size the drill-down grid from the returned row count so short client sets such as Brima's 36 waybills are not hidden inside a half-height rowsview. */ body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-invoice-generate-detail-row-height-final: max(18px, calc(var(--ff-grid-row-height, 26px) - 4px)); --ff-invoice-generate-detail-cell-height-final: max(16px, calc(var(--ff-invoice-generate-detail-row-height-final) - 2px)); --ff-invoice-generate-grid-chrome-height: 104px; --ff-invoice-generate-detail-rows-content-height: calc((var(--ff-invoice-generate-detail-row-height-final) * var(--ff-invoice-generate-row-slots, 1)) + 2px); --ff-invoice-generate-detail-required-height: calc(var(--ff-invoice-generate-detail-rows-content-height) + var(--ff-invoice-generate-grid-chrome-height) + 8px); --ff-invoice-generate-grid-height: min(calc(100dvh - 136px), max(560px, var(--ff-invoice-generate-detail-required-height))); --ff-invoice-generate-detail-grid-height: var(--ff-invoice-generate-grid-height); --ff-invoice-generate-detail-rows-height: max(calc(var(--ff-invoice-generate-detail-row-height-final) * 3), calc(var(--ff-invoice-generate-grid-height) - var(--ff-invoice-generate-grid-chrome-height))); --ff-invoice-generate-detail-row-height: var(--ff-invoice-generate-detail-row-height-final); --ff-invoice-generate-detail-cell-height: var(--ff-invoice-generate-detail-cell-height-final); --ff-invoice-generate-effective-row-height: var(--ff-invoice-generate-detail-row-height-final); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer { --ff-grid-cell-padding-y: 0; --ff-grid-row-height: 20px; --ff-invoice-generate-detail-row-height-final: 16px; --ff-invoice-generate-detail-cell-height-final: 14px; --ff-invoice-generate-grid-chrome-height: 96px; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer.dx-datagrid, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid { height: var(--ff-invoice-generate-detail-grid-height) !important; max-height: var(--ff-invoice-generate-detail-grid-height) !important; min-height: var(--ff-invoice-generate-detail-grid-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-invoice-generate-detail-rows-height) !important; max-height: var(--ff-invoice-generate-detail-rows-height) !important; min-height: var(--ff-invoice-generate-detail-rows-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-invoice-generate-detail-rows-content-height)) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-data-row, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-invoice-generate-detail-row-height-final) !important; line-height: var(--ff-invoice-generate-detail-cell-height-final) !important; max-height: var(--ff-invoice-generate-detail-row-height-final) !important; min-height: var(--ff-invoice-generate-detail-row-height-final) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > .dx-template-wrapper, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > .dx-datagrid-text-content, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > .ff-grid-boolean-checkbox, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > span, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > a, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > button, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > img, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > .label, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td > .badge, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row .dx-button, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row .dx-button-content, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-waybill-grid #waybillGridContainer .dx-datagrid-rowsview .dx-data-row .btn { box-sizing: border-box !important; line-height: var(--ff-invoice-generate-detail-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-invoice-generate-detail-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } /* Generate Invoice summary short-result lock. Keep totals and pager directly under the visible client rows instead of forcing the summary rowsview to a large empty viewport. */ body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer { --ff-invoice-generate-summary-row-height: var(--ff-grid-row-height, 26px); --ff-invoice-generate-summary-rows-cushion: calc(var(--ff-invoice-generate-summary-row-height) + 4px); --ff-invoice-generate-summary-rows-content-height: calc((var(--ff-invoice-generate-summary-row-height) * var(--ff-invoice-generate-row-slots, 1)) + var(--ff-invoice-generate-summary-rows-cushion)); --ff-invoice-generate-summary-grid-chrome-height: 160px; --ff-invoice-generate-summary-grid-height: min(calc(100dvh - 188px), max(220px, calc(var(--ff-invoice-generate-summary-rows-content-height) + var(--ff-invoice-generate-summary-grid-chrome-height)))); --ff-invoice-generate-summary-rows-height: max(var(--ff-invoice-generate-summary-row-height), min(var(--ff-invoice-generate-summary-rows-content-height), calc(var(--ff-invoice-generate-summary-grid-height) - var(--ff-invoice-generate-summary-grid-chrome-height)))); --ff-invoice-generate-grid-height: var(--ff-invoice-generate-summary-grid-height); --ff-invoice-generate-detail-rows-height: var(--ff-invoice-generate-summary-rows-height); --ff-invoice-generate-detail-rows-content-height: var(--ff-invoice-generate-summary-rows-content-height); height: var(--ff-invoice-generate-summary-grid-height) !important; max-height: var(--ff-invoice-generate-summary-grid-height) !important; min-height: var(--ff-invoice-generate-summary-grid-height) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer { --ff-invoice-generate-summary-rows-cushion: calc(var(--ff-invoice-generate-summary-row-height) + 4px); --ff-invoice-generate-summary-grid-chrome-height: 146px; --ff-invoice-generate-summary-grid-height: min(calc(100dvh - 172px), max(204px, calc(var(--ff-invoice-generate-summary-rows-content-height) + var(--ff-invoice-generate-summary-grid-chrome-height)))); } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer.dx-datagrid, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid { height: var(--ff-invoice-generate-summary-grid-height) !important; max-height: var(--ff-invoice-generate-summary-grid-height) !important; min-height: var(--ff-invoice-generate-summary-grid-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-invoice-generate-detail-rows-height) !important; max-height: var(--ff-invoice-generate-detail-rows-height) !important; min-height: var(--ff-invoice-generate-detail-rows-height) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page .ff-invoice-generate-client-grid #clientGridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-invoice-generate-summary-rows-content-height)) !important; } /* Generate Invoice command column guard. Keep the drill-down eye compact without changing the accepted grid heights. */ body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-command-width: 34px; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-edit, td.ff-invoice-generate-command-col, .ff-invoice-generate-command-col) { box-sizing: border-box !important; max-width: var(--ff-invoice-generate-command-width) !important; min-width: var(--ff-invoice-generate-command-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-invoice-generate-command-width) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) col:nth-child(2) { max-width: var(--ff-invoice-generate-command-width) !important; min-width: var(--ff-invoice-generate-command-width) !important; width: var(--ff-invoice-generate-command-width) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Generate Invoice resize/filter guard. Widget-mode resizing creates horizontal overflow; keep the filter row clickable and prevent DevExtreme spacer rows from becoming a visible blank band. */ body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers { position: relative !important; z-index: 5 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview { position: relative !important; z-index: 1 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-width: none !important; min-width: var(--ff-invoice-generate-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-invoice-generate-horizontal-width, auto) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row > td, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-tracker, .dx-datagrid-columns-separator) { pointer-events: auto !important; z-index: 20 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .ff-invoice-generate-drill-btn, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .ff-invoice-generate-drill-btn:hover, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .ff-invoice-generate-drill-btn:focus { background: transparent !important; border: 0 !important; color: var(--ff-primary, #367bf5) !important; cursor: pointer !important; display: inline-flex !important; justify-content: center !important; outline: none !important; pointer-events: auto !important; text-decoration: none !important; width: var(--ff-view-grid-action-icon-size, 16px) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(td.dx-command-edit, td.ff-invoice-generate-command-col) :is(.dx-link, a, button), body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(td.dx-command-edit, td.ff-invoice-generate-command-col) :is(.dx-link, a, button):hover, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(td.dx-command-edit, td.ff-invoice-generate-command-col) :is(.dx-link, a, button):focus { background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--ff-primary, #367bf5) !important; display: inline-flex !important; height: var(--ff-view-grid-action-icon-size, 16px) !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: var(--ff-view-grid-action-icon-size, 16px) !important; max-width: var(--ff-view-grid-action-icon-size, 16px) !important; min-height: 0 !important; min-width: 0 !important; outline: none !important; overflow: visible !important; padding: 0 !important; text-decoration: none !important; width: var(--ff-view-grid-action-icon-size, 16px) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .ff-invoice-generate-drill-btn .fa { pointer-events: none !important; text-decoration: none !important; } /* Disabled: drilled-client row highlight made drill-down less reliable. body.ff-app .ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid-rowsview .dx-data-row.ff-invoice-generate-drilled-client-row > td, body.ff-app .ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid-rowsview .dx-data-row.ff-invoice-generate-drilled-client-row.dx-selection > td { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid-rowsview .dx-data-row.ff-invoice-generate-drilled-client-row.dx-row-alt > td { background-color: var(--surface-2) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page #clientGridContainer .dx-datagrid-rowsview .dx-data-row.ff-invoice-generate-drilled-client-row:hover > td { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } */ /* Shared view-grid viewport lock. Keep result grids inside the browser viewport and let DevExtreme own the vertical scrollbar. The lock is disabled while the filter accordion is open. */ html:has(body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid), body.ff-app:has(:is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid) { overflow-y: hidden !important; } body.ff-app:has(:is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid) #app, body.ff-app:has(:is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid) .app-content, body.ff-app:has(:is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app .main-content > .container:has(:is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments, .ff-view-tracking).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row .dx-datagrid) { overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-grid-viewport-height: clamp(260px, calc(100dvh - 260px), 1520px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-grid-viewport-height: clamp(280px, calc(100dvh - 236px), 1540px); } body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)), body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row, body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw { overflow: hidden !important; } body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #clientGridContainer, #waybillGridContainer), body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #clientGridContainer, #waybillGridContainer).dx-datagrid, body.ff-app :is(.ff-view-quotes, .ff-view-manifests, .ff-view-invoices, .ff-view-payments).ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #clientGridContainer, #waybillGridContainer) > .dx-datagrid.dx-gridbase-container { height: var(--ff-view-grid-viewport-height) !important; max-height: var(--ff-view-grid-viewport-height) !important; min-height: var(--ff-view-grid-viewport-height) !important; } /* Image Search final viewport and fixed-pane density lock. Keep this last so fixed and scrollable DevExtreme panes use identical row metrics. */ body.ff-app .ff-imaging-list { --ff-image-search-row-slots: 8; --ff-image-search-row-height-final: var(--ff-grid-row-height, 26px); --ff-image-search-cell-height-final: max(14px, calc(var(--ff-image-search-row-height-final) - 4px)); --ff-image-search-selector-size: min(14px, calc(var(--ff-image-search-row-height-final) - 6px)); --ff-image-search-grid-chrome-height: 108px; --ff-image-search-rows-content-height: calc((var(--ff-image-search-row-height-final) * var(--ff-image-search-row-slots)) + 2px); --ff-image-search-grid-height: min(calc(100dvh - 204px), max(280px, calc(var(--ff-image-search-rows-content-height) + var(--ff-image-search-grid-chrome-height)))); --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); --ff-view-images-fixed-row-height: var(--ff-image-search-row-height-final); --ff-view-images-row-height: var(--ff-image-search-row-height-final); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-image-search-cell-height-final: max(12px, calc(var(--ff-image-search-row-height-final) - 4px)); --ff-image-search-grid-chrome-height: 98px; --ff-image-search-selector-size: min(12px, calc(var(--ff-image-search-row-height-final) - 6px)); } body.ff-app[data-grid-font-size="large"] .ff-imaging-list { --ff-image-search-grid-chrome-height: 116px; --ff-image-search-selector-size: 16px; } body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fluid.container-fullw { padding-top: 0 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-filter-row:not(.ff-standard-filter-overlay-row):not(.ff-standard-filter-inline-row):not(:has(.panel-collapse.in)) { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-toolbar-row { margin-top: 0 !important; padding-top: 0 !important; } body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock > .container-fullw, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock > .container-fullw, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock .ff-grid-result-row { overflow: visible !important; } body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid { height: var(--ff-image-search-grid-height) !important; max-height: var(--ff-image-search-grid-height) !important; min-height: var(--ff-image-search-grid-height) !important; } body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-image-search-rows-content-height)) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(td.dx-command-select, td.dx-command-edit, td.ff-image-command-col) { box-sizing: border-box !important; height: var(--ff-image-search-row-height-final) !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-row-height-final) !important; min-height: var(--ff-image-search-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y, 1px) !important; padding-top: var(--ff-grid-cell-padding-y, 1px) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox, span, a, button, img, .label, .badge), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-link, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-button, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row .dx-button-content, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row .btn { box-sizing: border-box !important; line-height: var(--ff-image-search-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select { overflow: visible !important; position: relative !important; text-align: center !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-search-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-image-search-selector-size) !important; margin: 0 !important; max-height: var(--ff-image-search-selector-size) !important; max-width: var(--ff-image-search-selector-size) !important; min-height: var(--ff-image-search-selector-size) !important; min-width: var(--ff-image-search-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-image-search-selector-size) !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-icon { height: var(--ff-image-search-selector-size) !important; line-height: var(--ff-image-search-selector-size) !important; max-height: var(--ff-image-search-selector-size) !important; max-width: var(--ff-image-search-selector-size) !important; min-height: var(--ff-image-search-selector-size) !important; min-width: var(--ff-image-search-selector-size) !important; width: var(--ff-image-search-selector-size) !important; } body.ff-app .ff-imaging-list .ff-image-edit-options .form-group, body.ff-app .ff-imaging-list .ff-image-edit-options .input-icon { margin-bottom: 0 !important; } body.ff-app .ff-imaging-list .ff-grid-inline-action { font-size: 12px !important; line-height: 18px !important; min-height: 22px !important; padding: 1px 8px !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list .ff-image-edit-options-row, body.ff-app .ff-imaging-list .ff-image-edit-options-row > [class*="col-"] { display: block !important; margin: 0 !important; min-height: 70px !important; overflow: visible !important; padding: 0 !important; position: relative !important; visibility: visible !important; } body.ff-app .ff-imaging-list .ff-image-edit-options { background: var(--surface) !important; border-bottom: 1px solid var(--border) !important; display: block !important; margin: 0 0 3px !important; min-height: 66px !important; overflow: visible !important; padding: 5px 8px 6px !important; position: relative !important; visibility: visible !important; z-index: 2 !important; } body.ff-app .ff-imaging-list .ff-image-edit-options fieldset { margin: 0 !important; } body.ff-app .ff-imaging-list .ff-image-edit-options legend { font-size: 13px !important; line-height: 18px !important; margin-bottom: 4px !important; padding: 0 !important; } body.ff-app .ff-imaging-list .ff-image-edit-fields { align-items: flex-end !important; display: flex !important; flex-wrap: nowrap !important; } body.ff-app .ff-imaging-list .ff-image-edit-options .input-icon { display: block !important; } body.ff-app .ff-imaging-list .ff-image-edit-pod-date .input-icon, body.ff-app .ff-imaging-list .ff-image-edit-pod-date .form-control { max-width: 230px !important; } body.ff-app .ff-imaging-list .ff-image-edit-actions { align-items: flex-end !important; display: flex !important; gap: 6px !important; justify-content: flex-end !important; min-height: 53px !important; } body.ff-app .ff-imaging-list .ff-image-edit-actions .btn { margin-bottom: 0 !important; white-space: nowrap !important; } body.ff-app .ff-mail-field-header { align-items: center; display: flex; justify-content: space-between; gap: 8px; } body.ff-app .ff-mail-modal-header { align-items: center; display: flex; justify-content: space-between; padding-right: 44px; position: relative; } body.ff-app .ff-mail-modal-title-group { display: flex; flex-direction: column; gap: 2px; } body.ff-app .ff-mail-modal-title { align-items: baseline; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; } body.ff-app .ff-mail-modal-title-main { font-weight: 800; } body.ff-app .ff-mail-modal-help { color: var(--muted); font-size: 12px; font-weight: 400; text-transform: none; } body.ff-app .ff-mail-modal-close { font-size: 24px; line-height: 24px; margin: 0; opacity: .75; position: absolute; right: 12px; top: 8px; } body.ff-app .ff-mail-modal-close:hover, body.ff-app .ff-mail-modal-close:focus { opacity: 1; } body.ff-app .ff-mail-field-header label { margin-bottom: 4px; } body.ff-app .ff-mail-recipient-row { display: flex; flex-direction: column; gap: 6px; width: 100%; } body.ff-app .ff-mail-recipient-select { flex: 0 0 auto; min-width: 0; width: 100%; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap { height: auto !important; max-height: 112px; min-height: 64px; overflow-x: hidden; overflow-y: auto; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap.open { max-height: none !important; overflow: visible !important; z-index: 1060; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-choices, body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-choices-content, body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-dropdown, body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .dropdown-menu { max-height: min(420px, 55vh) !important; overflow-x: hidden !important; overflow-y: auto !important; width: 100% !important; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-choices-row > a { min-height: 44px !important; padding-bottom: 8px !important; padding-top: 8px !important; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-choices-row-inner small { display: block !important; line-height: 16px !important; margin-top: 2px !important; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-match { display: flex; flex-wrap: wrap; gap: 4px; width: 100%; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-match-item { height: auto; line-height: 18px; margin: 0; max-width: 100%; min-height: 26px; overflow: visible; overflow-wrap: anywhere; text-overflow: clip; text-align: left; white-space: normal; word-break: break-word; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-match-text, body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-match-text span { display: inline; max-width: 100%; overflow: visible; overflow-wrap: anywhere; text-overflow: clip; white-space: normal; word-break: break-word; } body.ff-app .ff-mail-recipient-select.ui-select-multiple.ui-select-bootstrap .ui-select-search { max-width: 100%; min-width: 220px; } body.ff-app .ff-mail-recipient-actions { align-items: center; align-self: flex-end; display: inline-flex; flex: 0 0 auto; gap: 4px; margin: 0; white-space: nowrap; } body.ff-app .ff-mail-recipient-actions .btn { min-height: var(--ff-control-h, 34px); min-width: 44px; padding-left: 10px; padding-right: 10px; } @media (max-width: 560px) { body.ff-app .ff-mail-recipient-actions { justify-content: flex-end; width: 100%; } } /* Image Search final normal-density lock. The page keeps ff-view-compact for layout, so normal/compact row height must come from body density settings only. */ body.ff-app .ff-imaging-list { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-image-search-row-height-final: var(--ff-grid-row-height); --ff-image-search-cell-height-final: max(18px, calc(var(--ff-image-search-row-height-final) - 4px)); --ff-image-search-selector-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-image-search-row-height-final: var(--ff-grid-row-height); --ff-image-search-cell-height-final: 18px; --ff-image-search-selector-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-image-search-row-height-final: var(--ff-grid-row-height); --ff-image-search-cell-height-final: 28px; --ff-image-search-selector-size: 16px; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-image-select-col, .ff-image-command-col) { box-sizing: border-box !important; height: var(--ff-image-search-row-height-final) !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-row-height-final) !important; min-height: var(--ff-image-search-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-image-select-col, .ff-image-command-col) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, a, button), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, span, a, button, img, .label, .badge) { box-sizing: border-box !important; line-height: var(--ff-image-search-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-image-command-col) :is(.dx-link, .dx-button, a, button) { align-items: center !important; display: inline-flex !important; height: var(--ff-image-search-cell-height-final) !important; justify-content: center !important; } /* Image Search filter date sizing. Keep Date Period and Date Range on the first filter row without making compact mode bulky. */ body.ff-app .ff-imaging-list .ff-image-date-row { flex-wrap: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-block { flex: 0 1 470px !important; max-width: 485px !important; min-width: 452px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-period { flex: 0 0 166px !important; max-width: 166px !important; min-width: 158px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-period-group { grid-template-columns: 64px minmax(94px, 1fr) !important; max-width: 166px !important; min-width: 158px !important; width: 166px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-period-ignore { flex: 0 0 64px !important; max-width: 64px !important; min-width: 64px !important; width: 64px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-period-ignore-label { font-size: 11px !important; padding-left: 16px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-range { flex: 0 1 288px !important; max-width: 304px !important; min-width: 270px !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-range .start-date, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list .ff-image-date-range .end-date { flex: 1 1 120px !important; max-width: 128px !important; min-width: 108px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-block { flex: 0 1 430px !important; max-width: 442px !important; min-width: 405px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period { flex: 0 0 146px !important; max-width: 146px !important; min-width: 140px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period-group { align-items: center !important; box-sizing: border-box !important; grid-template-columns: 56px minmax(84px, 1fr) !important; height: 24px !important; max-height: 24px !important; max-width: 146px !important; min-height: 24px !important; min-width: 140px !important; overflow: visible !important; width: 146px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period-ignore { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 56px !important; height: 24px !important; line-height: 1 !important; max-height: 24px !important; max-width: 56px !important; min-height: 24px !important; min-width: 56px !important; padding-bottom: 0 !important; padding-top: 0 !important; width: 56px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period-ignore-label { align-items: center !important; box-sizing: border-box !important; display: flex !important; font-size: 10px !important; height: 22px !important; line-height: 1 !important; margin: 0 !important; max-height: 22px !important; min-height: 0 !important; padding: 0 1px 0 14px !important; transform: translateY(-1px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period-select { box-sizing: border-box !important; height: 24px !important; line-height: 1.2 !important; max-height: 24px !important; min-height: 24px !important; padding-bottom: 0 !important; padding-left: 3px !important; padding-right: 3px !important; padding-top: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-period-ignore input[type="checkbox"] { height: 14px !important; margin: 0 !important; width: 14px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-range { flex: 0 1 270px !important; max-width: 286px !important; min-width: 252px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-range .start-date, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list .ff-image-date-range .end-date { flex: 1 1 112px !important; max-width: 120px !important; min-width: 104px !important; } @media (max-width: 760px) { body.ff-app .ff-imaging-list .ff-image-date-row { flex-wrap: wrap !important; } body.ff-app .ff-imaging-list .ff-image-date-block, body.ff-app .ff-imaging-list .ff-image-date-range { flex-basis: 100% !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } } /* Shared compact query-grid viewport guard. Ordinary result grids should use the browser viewport, not the legacy six-row fallback. */ html:has(body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid), body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid) { overflow-y: hidden !important; } html:has(body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in), body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in) { overflow-y: auto !important; } body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid) #app, body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid) .app-content, body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in) #app, body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in) .app-content, body.ff-app:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row .dx-datagrid) { overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .main-content > .container:has(.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .panel-collapse.in) { overflow: visible !important; } body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) { --ff-compact-query-grid-chrome-height: 112px; --ff-compact-query-grid-rows-height: max(calc(var(--ff-grid-row-height, 20px) * 8), calc(100dvh - 400px)); --ff-compact-query-grid-height: calc(var(--ff-compact-query-grid-rows-height) + var(--ff-compact-query-grid-chrome-height)); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) { --ff-compact-query-grid-chrome-height: 100px; --ff-compact-query-grid-rows-height: max(calc(var(--ff-grid-row-height, 20px) * 12), calc(100dvh - 368px)); } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) { --ff-compact-query-grid-chrome-height: 120px; --ff-compact-query-grid-rows-height: max(calc(var(--ff-grid-row-height, 20px) * 6), calc(100dvh - 420px)); } body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer), body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer).dx-datagrid, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid { height: var(--ff-compact-query-grid-height) !important; max-height: var(--ff-compact-query-grid-height) !important; min-height: var(--ff-compact-query-grid-height) !important; } body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-compact-query-grid-rows-height) !important; max-height: var(--ff-compact-query-grid-rows-height) !important; min-height: var(--ff-compact-query-grid-rows-height) !important; } body.ff-app .ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes):not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } /* Query final footer/pager lock. Query has user-created columns, so keep horizontal scroll, totals, and paging chrome visible while only the data rows consume the remaining viewport height. */ html:has(body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid), body.ff-app:has(.ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid) { overflow-y: hidden !important; } body.ff-app:has(.ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app:has(.ff-query.ff-query-grid-page:not(.ff-standard-grid-page) .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) footer.hidden-print, body.ff-app:has(.ff-query.ff-query-grid-page:not(.ff-standard-grid-page) .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) .footer-inner.ff-footer { display: none !important; } body.ff-app .main-content > .container:has(.ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid) { overflow: hidden !important; padding-bottom: 0 !important; } html:has(body.ff-app .ff-query.ff-query-grid-page .panel-collapse.in), body.ff-app:has(.ff-query.ff-query-grid-page .panel-collapse.in), body.ff-app:has(.ff-query.ff-query-grid-page .panel-collapse.in) #app, body.ff-app:has(.ff-query.ff-query-grid-page .panel-collapse.in) .app-content, body.ff-app:has(.ff-query.ff-query-grid-page .panel-collapse.in) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-query.ff-query-grid-page .panel-collapse.in) { overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide), body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) { overflow: hidden !important; } body.ff-app .ff-query.ff-query-grid-page { --ff-query-grid-height: clamp(300px, calc(100dvh - 245px), 1540px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page { --ff-query-grid-height: clamp(280px, calc(100dvh - 220px), 1540px); } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid.dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid { height: var(--ff-query-grid-height, clamp(260px, calc(100dvh - 300px), 1540px)) !important; max-height: var(--ff-query-grid-height, clamp(260px, calc(100dvh - 300px), 1540px)) !important; min-height: var(--ff-query-grid-height, clamp(260px, calc(100dvh - 300px), 1540px)) !important; overflow: hidden !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-filter-row, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-filter-row > td, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview { position: relative !important; z-index: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-query-grid-rows-height, max(80px, calc(var(--ff-query-grid-height, 420px) - 156px))) !important; max-height: var(--ff-query-grid-rows-height, max(80px, calc(var(--ff-query-grid-height, 420px) - 156px))) !important; min-height: var(--ff-query-grid-rows-height, max(80px, calc(var(--ff-query-grid-height, 420px) - 156px))) !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-scrollable-scrollbar, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: block !important; flex: 0 0 auto !important; position: relative !important; visibility: visible !important; z-index: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer .dx-datagrid-content, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer .dx-datagrid-table, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-query-footer-row-height, 30px) !important; line-height: calc(var(--ff-query-footer-row-height, 30px) - 8px) !important; max-height: var(--ff-query-footer-row-height, 30px) !important; min-height: var(--ff-query-footer-row-height, 30px) !important; overflow: hidden !important; vertical-align: middle !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; height: calc(var(--ff-query-footer-row-height, 30px) - 8px) !important; line-height: calc(var(--ff-query-footer-row-height, 30px) - 8px) !important; max-height: calc(var(--ff-query-footer-row-height, 30px) - 8px) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-query-pager-height, 42px) !important; line-height: var(--ff-query-pager-inner-height, 30px) !important; max-height: var(--ff-query-pager-height, 42px) !important; min-height: var(--ff-query-pager-height, 42px) !important; overflow: visible !important; padding: 4px 6px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager * { overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-pager-inner-height, 30px) !important; line-height: var(--ff-query-pager-inner-height, 30px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: var(--ff-query-pager-inner-height, 30px) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-query-pager-inner-height, 30px) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-query-pager-inner-height, 30px) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: calc(var(--ff-query-pager-inner-height, 30px) - 2px) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager .dx-info { line-height: var(--ff-query-pager-inner-height, 30px) !important; max-width: none !important; min-width: max-content !important; text-overflow: clip !important; white-space: nowrap !important; } /* Query normal pager hard-stop. Keep this independent of the runtime viewport-grid class because the shared ff-query-grid-page pager rules are much shorter and can clip normal mode. */ body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; bottom: auto !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 var(--ff-query-pager-height, 50px) !important; height: var(--ff-query-pager-height, 50px) !important; justify-content: flex-end !important; line-height: var(--ff-query-pager-inner-height, 38px) !important; margin: 0 !important; max-height: var(--ff-query-pager-height, 50px) !important; min-height: var(--ff-query-pager-height, 50px) !important; overflow: visible !important; padding: 4px 8px !important; position: relative !important; top: auto !important; transform: none !important; visibility: visible !important; z-index: 4 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-pager, body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-pager * { overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; align-self: center !important; bottom: auto !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-pager-inner-height, 38px) !important; line-height: var(--ff-query-pager-inner-height, 38px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: var(--ff-query-pager-inner-height, 38px) !important; padding-bottom: 0 !important; padding-top: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; bottom: auto !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-query-pager-inner-height, 38px) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-query-pager-inner-height, 38px) - 4px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: calc(var(--ff-query-pager-inner-height, 38px) - 4px) !important; padding-bottom: 0 !important; padding-top: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-pager .dx-info { line-height: var(--ff-query-pager-inner-height, 38px) !important; max-width: none !important; min-width: max-content !important; text-overflow: clip !important; white-space: nowrap !important; } /* View Invoices final rowsview recovery. This mirrors the Generate Invoice fix: when DevExtreme has data and totals but the rows pane measures at zero, force a real grid/rowsview height regardless of the filter accordion's internal open/closed class. */ body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 154px; --ff-view-invoices-total-footer-height: 30px; --ff-view-invoices-pager-height: 36px; --ff-view-invoices-pager-inner-height: 28px; --ff-view-invoices-row-height-effective: var(--ff-view-invoices-row-height, var(--ff-grid-row-height, 26px)); --ff-view-invoices-rows-cushion: calc(var(--ff-view-invoices-row-height-effective) + 4px); --ff-view-invoices-rows-content-height: calc((var(--ff-view-invoices-row-height-effective) * var(--ff-view-invoices-row-slots, 1)) + var(--ff-view-invoices-rows-cushion)); --ff-view-invoices-grid-height-final: min(var(--ff-view-invoices-available-grid-height, calc(100dvh - 288px)), max(204px, calc(var(--ff-view-invoices-rows-content-height) + var(--ff-view-invoices-grid-chrome-height)))); --ff-view-invoices-rows-height-final: max(var(--ff-view-invoices-row-height-effective), min(var(--ff-view-invoices-rows-content-height), calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height)))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 132px; --ff-view-invoices-total-footer-height: 28px; --ff-view-invoices-pager-height: 34px; --ff-view-invoices-pager-inner-height: 26px; --ff-view-invoices-rows-cushion: calc(var(--ff-view-invoices-row-height-effective) + 4px); --ff-view-invoices-grid-height-final: min(var(--ff-view-invoices-available-grid-height, calc(100dvh - 256px)), max(190px, calc(var(--ff-view-invoices-rows-content-height) + var(--ff-view-invoices-grid-chrome-height)))); } html:has(body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) #app, body.ff-app:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) .app-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) .main-content { overflow-x: hidden !important; overflow-y: hidden !important; } body.ff-app:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) #app > footer { display: none !important; } body.ff-app .main-content > .container:has(.ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) { overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)), body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row { overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview { position: relative !important; z-index: 1 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row > td, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid { height: var(--ff-view-invoices-grid-height-final) !important; max-height: var(--ff-view-invoices-grid-height-final) !important; min-height: var(--ff-view-invoices-grid-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-view-invoices-rows-content-height)) !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-invoices-horizontal-width, auto) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-width: none !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-invoices-horizontal-width, auto) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #waybillGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-scrollable-scrollbar, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { min-height: 12px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: block !important; flex: 0 0 auto !important; overflow: visible !important; position: relative !important; z-index: 1 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer .dx-datagrid-content, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer .dx-datagrid-table, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer .dx-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; height: var(--ff-view-invoices-total-footer-height) !important; line-height: calc(var(--ff-view-invoices-total-footer-height) - 8px) !important; max-height: var(--ff-view-invoices-total-footer-height) !important; min-height: var(--ff-view-invoices-total-footer-height) !important; overflow: hidden !important; vertical-align: middle !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; height: calc(var(--ff-view-invoices-total-footer-height) - 8px) !important; line-height: calc(var(--ff-view-invoices-total-footer-height) - 8px) !important; max-height: calc(var(--ff-view-invoices-total-footer-height) - 8px) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager) { min-height: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-pager { box-sizing: border-box !important; height: var(--ff-view-invoices-pager-height) !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; max-height: var(--ff-view-invoices-pager-height) !important; min-height: var(--ff-view-invoices-pager-height) !important; overflow: visible !important; padding-bottom: 3px !important; padding-top: 2px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info, .dx-page, .dx-page-size), body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer) #pageInfoBadge { align-items: center !important; display: inline-flex !important; height: var(--ff-view-invoices-pager-inner-height) !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-view-invoices-pager-inner-height) !important; overflow: visible !important; vertical-align: middle !important; } /* View Invoices page-only final layout guard. */ body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fluid.container-fullw { padding-top: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .accordion-no-display, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .accordion-no-display .panel, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .accordion-no-display .panel-body { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-toolbar-row { margin-top: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-toolbar-row > .ff-grid-toolbar-inner { min-height: 0 !important; padding-bottom: 3px !important; padding-top: 2px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 162px; --ff-view-invoices-pager-height: 52px; --ff-view-invoices-pager-inner-height: 38px; --ff-view-invoices-grid-height-final: clamp(870px, max(var(--ff-view-invoices-available-grid-height, 0px), calc(100dvh + 180px)), 4200px); --ff-view-invoices-rows-height-final: max(220px, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 140px; --ff-view-invoices-pager-height: 48px; --ff-view-invoices-pager-inner-height: 36px; --ff-view-invoices-grid-height-final: clamp(1650px, max(var(--ff-view-invoices-available-grid-height, 0px), calc(100dvh + 900px)), 4200px); --ff-view-invoices-rows-height-final: max(240px, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height))); } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) :is(.dx-command-select, .dx-datagrid-headers .dx-command-select, .dx-datagrid-rowsview .dx-command-select) { box-sizing: border-box !important; max-width: 34px !important; min-width: 34px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 34px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer:not(.ff-grid-empty) :is(.ff-invoice-view-command-col, .dx-command-edit) { box-sizing: border-box !important; max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer:not(.ff-grid-empty) .dx-datagrid-headers .dx-datagrid-text-content { padding-left: 3px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; justify-content: flex-end !important; min-height: var(--ff-view-invoices-pager-height) !important; min-width: 0 !important; overflow: visible !important; padding: 4px 12px !important; width: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page-sizes, .dx-info, .dx-pages) { align-items: center !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; justify-content: flex-start !important; margin: 0 !important; max-width: none !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-page-sizes { order: 1 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-info { color: #777 !important; order: 2 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-pages { order: 3 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-invoices-pager-inner-height) !important; justify-content: center !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-view-invoices-pager-inner-height) !important; min-height: var(--ff-view-invoices-pager-inner-height) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page-sizes, .dx-info, .dx-pages) { align-self: center !important; height: var(--ff-view-invoices-pager-inner-height) !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; max-height: var(--ff-view-invoices-pager-inner-height) !important; min-height: var(--ff-view-invoices-pager-inner-height) !important; vertical-align: middle !important; } /* Image Search final fixed/scrollable row sync. Keep this at the end so normal density cannot inherit a different height in one DevExtreme pane. */ body.ff-app .ff-imaging-list { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-image-search-row-height-final: 26px; --ff-image-search-cell-height-final: 22px; --ff-image-search-selector-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list, body.ff-app[data-grid-font-size="small"] .ff-imaging-list { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-image-search-row-height-final: 20px; --ff-image-search-cell-height-final: 18px; --ff-image-search-selector-size: 14px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list { --ff-grid-row-height: 32px; --ff-grid-cell-padding-y: 2px; --ff-image-search-row-height-final: 32px; --ff-image-search-cell-height-final: 28px; --ff-image-search-selector-size: 16px; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-datagrid-table-fixed { border-collapse: collapse !important; table-layout: fixed !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; display: table-row !important; height: var(--ff-image-search-row-height-final) !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-row-height-final) !important; min-height: var(--ff-image-search-row-height-final) !important; visibility: visible !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-image-search-row-height-final) !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-row-height-final) !important; min-height: var(--ff-image-search-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-data-row > td > *, body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) .dx-data-row :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, a, button, img, span, .label, .badge) { box-sizing: border-box !important; line-height: var(--ff-image-search-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(td.dx-command-select, td.dx-command-edit, td.ff-image-command-col) :is(.dx-link, .dx-button, a, button) { align-items: center !important; display: inline-flex !important; height: var(--ff-image-search-cell-height-final) !important; justify-content: center !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select { overflow: visible !important; position: relative !important; text-align: center !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-search-selector-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-image-search-selector-size) !important; margin: 0 !important; max-height: var(--ff-image-search-selector-size) !important; max-width: var(--ff-image-search-selector-size) !important; min-height: var(--ff-image-search-selector-size) !important; min-width: var(--ff-image-search-selector-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-image-search-selector-size) !important; } body.ff-app .ff-imaging-list #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-icon { height: var(--ff-image-search-selector-size) !important; line-height: var(--ff-image-search-selector-size) !important; max-height: var(--ff-image-search-selector-size) !important; max-width: var(--ff-image-search-selector-size) !important; min-height: var(--ff-image-search-selector-size) !important; min-width: var(--ff-image-search-selector-size) !important; width: var(--ff-image-search-selector-size) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Image Search final content clamp. Fixed and scrollable panes render separate tables, so every row template must fit the same height. */ body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td { box-sizing: border-box !important; height: var(--ff-image-search-row-height-final) !important; line-height: var(--ff-image-search-cell-height-final) !important; max-height: var(--ff-image-search-row-height-final) !important; min-height: var(--ff-image-search-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-image-link-col, a, button, span, .label, .badge) { box-sizing: border-box !important; line-height: var(--ff-image-search-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-select, td.dx-command-edit, td.ff-image-command-col, td.ff-image-select-col) { overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container, .dx-checkbox-icon) { box-sizing: border-box !important; height: var(--ff-image-search-selector-size) !important; line-height: var(--ff-image-search-selector-size) !important; margin: 0 !important; max-height: var(--ff-image-search-selector-size) !important; max-width: var(--ff-image-search-selector-size) !important; min-height: var(--ff-image-search-selector-size) !important; min-width: var(--ff-image-search-selector-size) !important; padding: 0 !important; width: var(--ff-image-search-selector-size) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } body.ff-app .ff-imaging-list #gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td.dx-command-edit, td.ff-image-command-col) :is(.dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, a, button) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-search-cell-height-final) !important; justify-content: center !important; line-height: var(--ff-image-search-cell-height-final) !important; margin: 0 !important; max-height: var(--ff-image-search-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; vertical-align: middle !important; } /* View Credits/Debits measured viewport guard. The controller measures the grid's real top edge; DevExtreme owns the rows viewport so totals and pager stay inside the fixed grid box. */ body.ff-app .ff-view-crdr.ff-query-grid-page #gridContainer.ff-crdr-viewport-grid { --ff-view-crdr-grid-chrome-height: 112px; --ff-view-crdr-row-height-effective: var(--ff-grid-row-height, 26px); --ff-view-crdr-rows-cushion: calc(var(--ff-view-crdr-row-height-effective) + 4px); --ff-view-crdr-rows-content-height: calc((var(--ff-view-crdr-row-height-effective) * var(--ff-view-crdr-row-slots, 1)) + var(--ff-view-crdr-rows-cushion)); --ff-view-crdr-grid-height-final: min(var(--ff-view-crdr-grid-height, clamp(320px, calc(100dvh - 204px), 1520px)), max(220px, calc(var(--ff-view-crdr-rows-content-height) + var(--ff-view-crdr-grid-chrome-height)))); --ff-view-crdr-rows-height-final: max(var(--ff-view-crdr-row-height-effective), min(var(--ff-view-crdr-rows-content-height), calc(var(--ff-view-crdr-grid-height-final) - var(--ff-view-crdr-grid-chrome-height)))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-crdr.ff-query-grid-page #gridContainer.ff-crdr-viewport-grid { --ff-view-crdr-grid-chrome-height: 102px; --ff-view-crdr-rows-cushion: calc(var(--ff-view-crdr-row-height-effective) + 4px); } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr.ff-query-grid-page #gridContainer.ff-crdr-viewport-grid { --ff-view-crdr-grid-chrome-height: 124px; } html:has(body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid), body.ff-app:has(.ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid), body.ff-app:has(.ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid) #app, body.ff-app:has(.ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid) .app-content, body.ff-app:has(.ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid) .main-content { overflow-y: hidden !important; } body.ff-app .main-content > .container:has(.ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid) { overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)), body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fluid.container-fullw, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide), body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fluid.container-fullw, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) { overflow: hidden !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid.dx-datagrid, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid { height: var(--ff-view-crdr-grid-height-final) !important; max-height: var(--ff-view-crdr-grid-height-final) !important; min-height: var(--ff-view-crdr-grid-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-crdr-rows-height-final) !important; max-height: var(--ff-view-crdr-rows-height-final) !important; min-height: var(--ff-view-crdr-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-view-crdr-rows-content-height)) !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-vertical, .dx-scrollbar-vertical) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-horizontal, .dx-scrollbar-horizontal) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-crdr.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-crdr-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; position: relative !important; z-index: 1 !important; } /* View Collections final toolbar/action lock. Keep export and column chooser compact without touching column density. */ body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-actions-host .ff-grid-actions { gap: 2px !important; } body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-actions-host .ff-grid-action-btn { gap: 0 !important; min-width: 26px !important; padding-left: 0 !important; padding-right: 0 !important; width: 26px !important; } body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-actions-host .ff-grid-export .ff-grid-action-btn { min-width: 30px !important; width: 30px !important; } body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-actions-host .ff-grid-action-btn span:not(.caret) { display: none !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button) { min-width: 28px !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; width: 28px !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button) .dx-button-content { justify-content: center !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button) .dx-button-text { display: none !important; } /* View Collections viewport grid recovery. DevExtreme owns the rows pane height; the shell should not add a second page scroll. */ html:has(body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid .dx-datagrid), body.ff-app:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid .dx-datagrid), body.ff-app:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid .dx-datagrid) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid), body.ff-app .ff-view-collections.ff-query-grid-page, body.ff-app .ff-view-collections.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-collections.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-collections.ff-query-grid-page .ff-collection-body, body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { min-height: 0 !important; } body.ff-app .main-content > .container:has(.ff-view-collections.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-collections-viewport-grid), body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-collections-viewport-grid, body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-collections-viewport-grid.dx-datagrid, body.ff-app .ff-view-collections.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-collections-viewport-grid .dx-datagrid { --ff-view-collections-row-height-effective: var(--ff-grid-row-height, 26px); --ff-view-collections-row-slots-final: var(--ff-view-collections-row-slots, 50); --ff-view-collections-scrollbar-size: 14px; --ff-view-collections-rows-height-final: var(--ff-view-collections-rows-height, max(calc(var(--ff-view-collections-row-height-effective) * 4), calc(var(--ff-view-collections-grid-height, 420px) - 132px))); --ff-view-collections-rows-content-height: max(100%, calc(var(--ff-view-collections-row-height-effective) * var(--ff-view-collections-row-slots-final))); height: var(--ff-view-collections-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; max-height: var(--ff-view-collections-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; min-height: var(--ff-view-collections-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; overflow: hidden !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-collections-rows-height-final) !important; max-height: var(--ff-view-collections-rows-height-final) !important; min-height: var(--ff-view-collections-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow: hidden !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { box-sizing: border-box !important; height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-view-collections-rows-content-height)) !important; min-width: var(--ff-view-collections-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-collections-horizontal-width, auto) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-height: none !important; max-width: none !important; min-width: var(--ff-view-collections-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-collections-horizontal-width, auto) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-vertical, .dx-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal, .dx-scrollbar-horizontal) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-horizontal, .dx-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-view-collections-scrollbar-size) !important; left: 0 !important; min-height: var(--ff-view-collections-scrollbar-size) !important; right: var(--ff-view-collections-scrollbar-size) !important; z-index: 4 !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-vertical, .dx-scrollbar-vertical) { min-width: var(--ff-view-collections-scrollbar-size) !important; right: 0 !important; width: var(--ff-view-collections-scrollbar-size) !important; z-index: 4 !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; position: relative !important; z-index: 1 !important; } /* View Waybills compact row compression. Keep compact font, selector checkbox, and action icon sizing unchanged. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-waybills, body.ff-app .ff-view-waybills.ff-view-waybills-compact { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; } /* Compact grid dropdown placeholder alignment. DevExtreme keeps larger default placeholder padding in select/dropdown editors. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-page .dx-datagrid :is(.dx-datagrid-filter-row, .dx-editor-cell) :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder { align-items: center !important; display: flex !important; height: 100% !important; line-height: 1 !important; top: 0 !important; transform: none !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-page .dx-datagrid :is(.dx-datagrid-filter-row, .dx-editor-cell) :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder::before { display: block !important; line-height: 1 !important; padding: 0 9px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-page .dx-datagrid :is(.dx-datagrid-filter-row, .dx-editor-cell) :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder::after { display: none !important; } /* Grid filter rows: remove the operation/magnifying-glass chooser from view fields. The chooser steals typing space; date picker and dropdown arrows remain visible. */ body.ff-app .ff-page .dx-datagrid .dx-datagrid-filter-row :is(.dx-menu, .dx-icon-search, [class*="dx-icon-filter-operation"]) { display: none !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; width: 0 !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-filter-row :is(.dx-editor-cell, .dx-editor-cell .dx-editor-container) { padding-left: 3px !important; } body.ff-app .ff-page .dx-datagrid .dx-datagrid-filter-row .dx-texteditor-input { padding-left: 6px !important; } /* Debriefing row visibility recovery. Match the View Collections recovery: keep the grid auto-height and stop shell containers from clipping rendered rows. */ html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) .main-content { overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app .ff-debriefing.ff-query-grid-page, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row #gridContainer, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-debriefing-viewport-grid, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row #gridContainer.dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } /* Debriefing final page-fit rows recovery. The controller only changes page size and row-slot variables; DevExtreme owns row rendering. */ body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid { --ff-debriefing-row-height-effective: var(--ff-debriefing-row-height, var(--ff-grid-row-height, 26px)); --ff-debriefing-scrollbar-reserve: 24px; --ff-debriefing-data-rows-height: calc((var(--ff-debriefing-row-height-effective) * var(--ff-debriefing-row-slots, 1)) + 2px); --ff-debriefing-rows-content-height: calc(var(--ff-debriefing-data-rows-height) + var(--ff-debriefing-scrollbar-reserve)); --ff-debriefing-rows-viewport-height: var(--ff-debriefing-rows-content-height); --ff-debriefing-grid-height-fit: calc(var(--ff-debriefing-rows-viewport-height) + 132px); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid { --ff-debriefing-grid-height-fit: calc(var(--ff-debriefing-rows-viewport-height) + 120px); } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid.dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid { height: auto !important; max-height: none !important; min-height: var(--ff-debriefing-grid-height-fit) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-debriefing-rows-viewport-height) !important; max-height: var(--ff-debriefing-rows-viewport-height) !important; min-height: var(--ff-debriefing-rows-viewport-height) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-wrapper { overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-container { box-sizing: border-box !important; overflow-x: auto !important; overflow-y: auto !important; padding-bottom: 0 !important; scrollbar-gutter: stable !important; scrollbar-color: rgba(88, 103, 118, .42) transparent !important; scrollbar-width: thin !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-content { box-sizing: border-box !important; height: auto !important; max-height: none !important; min-height: var(--ff-debriefing-data-rows-height) !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-datagrid-table { margin-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-horizontal, .dx-scrollbar-horizontal) { bottom: 0 !important; display: block !important; opacity: .45 !important; visibility: visible !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar { height: 14px !important; width: 14px !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-track { background: transparent !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-thumb { background-clip: content-box !important; background-color: rgba(88, 103, 118, .42) !important; border: 3px solid transparent !important; border-radius: 8px !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-data-row { display: table-row !important; visibility: visible !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-data-row > td, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid-rowsview .dx-data-row > tr > td { display: table-cell !important; visibility: visible !important; } html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid) { overflow: hidden !important; padding-bottom: 0 !important; } /* Debriefing viewport grid and filter-row focus recovery. The controller measures the visible viewport; DevExtreme owns the rows pane and pager. */ html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid) { overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide), body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) > [class*="col-"] { min-height: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide), body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) > [class*="col-"] { margin-bottom: 0 !important; overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid.dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid { height: var(--ff-debriefing-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; max-height: var(--ff-debriefing-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; min-height: var(--ff-debriefing-grid-height, clamp(260px, calc(100dvh - 300px), 1520px)) !important; overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row > td, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row :is(.dx-menu, .dx-icon-search, .dx-icon-filter-operation-default, .dx-icon-filter-operation-contains, .dx-icon-filter-operation-startswith, .dx-icon-filter-operation-equals) { display: none !important; pointer-events: none !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row :is(.dx-editor-cell, .dx-editor-cell .dx-editor-container) { padding-left: 3px !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-filter-row .dx-texteditor-input { padding-left: 6px !important; padding-right: 6px !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview { min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-vertical, .dx-scrollbar-vertical) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; min-height: 28px !important; overflow: visible !important; position: relative !important; z-index: 1 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-viewport-grid .dx-pager :is(.dx-pages, .dx-page-sizes, .dx-info) { align-items: center !important; min-height: 24px !important; } /* Debriefing filter-row focus recovery for the auto-height/page-fit grid path. */ body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-filter-row > td, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-filter-row :is(.dx-menu, .dx-icon-search, .dx-icon-filter-operation-default, .dx-icon-filter-operation-contains, .dx-icon-filter-operation-startswith, .dx-icon-filter-operation-equals) { display: none !important; pointer-events: none !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-filter-row .dx-texteditor-input { padding-left: 6px !important; padding-right: 6px !important; } /* View Manifests final viewport recovery. The page hides the browser scrollbar once results are visible, so keep the grid itself inside the viewport and reserve room for totals and paging. */ body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-manifests-grid-height-final: clamp(420px, calc(100dvh - 190px), 1520px); --ff-view-manifests-grid-chrome-height: 188px; --ff-view-manifests-rows-height-final: max(calc(var(--ff-grid-row-height, 26px) * 8), calc(var(--ff-view-manifests-grid-height-final) - var(--ff-view-manifests-grid-chrome-height))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-manifests-grid-height-final: clamp(444px, calc(100dvh - 224px + (var(--ff-grid-row-height, 16px) * 4)), 1540px); --ff-view-manifests-grid-chrome-height: 124px; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid), body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid).dx-datagrid, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid { height: var(--ff-view-manifests-grid-height-final) !important; max-height: var(--ff-view-manifests-grid-height-final) !important; min-height: var(--ff-view-manifests-grid-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-manifests-rows-height-final) !important; max-height: var(--ff-view-manifests-rows-height-final) !important; min-height: var(--ff-view-manifests-rows-height-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; overflow: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-width: none !important; overflow: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) .dx-datagrid-rowsview :is(.dx-scrollable-scrollbar-vertical, .dx-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal, .dx-scrollbar-horizontal) { display: block !important; opacity: 1 !important; visibility: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-manifest-view-viewport-grid) :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: block !important; visibility: visible !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests { --ff-view-manifests-row-height-normal: max(26px, var(--ff-grid-row-height, 26px)); --ff-view-manifests-cell-height-normal: calc(var(--ff-view-manifests-row-height-normal) - 2px); --ff-view-manifests-row-height: var(--ff-view-manifests-row-height-normal); --ff-view-manifests-fixed-row-height: var(--ff-view-manifests-row-height-normal); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height-normal) !important; line-height: var(--ff-view-manifests-cell-height-normal) !important; max-height: var(--ff-view-manifests-row-height-normal) !important; min-height: var(--ff-view-manifests-row-height-normal) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y, 1px) !important; padding-top: var(--ff-grid-cell-padding-y, 1px) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, span, a, button, .btn, .label) { box-sizing: border-box !important; line-height: var(--ff-view-manifests-cell-height-normal) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-view-manifests-cell-height-normal) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { top: 50% !important; } /* View Payments fixed selector pane parity. The native selector column is rendered in its own fixed table, so it needs the same row contract as the scrollable table or the bottom checkboxes vanish. */ body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer { --ff-view-payments-selector-size: min(16px, calc(var(--ff-grid-row-height, 26px) - 4px)); } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table-fixed { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-grid-row-height, 26px) !important; line-height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; max-height: var(--ff-grid-row-height, 26px) !important; min-height: var(--ff-grid-row-height, 26px) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, a, button, span, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; max-height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; min-height: 0 !important; overflow: hidden !important; vertical-align: middle !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-headers td.dx-command-select, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-filter-row td.dx-command-select, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-command-select { box-sizing: border-box !important; max-width: 28px !important; min-width: 28px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 28px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container), body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-headers td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-payments-selector-size) !important; justify-content: center !important; left: auto !important; margin: 0 auto !important; max-height: var(--ff-view-payments-selector-size) !important; max-width: var(--ff-view-payments-selector-size) !important; min-height: var(--ff-view-payments-selector-size) !important; min-width: var(--ff-view-payments-selector-size) !important; opacity: 1 !important; position: relative !important; top: auto !important; transform: none !important; visibility: visible !important; width: var(--ff-view-payments-selector-size) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-command-select .dx-checkbox-icon, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-headers td.dx-command-select .dx-checkbox-icon { box-sizing: border-box !important; display: block !important; height: var(--ff-view-payments-selector-size) !important; line-height: var(--ff-view-payments-selector-size) !important; margin: 0 !important; max-height: var(--ff-view-payments-selector-size) !important; max-width: var(--ff-view-payments-selector-size) !important; min-height: var(--ff-view-payments-selector-size) !important; min-width: var(--ff-view-payments-selector-size) !important; opacity: 1 !important; visibility: visible !important; width: var(--ff-view-payments-selector-size) !important; } /* View Tracking final scrollbar/focus nudge. Keep this small: the controller owns height, while this keeps filter editors above the rows pane. */ body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid-rowsview { position: relative !important; z-index: 1 !important; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid-filter-row > td, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } /* Image Search final footer visibility. Keep this after the row-height lock so normal and compact modes reserve room for the horizontal scrollbar and pager inside the visible grid box. */ body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(300px, calc(var(--ff-image-search-measured-grid-height, calc(100dvh - 292px)) - 8px), 1520px); --ff-image-search-grid-chrome-height: 206px; --ff-image-search-pager-height: 42px; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 26px)) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(300px, var(--ff-image-search-measured-grid-height, calc(100dvh - 214px)), 1540px); --ff-image-search-grid-chrome-height: 126px; --ff-image-search-pager-height: 34px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(320px, calc(var(--ff-image-search-measured-grid-height, calc(100dvh - 318px)) - 10px), 1520px); --ff-image-search-grid-chrome-height: 232px; --ff-image-search-pager-height: 44px; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid { height: var(--ff-image-search-grid-height) !important; max-height: var(--ff-image-search-grid-height) !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; position: relative !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; position: relative !important; visibility: visible !important; z-index: 2 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: block !important; flex: 0 0 auto !important; height: var(--ff-image-search-pager-height) !important; min-height: var(--ff-image-search-pager-height) !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 1 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { min-height: var(--ff-image-search-pager-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info, .dx-page, .dx-page-size, .dx-navigate-button) { line-height: 28px !important; max-height: none !important; min-height: 28px !important; overflow: visible !important; } /* Tariffs final filter/pager interaction guard. The controller now pages returned tariff rows; keep the header filter editors clickable and collapse DevExtreme filler rows so they cannot block menus after binding. */ body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-headers { overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { position: relative !important; z-index: 1 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-filter-row > td, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-editor-container, .dx-selectbox, .dx-dropdowneditor, .dx-dropdowneditor-button, input) { pointer-events: auto !important; position: relative !important; z-index: 6 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; min-height: 34px !important; overflow: visible !important; padding: 2px 6px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { min-height: 28px !important; padding-bottom: 1px !important; padding-top: 1px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 30px !important; line-height: 28px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: 30px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { height: 24px !important; line-height: 24px !important; min-height: 24px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { box-sizing: border-box !important; height: 28px !important; line-height: 28px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: 28px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page #gridContainer .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { height: 24px !important; line-height: 24px !important; min-height: 24px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } /* View Tracking final viewport scroll containment. Keep only the grid rows pane scrollable once results are visible and the filter is closed. */ body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-tracking-grid-height-final: clamp(420px, calc(100dvh - 206px), 1520px); --ff-view-tracking-grid-chrome-height: 148px; --ff-view-tracking-rows-height-final: max(calc(var(--ff-grid-row-height, 26px) * 8), calc(var(--ff-view-tracking-grid-height-final) - var(--ff-view-tracking-grid-chrome-height))); min-height: calc(100dvh - 44px) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)), body.ff-app[data-grid-font-size="small"] .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) { --ff-view-tracking-grid-height-final: clamp(420px, calc(100dvh - 190px), 1540px); --ff-view-tracking-grid-chrome-height: 132px; } html:has(body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid), body.ff-app:has(.ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid), body.ff-app:has(.ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid) #app, body.ff-app:has(.ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid) .app-content, body.ff-app:has(.ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid) .main-content { overflow-y: hidden !important; } body.ff-app .main-content > .container:has(.ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid), body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)), body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw > [block-ui], body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) > .container-fullw > [block-ui] > .row, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty), body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty).dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid { height: var(--ff-view-tracking-grid-height-final) !important; max-height: var(--ff-view-tracking-grid-height-final) !important; min-height: var(--ff-view-tracking-grid-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-tracking-rows-height-final) !important; max-height: var(--ff-view-tracking-rows-height-final) !important; min-height: var(--ff-view-tracking-rows-height-final) !important; } body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-view-tracking.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row #gridContainer:not(.ff-grid-empty) :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: block !important; flex: 0 0 auto !important; position: relative !important; visibility: visible !important; z-index: 1 !important; } /* View Tracking boolean tick alignment. Lift read-only flag ticks inside the compact checkbox square without touching row selectors. */ body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox-icon { overflow: visible !important; position: relative !important; } body.ff-app .ff-view-tracking #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { font-size: 12px !important; height: auto !important; inset-inline-start: 50% !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; margin-inline-start: 0 !important; margin-left: 0 !important; margin-top: 0 !important; position: absolute !important; top: calc(50% - 2px) !important; transform: translate(-50%, -50%) !important; width: auto !important; } /* View Tracking large-result page fit. The filter accordion lives in a hidden container, so key the final fit directly to the populated scrolling grid. */ body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-view-tracking-grid-height-fit: clamp(480px, calc(100dvh - 56px), 1540px); --ff-view-tracking-grid-chrome-fit: 104px; --ff-view-tracking-rows-height-fit: max(calc(var(--ff-grid-row-height, 26px) * 10), calc(var(--ff-view-tracking-grid-height-fit) - var(--ff-view-tracking-grid-chrome-fit))); height: var(--ff-view-tracking-grid-height-fit) !important; max-height: var(--ff-view-tracking-grid-height-fit) !important; min-height: var(--ff-view-tracking-grid-height-fit) !important; overflow: hidden !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty), body.ff-app[data-grid-font-size="small"] .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-view-tracking-grid-height-fit: clamp(500px, calc(100dvh - 48px), 1540px); --ff-view-tracking-grid-chrome-fit: 92px; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-gridbase-container { height: var(--ff-view-tracking-grid-height-fit) !important; max-height: var(--ff-view-tracking-grid-height-fit) !important; min-height: var(--ff-view-tracking-grid-height-fit) !important; overflow: hidden !important; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-tracking-rows-height-fit) !important; max-height: var(--ff-view-tracking-rows-height-fit) !important; min-height: var(--ff-view-tracking-rows-height-fit) !important; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Image Search normal density pager recovery. Keep this at the end so normal density cannot inherit compact/small-font viewport values that push the pager and horizontal scrollbar below the grid. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="large"]) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(300px, calc(var(--ff-image-search-measured-grid-height, calc(100dvh - 292px)) - 8px), 1520px); --ff-image-search-grid-chrome-height: 216px; --ff-image-search-pager-height: 42px; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 26px)) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(320px, calc(var(--ff-image-search-measured-grid-height, calc(100dvh - 318px)) - 10px), 1520px); --ff-image-search-grid-chrome-height: 242px; --ff-image-search-pager-height: 44px; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 32px)) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; min-height: var(--ff-image-search-pager-height) !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; } /* Image Search result viewport ownership. When results are visible, only the grid rows should scroll. Leaving the page scrollbar active creates a second bar over the grid scrollbar in compact mode. */ body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock > .container-fullw, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-image-grid-viewport-lock .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(300px, var(--ff-image-search-measured-grid-height, calc(100dvh - 214px)), 1540px); --ff-image-search-grid-chrome-height: 112px; --ff-image-search-pager-height: 34px; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); } /* View Manifests final grid ownership. Keep this as the last View Manifests block so the fixed select/action pane and the scrollable data pane cannot inherit different row metrics after mode changes. */ body.ff-app .ff-view-manifests.ff-query-grid-page { --ff-view-manifests-row-height-final: 26px; --ff-view-manifests-cell-height-final: 24px; --ff-view-manifests-pager-height: 42px; --ff-view-manifests-scrollbar-size: 16px; --ff-grid-row-height: var(--ff-view-manifests-row-height-final); --ff-grid-cell-padding-y: 1px; --ff-view-manifests-row-height: var(--ff-view-manifests-row-height-final); --ff-view-manifests-fixed-row-height: var(--ff-view-manifests-row-height-final); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests.ff-query-grid-page, body.ff-app[data-grid-font-size="small"] .ff-view-manifests.ff-query-grid-page, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-view-compact { --ff-view-manifests-row-height-final: 16px; --ff-view-manifests-cell-height-final: 16px; --ff-view-manifests-pager-height: 54px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-query-grid-page { --ff-view-manifests-row-height-final: 34px; --ff-view-manifests-cell-height-final: 32px; } body.ff-app .ff-view-manifests.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-manifests.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer > .dx-gridbase-container { max-width: 100% !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid > .dx-datagrid.dx-gridbase-container { height: var(--ff-view-manifests-grid-height-measured) !important; max-height: var(--ff-view-manifests-grid-height-measured) !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper { max-width: 100% !important; min-width: 0 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-rowsview { min-height: var(--ff-view-manifests-row-height-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; min-width: 0 !important; scrollbar-gutter: stable !important; scrollbar-width: auto !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-width: none !important; min-width: 100% !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex-shrink: 0 !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-total-footer, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-total-footer { min-height: var(--ff-view-manifests-row-height-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid :is(.dx-datagrid-pager, .dx-pager), body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { min-height: var(--ff-view-manifests-pager-height) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height-final) !important; line-height: var(--ff-view-manifests-cell-height-final) !important; max-height: var(--ff-view-manifests-row-height-final) !important; min-height: var(--ff-view-manifests-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height-final) !important; line-height: var(--ff-view-manifests-cell-height-final) !important; max-height: var(--ff-view-manifests-row-height-final) !important; min-height: var(--ff-view-manifests-row-height-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height-final) !important; line-height: var(--ff-view-manifests-cell-height-final) !important; max-height: var(--ff-view-manifests-row-height-final) !important; min-height: var(--ff-view-manifests-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, img), body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: var(--ff-view-manifests-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-view-manifests-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { height: var(--ff-view-manifests-row-height-final) !important; line-height: 0 !important; max-height: var(--ff-view-manifests-row-height-final) !important; min-height: var(--ff-view-manifests-row-height-final) !important; overflow: visible !important; position: relative !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-headers .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* View grids use the real DevExtreme pager at the bottom. Suppress the old custom top-right duplicate while data is loading/repainting. */ body.ff-app .ff-page #pageInfoBadge, body.ff-app .ff-page .dx-datagrid-header-panel #pageInfoBadge { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-page .dx-datagrid-header-panel .dx-toolbar-item.ff-page-info-toolbar-item { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; width: 0 !important; } body.ff-app .ff-page.ff-grid-tools-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) .dx-datagrid-header-panel { height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; pointer-events: none !important; } /* Image Search final viewport stack. Let DevExtreme's grid sections reserve space for the pager and horizontal scrollbar instead of letting the rows pane consume the full grid height. */ body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; height: var(--ff-image-search-grid-height) !important; max-height: var(--ff-image-search-grid-height) !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row > td { box-sizing: border-box !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { table-layout: fixed !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) { min-width: 0 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview td { max-width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row > td :is(.dx-editor-container, .dx-texteditor, .dx-dropdowneditor, .dx-texteditor-container) { box-sizing: border-box !important; display: block !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-headers .dx-datagrid-filter-row > td :is(.dx-texteditor-input, input) { box-sizing: border-box !important; max-width: 100% !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; display: block !important; height: 14px !important; left: 0 !important; opacity: 1 !important; position: absolute !important; right: 16px !important; visibility: visible !important; z-index: 4 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-image-search-pager-height) !important; height: var(--ff-image-search-pager-height) !important; min-height: var(--ff-image-search-pager-height) !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 5 !important; } /* Image Search compact alignment guard. Keep this after the final viewport stack so header/filter/data tables share the same left edge while DevExtreme still reserves the right scrollbar edge. */ body.ff-app .ff-imaging-list.ff-view-compact.ff-image-results-visible { --ff-image-search-grid-height: clamp(300px, var(--ff-image-search-measured-grid-height, calc(100dvh - 214px)), 1540px); --ff-image-search-grid-chrome-height: 112px; --ff-image-search-pager-height: 34px; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 4), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))); } body.ff-app .ff-imaging-list.ff-view-compact { --ff-grid-row-height: 20px; --ff-grid-cell-padding-y: 0; --ff-image-search-row-height-final: 20px; --ff-image-search-cell-height-final: 16px; --ff-image-search-selector-size: 12px; } body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-search-grid .dx-datagrid-rowsview .dx-scrollable-container { scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-search-grid .dx-datagrid-headers .dx-header-row { background-color: var(--ff-primary, #367bf5) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-search-grid .dx-datagrid-headers .dx-datagrid-scrollbar-spacer, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-search-grid .dx-datagrid-headers .dx-datagrid-scrollbar-spacer::before, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-image-search-grid .dx-datagrid-headers .dx-datagrid-scrollbar-spacer::after { background-color: var(--ff-primary, #367bf5) !important; background-image: none !important; border-color: var(--ff-primary, #367bf5) !important; box-shadow: none !important; } /* View Invoices normal selector edge guard. Give the fixed selector pane real room so the checkbox is not clipped at the page edge. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer { --ff-grid-select-column-width: 34px; --ff-view-invoices-select-column-width: 26px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-datagrid-content-fixed colgroup col:first-child { max-width: var(--ff-view-invoices-select-column-width) !important; min-width: var(--ff-view-invoices-select-column-width) !important; overflow: visible !important; width: var(--ff-view-invoices-select-column-width) !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { left: 50% !important; } /* View Invoices normal bottom reserve. Normal density needs extra non-row chrome budget so rows do not sit beneath totals/pager. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 184px; --ff-view-invoices-total-footer-height: 34px; --ff-view-invoices-pager-height: 40px; --ff-view-invoices-pager-inner-height: 30px; --ff-view-invoices-rows-cushion: 0px; } /* View Tracking large-result row fill. Use the spare lower viewport room as taller rows, without changing the grid shell or scrollbar/pager structure that is now working. */ body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 3px; --ff-tracking-fill-row-height: 34px; --ff-tracking-fill-cell-height: 30px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty), body.ff-app[data-grid-font-size="small"] .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-tracking-fill-row-height: 26px; --ff-tracking-fill-cell-height: 24px; } body.ff-app[data-grid-font-size="large"] .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-grid-row-height: 38px; --ff-grid-cell-padding-y: 4px; --ff-tracking-fill-row-height: 38px; --ff-tracking-fill-cell-height: 34px; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-command-col) { height: var(--ff-tracking-fill-row-height) !important; line-height: var(--ff-tracking-fill-cell-height) !important; max-height: var(--ff-tracking-fill-row-height) !important; min-height: var(--ff-tracking-fill-row-height) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; } body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row #gridContainer.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { line-height: var(--ff-tracking-fill-cell-height) !important; max-height: var(--ff-tracking-fill-cell-height) !important; min-height: 0 !important; } /* View Manifests final parity guard. This must stay at the end: DevExtreme renders fixed columns, headers, filters, and data rows as separate tables, so keep their sizing contract identical. */ body.ff-app .ff-view-manifests.ff-query-grid-page { --ff-view-manifests-command-column-width-final: 34px; --ff-view-manifests-select-column-width-final: 34px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests.ff-query-grid-page { --ff-grid-cell-padding-y: 1px; --ff-grid-row-height: var(--ff-view-manifests-row-height-final, 26px); --ff-view-manifests-cell-height-final: 24px; --ff-view-manifests-fixed-row-height-final: 40.83px; --ff-view-manifests-row-height-final: 40px; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; table-layout: fixed !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { table-layout: auto !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-table.dx-pointer-events-none { background-color: transparent !important; table-layout: fixed !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-table.dx-pointer-events-none { --ff-grid-row-height: var(--ff-view-manifests-fixed-row-height-final); --ff-view-manifests-fixed-row-height: var(--ff-view-manifests-fixed-row-height-final); --ff-view-manifests-row-height: var(--ff-view-manifests-fixed-row-height-final); --ff-view-manifests-row-height-final: var(--ff-view-manifests-fixed-row-height-final); --ff-view-manifests-row-height-normal: var(--ff-view-manifests-fixed-row-height-final); } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-table.dx-pointer-events-none tr > td:nth-child(n+3) { background-color: transparent !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed) { max-width: none !important; min-width: 0 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-command-select, .dx-command-select > td), body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed colgroup col:first-child { max-width: var(--ff-view-manifests-select-column-width-final) !important; min-width: var(--ff-view-manifests-select-column-width-final) !important; width: var(--ff-view-manifests-select-column-width-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-command-edit, .ff-manifest-command-col, .dx-command-edit > td, .ff-manifest-command-col > td), body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed colgroup col:nth-child(2) { max-width: var(--ff-view-manifests-command-column-width-final) !important; min-width: var(--ff-view-manifests-command-column-width-final) !important; width: var(--ff-view-manifests-command-column-width-final) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-manifest-command-col.dx-hidden-cell * { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-header-row > td { box-sizing: border-box !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-datagrid-filter-row, body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-datagrid-filter-row > td { box-sizing: border-box !important; overflow: visible !important; position: relative !important; z-index: 5 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-datagrid-filter-row > td :is(.dx-editor-container, .dx-texteditor, .dx-dropdowneditor, .dx-texteditor-container) { box-sizing: border-box !important; display: block !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 0 !important; overflow: visible !important; position: relative !important; width: 100% !important; z-index: 6 !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-headers .dx-datagrid-filter-row > td :is(.dx-texteditor-input, input) { box-sizing: border-box !important; max-width: 100% !important; width: 100% !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table:not(.dx-pointer-events-none), .dx-datagrid-table-fixed:not(.dx-pointer-events-none)) > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table:not(.dx-pointer-events-none), .dx-datagrid-table-fixed:not(.dx-pointer-events-none)) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table:not(.dx-pointer-events-none), .dx-datagrid-table-fixed:not(.dx-pointer-events-none)) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview :is(.dx-datagrid-content-fixed, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) :is(.dx-datagrid-table:not(.dx-pointer-events-none), .dx-datagrid-table-fixed:not(.dx-pointer-events-none)) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-view-manifests-row-height-final) !important; line-height: var(--ff-view-manifests-cell-height-final) !important; max-height: var(--ff-view-manifests-row-height-final) !important; min-height: var(--ff-view-manifests-row-height-final) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, img), body.ff-app .ff-view-manifests.ff-query-grid-page :is(#gridContainer, #errorContainer, #integrationContainer) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { box-sizing: border-box !important; line-height: var(--ff-view-manifests-cell-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-view-manifests-cell-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } /* Golden grid Manifest pilot. Opt-in only: the main Manifest grid owns a single row-height contract while legacy Manifest rules continue to cover secondary grids. */ body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid { --ff-golden-grid-row-height: 26px; --ff-golden-grid-cell-line-height: 24px; --ff-grid-row-height: var(--ff-golden-grid-row-height); --ff-grid-cell-padding-y: 1px; --ff-view-manifests-row-height-final: var(--ff-golden-grid-row-height); --ff-view-manifests-cell-height-final: var(--ff-golden-grid-cell-line-height); --ff-view-manifests-fixed-row-height-final: var(--ff-golden-grid-row-height); --ff-view-manifests-fixed-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height-normal: var(--ff-golden-grid-row-height); --ff-view-manifests-cell-height-normal: var(--ff-golden-grid-cell-line-height); --ff-view-manifests-command-column-width-final: 34px; --ff-view-manifests-select-column-width-final: 34px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid, body.ff-app[data-grid-font-size="small"] .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page.ff-view-compact #gridContainer.ff-golden-grid { --ff-golden-grid-row-height: 20px; --ff-golden-grid-cell-line-height: 18px; --ff-grid-cell-padding-y: 0; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid { --ff-golden-grid-row-height: 34px; --ff-golden-grid-cell-line-height: 30px; --ff-grid-cell-padding-y: 2px; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid .dx-datagrid-rowsview .dx-datagrid-table.dx-pointer-events-none { --ff-grid-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-fixed-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height-final: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height-normal: var(--ff-golden-grid-row-height); } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid.ff-grid-fixed-columns-managed .dx-datagrid-rowsview .dx-data-row > td.dx-hidden-cell * { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { table-layout: fixed !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview .dx-scrollable-content, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content { max-height: none !important; max-width: none !important; min-width: max(100%, var(--ff-view-manifests-columns-content-width-measured, 0px)) !important; width: var(--ff-view-manifests-columns-content-width-measured, auto) !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview > .dx-datagrid-content-fixed { min-height: 0 !important; overflow: hidden !important; z-index: 2 !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed { min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-golden-grid-row-height) !important; line-height: var(--ff-golden-grid-cell-line-height) !important; max-height: var(--ff-golden-grid-row-height) !important; min-height: var(--ff-golden-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* View Manifests final viewport stack. Keep this last so the rows pane scrolls between the header and real DevExtreme footer/pager. */ body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid > .dx-gridbase-container, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid > .dx-gridbase-container { height: var(--ff-view-manifests-grid-height-measured) !important; max-height: var(--ff-view-manifests-grid-height-measured) !important; min-height: var(--ff-view-manifests-grid-height-measured) !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview > .dx-datagrid-content-fixed, body.ff-app .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview > .dx-datagrid-content-fixed, body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-golden-grid-page .ff-grid-result-row #gridContainer.ff-golden-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed { min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-total-footer, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-total-footer { display: block !important; flex: 0 0 auto !important; min-height: var(--ff-view-manifests-row-height-final) !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid :is(.dx-datagrid-pager, .dx-pager), body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; min-height: var(--ff-view-manifests-pager-height, 44px) !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-pager .dx-info, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-pager .dx-info { display: none !important; } /* View Manifests scrollbar and row parity guard. Keep this page-specific: use one normal row-height contract for both fixed and scrollable panes without touching DevExtreme pager/scrollbar interaction. */ body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]):not([data-grid-font-size="large"]) .ff-view-manifests.ff-query-grid-page.ff-golden-grid-page #gridContainer.ff-golden-grid { --ff-golden-grid-row-height: 26px; --ff-golden-grid-cell-line-height: 24px; --ff-grid-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-cell-height-final: var(--ff-golden-grid-cell-line-height); --ff-view-manifests-fixed-row-height-final: var(--ff-golden-grid-row-height); --ff-view-manifests-fixed-row-height: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height-final: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height-normal: var(--ff-golden-grid-row-height); --ff-view-manifests-row-height: var(--ff-golden-grid-row-height); } body.ff-app .ff-view-manifests.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer.ff-manifest-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { scrollbar-gutter: stable !important; } /* Generate Invoice final compact pager/row overlay guard. Keep the summary/detail pager in full button mode and prevent grid spacer/focus layers from drawing through data rows. */ body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-pager-height: 42px; --ff-invoice-generate-pager-inner-height: 30px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) { --ff-invoice-generate-pager-height: 38px; --ff-invoice-generate-pager-inner-height: 28px; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-invoice-generate-pager-height) !important; justify-content: flex-end !important; line-height: var(--ff-invoice-generate-pager-inner-height) !important; margin: 0 !important; max-height: var(--ff-invoice-generate-pager-height) !important; min-height: var(--ff-invoice-generate-pager-height) !important; overflow: visible !important; padding: 4px 8px !important; position: relative !important; visibility: visible !important; z-index: 4 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager * { overflow: visible !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; height: var(--ff-invoice-generate-pager-inner-height) !important; line-height: var(--ff-invoice-generate-pager-inner-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: var(--ff-invoice-generate-pager-inner-height) !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-invoice-generate-pager-inner-height) - 2px) !important; justify-content: center !important; line-height: calc(var(--ff-invoice-generate-pager-inner-height) - 2px) !important; margin: 0 2px !important; max-height: none !important; min-height: calc(var(--ff-invoice-generate-pager-inner-height) - 2px) !important; min-width: 24px !important; padding: 0 6px !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-selection { background-color: var(--ff-primary, #367bf5) !important; border-color: var(--ff-primary, #367bf5) !important; border-radius: 6px !important; color: #fff !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-info { max-width: none !important; min-width: max-content !important; text-overflow: clip !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-focus-overlay { display: none !important; } /* View Manifests simple-grid compact fit. This page now follows the View Quotes grid path, but it needs its own final compact density/viewport lock so the rows do not stretch inside the taller grid. */ body.ff-app .ff-view-manifests-simple.ff-query-grid-page { --ff-view-manifests-simple-grid-height: clamp(500px, calc(100dvh - 200px), 1540px); --ff-view-manifests-simple-grid-chrome-height: 132px; --ff-view-manifests-simple-grid-height-effective: var(--ff-view-manifests-simple-grid-height); --ff-view-manifests-simple-rows-height: max(360px, calc(var(--ff-view-manifests-simple-grid-height-effective) - var(--ff-view-manifests-simple-grid-chrome-height))); --ff-view-grid-viewport-height: var(--ff-view-manifests-simple-grid-height); --ff-compact-query-grid-height: var(--ff-view-manifests-simple-grid-height); --ff-compact-query-grid-rows-height: var(--ff-view-manifests-simple-rows-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page, body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-view-compact, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page { --ff-grid-row-height: 18px; --ff-golden-grid-row-height: 18px; --ff-view-manifests-row-height-final: 18px; --ff-grid-cell-padding-y: 0; --ff-grid-select-column-width: 22px; --ff-grid-command-column-width: 32px; --ff-view-quotes-check-size: 12px; --ff-view-quotes-action-icon-size: 14px; --ff-view-manifests-simple-grid-height: clamp(520px, calc(100dvh - 198px), 1540px); --ff-view-manifests-simple-grid-chrome-height: 86px; --ff-view-manifests-simple-rows-height: max(390px, calc(var(--ff-view-manifests-simple-grid-height-effective) - var(--ff-view-manifests-simple-grid-chrome-height))); } body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer#gridContainer, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer#gridContainer.dx-datagrid, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer#gridContainer > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer#gridContainer .dx-datagrid { height: var(--ff-view-manifests-simple-grid-height) !important; max-height: var(--ff-view-manifests-simple-grid-height) !important; min-height: var(--ff-view-manifests-simple-grid-height) !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-manifests-simple-rows-height) !important; max-height: var(--ff-view-manifests-simple-rows-height) !important; min-height: var(--ff-view-manifests-simple-rows-height) !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-content, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } /* Let DevExtreme keep native table semantics on View Manifests. Block/flex row overrides make the horizontal scrollbar and pager lose their click targets after the first scroll interaction. Row density is controlled by height/padding rules instead. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table { display: table !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody { display: table-row-group !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row { display: table-row !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; width: auto !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td { display: table-cell !important; flex: none !important; min-width: 0; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app[data-grid-font-size="small"] .ff-view-manifests-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:has(.ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) .main-content, body.ff-app .main-content > .container:has(.ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) { overflow-y: visible !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { overflow: visible !important; } /* View Manifests simple filter guard. The compact accordion can leave its panel body painted during close animation, which lets hidden filter rows sit over the toolbar/grid. Keep closed panels inert. */ body.ff-app .ff-view-manifests-simple.ff-query-grid-page .panel-collapse:not(.in) { max-height: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page .panel-collapse:not(.in) .panel-body, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .panel-collapse:not(.in) .ff-sr-card { display: none !important; max-height: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page .panel-collapse.in { max-height: none !important; overflow: visible !important; pointer-events: auto !important; visibility: visible !important; } /* Final page-level compact lock for View Manifests. The page toggles .ff-view-compact locally, so do not depend only on body density flags for the row-height contract. */ body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-view-compact #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-view-compact #gridContainer .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page.ff-view-compact #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *:not(input):not(textarea):not(.dx-texteditor-input) { line-height: 16px !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview *:not(input):not(textarea):not(.dx-texteditor-input) { -ms-user-select: none !important; -webkit-user-select: none !important; user-select: none !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-pager, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-datagrid-pager, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-pager, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-datagrid-pager { box-sizing: border-box !important; min-height: 30px !important; overflow: visible !important; padding-bottom: 2px !important; padding-top: 2px !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-pager .dx-pages, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-pager .dx-page-sizes, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-pager .dx-pages, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-pager .dx-page-sizes { align-items: center !important; display: inline-flex !important; min-height: 24px !important; overflow: visible !important; vertical-align: middle !important; } body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-pager .dx-page, body.ff-app .ff-view-manifests-simple.ff-query-grid-page #gridContainer .dx-pager .dx-page-size, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-pager .dx-page, body.ff-app .ff-view-manifests-simple.ff-query-grid-page .dx-pager .dx-page-size { align-items: center !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; min-height: 18px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* View Manifest Routes simple-grid fit. Routes now follows the View Quotes grid path: one scrolling grid table, no fixed panes, and only the outer grid height is measured by the controller. */ body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page { --ff-route-simple-grid-height: var(--ff-route-simple-grid-height-measured, clamp(500px, calc(100dvh - 200px), 1540px)); --ff-route-simple-grid-chrome-height: 142px; --ff-route-simple-rows-height: max(340px, calc(var(--ff-route-simple-grid-height) - var(--ff-route-simple-grid-chrome-height))); --ff-view-grid-viewport-height: var(--ff-route-simple-grid-height); --ff-compact-query-grid-height: var(--ff-route-simple-grid-height); --ff-compact-query-grid-rows-height: var(--ff-route-simple-rows-height); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page { --ff-grid-row-height: 24px; --ff-grid-cell-padding-y: 1px; --ff-grid-select-column-width: 24px; --ff-grid-command-column-width: 34px; --ff-view-quotes-check-size: 14px; --ff-view-quotes-action-icon-size: 16px; --ff-route-simple-grid-height: var(--ff-route-simple-grid-height-measured, clamp(500px, calc(100dvh - 238px), 1540px)); --ff-route-simple-grid-chrome-height: 174px; --ff-route-simple-rows-height: max(300px, calc(var(--ff-route-simple-grid-height) - var(--ff-route-simple-grid-chrome-height))); } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page > .container-fullw { padding-top: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results-toolbar, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results { margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 0 !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results-toolbar { min-height: 24px !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results-toolbar > .ff-grid-toolbar-inner { align-items: center !important; min-height: 24px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results-toolbar :is(.label, .valuesonly, .checkbox, .checkbox-inline, label) { margin-bottom: 0 !important; margin-top: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results > [class*="col-"] { margin-bottom: 0 !important; overflow: visible !important; padding-bottom: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results > [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results #gridContainer#gridContainer, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results #gridContainer#gridContainer.dx-datagrid, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results #gridContainer#gridContainer > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .ff-route-results #gridContainer#gridContainer .dx-datagrid { height: var(--ff-route-simple-grid-height) !important; max-height: var(--ff-route-simple-grid-height) !important; min-height: var(--ff-route-simple-grid-height) !important; overflow: hidden !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-route-simple-rows-height) !important; max-height: var(--ff-route-simple-rows-height) !important; min-height: var(--ff-route-simple-rows-height) !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-content, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-datagrid-total-footer { min-height: 28px !important; overflow: visible !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer :is(.dx-datagrid-pager, .dx-pager) { height: auto !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 38px !important; overflow: visible !important; padding-bottom: 4px !important; padding-top: 4px !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; display: inline-flex !important; min-height: 28px !important; vertical-align: middle !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; display: inline-flex !important; justify-content: center !important; min-height: 28px !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer :is(.dx-command-edit, .dx-command-edit-with-icons) { min-width: 44px !important; overflow: visible !important; width: 44px !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer#gridContainer :is(.dx-command-edit, .dx-command-edit-with-icons) :is(.dx-link, .dx-button, .dx-button-content, .fa) { align-items: center !important; display: inline-flex !important; justify-content: center !important; min-width: 20px !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label), body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app[data-grid-font-size="small"] .ff-view-manifest-routes-simple.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 4px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app:has(.ff-view-manifest-routes-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-view-manifest-routes-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-view-manifest-routes-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) .main-content, body.ff-app .main-content > .container:has(.ff-view-manifest-routes-simple.ff-query-grid-page .ff-grid-result-row #gridContainer .dx-datagrid) { overflow-y: visible !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .panel-collapse:not(.in) { max-height: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .panel-collapse:not(.in) .panel-body, body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .panel-collapse:not(.in) .ff-sr-card { display: none !important; max-height: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-manifest-routes-simple.ff-query-grid-page .panel-collapse.in { max-height: none !important; overflow: visible !important; pointer-events: auto !important; visibility: visible !important; } /* View Invoices final pager/viewport guard. Keep this late so the pager sits directly below totals and later normal-density reserves cannot clip the page controls. */ body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 142px; --ff-view-invoices-total-footer-height: 30px; --ff-view-invoices-pager-height: 42px; --ff-view-invoices-pager-inner-height: 30px; --ff-view-invoices-grid-height-final: clamp(870px, var(--ff-view-invoices-available-grid-height, calc(100dvh + 180px)), 4200px); --ff-view-invoices-rows-height-final: max(260px, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height))); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact):not([data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 148px; --ff-view-invoices-total-footer-height: 32px; --ff-view-invoices-pager-height: 44px; --ff-view-invoices-pager-inner-height: 32px; --ff-view-invoices-rows-cushion: 0px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid { --ff-view-invoices-grid-chrome-height: 128px; --ff-view-invoices-total-footer-height: 28px; --ff-view-invoices-pager-height: 40px; --ff-view-invoices-pager-inner-height: 30px; --ff-view-invoices-grid-height-final: clamp(1650px, var(--ff-view-invoices-available-grid-height, calc(100dvh + 900px)), 4200px); --ff-view-invoices-rows-height-final: max(260px, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height))); } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid > .dx-datagrid.dx-gridbase-container, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid > .dx-gridbase-container { height: var(--ff-view-invoices-grid-height-final) !important; max-height: var(--ff-view-invoices-grid-height-final) !important; min-height: var(--ff-view-invoices-grid-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-invoices.ff-query-grid-page:not(:has(.panel-collapse.in)) .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-datagrid-total-footer { display: block !important; flex: 0 0 auto !important; height: var(--ff-view-invoices-total-footer-height) !important; margin-bottom: 0 !important; max-height: none !important; min-height: var(--ff-view-invoices-total-footer-height) !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: var(--ff-view-invoices-pager-height) !important; overflow: visible !important; padding: 0 12px 2px !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; height: var(--ff-view-invoices-pager-inner-height) !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; margin: 0 !important; max-height: none !important; min-height: var(--ff-view-invoices-pager-inner-height) !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-invoices-pager-inner-height) !important; justify-content: center !important; line-height: var(--ff-view-invoices-pager-inner-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; min-height: var(--ff-view-invoices-pager-inner-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } /* View-page rollout stabilizer. These pages now use the View Quotes/Manifests single-pane grid approach: keep row selectors visible and let DevExtreme own both scrollbars. */ body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { box-sizing: border-box !important; max-width: 34px !important; min-width: 34px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: 34px !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { display: inline-flex !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; } body.ff-app :is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; scrollbar-gutter: stable !important; } body.ff-app :is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer) .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } /* View Invoices final footer and selector alignment. Keep this page-scoped while this view is being worked through. */ body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select { box-sizing: border-box !important; max-width: 34px !important; min-width: 34px !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; width: 34px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin: 0 auto !important; max-height: 16px !important; min-height: 16px !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; visibility: visible !important; width: 16px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-icon { height: 14px !important; line-height: 14px !important; margin: 0 !important; width: 14px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > td, body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > tr > td { background-color: var(--ff-dx-selection-tint) !important; box-shadow: none !important; color: var(--text) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):hover > td, body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):hover > tr > td { background-color: var(--ff-dx-selection-tint-hover) !important; box-shadow: none !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; flex: 0 0 auto !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; margin: 0 !important; min-height: 44px !important; overflow: visible !important; padding: 5px 12px !important; width: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; height: 32px !important; line-height: 32px !important; margin: 0 !important; max-height: none !important; min-height: 32px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) .dx-pager .dx-page-sizes { order: 1 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) .dx-pager .dx-info { order: 2 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) .dx-pager .dx-pages { order: 3 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer, #gridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 32px !important; justify-content: center !important; line-height: 32px !important; margin: 0 !important; max-height: none !important; min-height: 32px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } /* View Invoices page-only pager finishing. The numbered buttons already show the page, so hide DevExtreme's duplicate info text and leave the row area clear of the footer. */ body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-info { display: none !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) :is(.dx-datagrid-pager, .dx-pager) { min-height: 30px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page-sizes, .dx-pages), body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; height: 28px !important; line-height: 28px !important; max-height: 28px !important; min-height: 28px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row :is(#clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer:not(.ff-grid-empty) .dx-pager .dx-selection, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #waybillGridContainer:not(.ff-grid-empty) .dx-pager .dx-selection { box-sizing: border-box !important; height: 18px !important; line-height: 18px !important; max-height: 18px !important; min-height: 18px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #clientGridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row #waybillGridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button { height: 24px !important; line-height: 24px !important; max-height: 24px !important; min-height: 24px !important; transform: translateY(-3px) !important; } /* Migrated view-grid pager and scrollbar standard. View Invoices is the current blueprint: one right-aligned pager group, compact selected chips, and DevExtreme-owned scrollbars. */ body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-info { display: none !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; justify-content: flex-end !important; min-height: 30px !important; overflow: visible !important; padding: 0 12px !important; width: 100% !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-page-sizes { order: 1 !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-pages { order: 2 !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-selection { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-pager .dx-navigate-button { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; transform: translateY(-3px) !important; vertical-align: middle !important; } body.ff-app :is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; scrollbar-gutter: auto !important; } body.ff-app :is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer):not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } /* Debtors-proven aggressive viewport fill for migrated view grids. Opt-in pages may grow beyond the visible viewport; page scrolling is better than leaving an unusable blank footer under the grid. */ body.ff-view-grid-viewport-active, body.ff-view-grid-viewport-active #app, body.ff-view-grid-viewport-active .app-content, body.ff-view-grid-viewport-active .main-content { height: auto !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page .ff-grid-result-row, body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page .ff-grid-result-col, body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer).ff-view-grid-viewport-grid, body.ff-app :is(.ff-view-invoices, .ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs).ff-query-grid-page :is(#gridContainer, #clientGridContainer, #waybillGridContainer).ff-view-grid-viewport-grid .dx-datagrid.dx-gridbase-container { max-height: none !important; overflow: visible !important; } /* Migrated view-grid final guard. Debtors is the accepted reference page: pager controls stay together on the right, DevExtreme owns the scrollbars, and grids may grow enough to use the page instead of leaving a dead band below the footer. Keep this late so older page-specific rules cannot pull these grids back to the legacy layout. */ body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) :is(.ff-grid-result-row, .ff-grid-result-col), body.ff-view-grid-viewport-active .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) :is(.ff-grid-result-row, .ff-grid-result-col) { max-height: none !important; overflow: visible !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer.ff-view-grid-viewport-grid, body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer.ff-view-grid-viewport-grid .dx-datagrid.dx-gridbase-container { max-height: none !important; overflow: visible !important; } body.ff-view-grid-viewport-active, body.ff-view-grid-viewport-active #app, body.ff-view-grid-viewport-active .app-content, body.ff-view-grid-viewport-active .main-content { height: auto !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-datagrid.dx-gridbase-container :is(.dx-datagrid-pager.dx-pager, .dx-pager), body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer.ff-view-grid-viewport-grid .dx-datagrid.dx-gridbase-container :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding: 0 12px 6px !important; visibility: visible !important; width: 100% !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager .dx-info { display: none !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager .dx-selection { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-pager .dx-navigate-button { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; padding: 0 !important; transform: translateY(-3px) !important; vertical-align: middle !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select, body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-datagrid-rowsview td.dx-command-edit.dx-command-edit-with-icons { box-sizing: border-box !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-page.ff-query-grid-page:is(.ff-view-payments, .ff-view-tracking, .ff-imaging-list, .ff-query, .ff-tariffs) #gridContainer .dx-datagrid-rowsview td.dx-command-edit.dx-command-edit-with-icons :is(.dx-link, a, .dx-button, .dx-button-content, .fa, .dx-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 0 auto !important; max-height: 18px !important; min-height: 18px !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: translateY(-2px) !important; vertical-align: middle !important; width: 18px !important; } /* View Payments viewport finish. This mirrors the Debtors-confirmed behaviour: page-specific viewport ownership, DevExtreme-owned scrollbars, and a taller grid in compact mode so Chrome does not leave a large blank band below the grid. */ body.ff-payments-grid-viewport-active, body.ff-payments-grid-viewport-active #app, body.ff-payments-grid-viewport-active .app-content, body.ff-payments-grid-viewport-active .main-content, body.ff-view-payments-grid-viewport-active, body.ff-view-payments-grid-viewport-active #app, body.ff-view-payments-grid-viewport-active .app-content, body.ff-view-payments-grid-viewport-active .main-content { height: auto !important; min-height: 100dvh !important; overflow-y: auto !important; } html:has(body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid), body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid), body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) #app, body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) .app-content, body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) .main-content { height: auto !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > .col-md-12, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid.dx-gridbase-container { max-height: none !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid { height: var(--ff-payments-grid-height-measured, var(--ff-view-grid-height-measured, auto)) !important; max-height: var(--ff-payments-grid-height-measured, var(--ff-view-grid-height-measured, none)) !important; min-height: var(--ff-payments-grid-height-measured, var(--ff-view-grid-height-measured, 520px)) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-scrollbar-vertical, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollbar-vertical { right: 0 !important; } /* Content-aware view-grid footer rule. View Tracking and View Collections now use the shared measured viewport. Keep totals directly after the current page rows, let the grid grow only when the row count needs it, and keep pager controls together on the right. */ body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page :is(.ff-grid-result-row, .ff-grid-result-col), body.ff-view-grid-viewport-active :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page :is(.ff-grid-result-row, .ff-grid-result-col) { max-height: none !important; overflow: visible !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid), body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid).dx-datagrid, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid { height: var(--ff-view-grid-height-measured, var(--ff-view-collections-grid-height-measured, var(--ff-view-collections-grid-height, auto))) !important; max-height: var(--ff-view-grid-height-measured, var(--ff-view-collections-grid-height-measured, var(--ff-view-collections-grid-height, none))) !important; min-height: var(--ff-view-grid-height-measured, var(--ff-view-collections-grid-height-measured, var(--ff-view-collections-grid-height, 120px))) !important; overflow: visible !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-grid-rows-height-measured, var(--ff-view-collections-rows-height-measured, var(--ff-view-collections-rows-height-final, var(--ff-view-collections-rows-height, auto)))) !important; max-height: var(--ff-view-grid-rows-height-measured, var(--ff-view-collections-rows-height-measured, var(--ff-view-collections-rows-height-final, var(--ff-view-collections-rows-height, none)))) !important; min-height: var(--ff-view-grid-rows-height-measured, var(--ff-view-collections-rows-height-measured, var(--ff-view-collections-rows-height-final, var(--ff-view-collections-rows-height, 32px)))) !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { box-sizing: border-box !important; height: auto !important; max-height: none !important; min-height: max(100%, var(--ff-view-collections-rows-content-height)) !important; min-width: var(--ff-view-collections-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-collections-horizontal-width, auto) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { max-height: none !important; max-width: none !important; min-width: var(--ff-view-collections-horizontal-width, 100%) !important; overflow: visible !important; width: var(--ff-view-collections-horizontal-width, auto) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-view-collections-horizontal-width, 100%) !important; width: var(--ff-view-collections-horizontal-width, auto) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer:not(.ff-standard-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer:not(.ff-standard-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed > .dx-datagrid-table { display: none !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-collections.ff-query-grid-page { --ff-view-collections-select-column-width: 34px; --ff-view-collections-id-column-width: 64px; --ff-view-collections-command-column-width: 34px; --ff-view-collections-fixed-pane-width: calc(var(--ff-view-collections-select-column-width) + var(--ff-view-collections-id-column-width) + var(--ff-view-collections-command-column-width)); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-collections.ff-query-grid-page, body.ff-app .ff-view-collections.ff-query-grid-page.ff-view-compact { --ff-view-collections-command-column-width: 32px; } body.ff-app[data-grid-font-size="large"] .ff-view-collections.ff-query-grid-page:not(.ff-view-compact) { --ff-view-collections-select-column-width: 36px; --ff-view-collections-id-column-width: 68px; --ff-view-collections-command-column-width: 36px; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { box-sizing: border-box !important; max-width: var(--ff-view-collections-fixed-pane-width) !important; min-width: var(--ff-view-collections-fixed-pane-width) !important; width: var(--ff-view-collections-fixed-pane-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { box-sizing: border-box !important; max-width: var(--ff-view-collections-fixed-pane-width) !important; min-width: var(--ff-view-collections-fixed-pane-width) !important; table-layout: fixed !important; width: var(--ff-view-collections-fixed-pane-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed) colgroup col:nth-child(1) { width: var(--ff-view-collections-select-column-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed) colgroup col:nth-child(2) { width: var(--ff-view-collections-id-column-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed) colgroup col:nth-child(3) { width: var(--ff-view-collections-command-column-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select), body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-command-select > td { box-sizing: border-box !important; max-width: var(--ff-view-collections-select-column-width) !important; min-width: var(--ff-view-collections-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-view-collections-select-column-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.ff-collection-id-col), body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.ff-collection-id-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-collections-id-column-width) !important; min-width: var(--ff-view-collections-id-column-width) !important; width: var(--ff-view-collections-id-column-width) !important; } body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.ff-collection-command-col, .dx-command-edit), body.ff-app .ff-view-collections.ff-query-grid-page #gridContainer.ff-collections-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.ff-collection-command-col, .dx-command-edit) > td { box-sizing: border-box !important; max-width: var(--ff-view-collections-command-column-width) !important; min-width: var(--ff-view-collections-command-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-view-collections-command-column-width) !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; min-height: 34px !important; overflow: visible !important; padding: 0 12px 6px !important; visibility: visible !important; width: 100% !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager .dx-info { display: none !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager .dx-pages { order: 2 !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager .dx-selection { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app :is(.ff-view-tracking, .ff-view-collections).ff-query-grid-page #gridContainer:is(.ff-view-grid-viewport-grid, .ff-collections-viewport-grid) .dx-pager .dx-navigate-button { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; transform: translateY(-3px) !important; vertical-align: middle !important; } /* Queries: keep the accepted pager standard, but do not rely on the DevExtreme icon font for navigation. In this page it can render as stray X-like glyphs below the grid instead of visible pager arrows. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-datagrid-bottom-load-panel { display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-row, body.ff-app .ff-query.ff-query-grid-page .ff-query-status-row { margin-bottom: 8px !important; margin-top: 6px !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-loading-label, body.ff-app .ff-query.ff-query-grid-page .ff-query-status-message { align-items: center !important; border-radius: 4px !important; display: inline-flex !important; font-size: 14px !important; font-weight: 700 !important; gap: 8px !important; line-height: 20px !important; min-height: 30px !important; padding: 5px 12px !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-status-message { background: #fff7df !important; border: 1px solid #f0c36d !important; color: #5f4800 !important; } body.ff-app .ff-query.ff-query-grid-page .ff-query-status-message-error { background: #fff1f1 !important; border-color: #ff8f8f !important; color: #9a1f1f !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button { align-items: center !important; color: #111 !important; display: inline-flex !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 0 !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; min-width: 20px !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: translateY(-3px) !important; width: 20px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button::before { align-items: center !important; display: inline-flex !important; font-size: 26px !important; font-weight: 700 !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; width: 20px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-prev-button::before { content: "<" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-next-button::before { content: ">" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button.dx-button-disable::before, body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button.dx-state-disabled::before { color: #b7bec7 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button::after, body.ff-app .ff-query.ff-query-grid-page #gridContainer:not(.ff-grid-empty) .dx-pager .dx-navigate-button .dx-icon { content: none !important; display: none !important; } /* Tariffs selector finish. A shared migrated-view rule intentionally lifts selector widgets for other pages; Tariffs needs true cell-centering because its compact rows are tighter. */ body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { box-sizing: border-box !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tariffs-check-size, 14px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-tariffs-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-tariffs-check-size, 14px) !important; max-width: var(--ff-tariffs-check-size, 14px) !important; min-height: var(--ff-tariffs-check-size, 14px) !important; min-width: var(--ff-tariffs-check-size, 14px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tariffs-check-size, 14px) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-container, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-icon { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tariffs-check-size, 14px) !important; justify-content: center !important; line-height: var(--ff-tariffs-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-tariffs-check-size, 14px) !important; max-width: var(--ff-tariffs-check-size, 14px) !important; min-height: var(--ff-tariffs-check-size, 14px) !important; min-width: var(--ff-tariffs-check-size, 14px) !important; padding: 0 !important; transform: none !important; width: var(--ff-tariffs-check-size, 14px) !important; } /* View Waybills pager finish. Page numbers already show the current page; hide only the duplicate Page X of Y text. */ body.ff-app .ff-view-waybills :is(#gridContainer, #gridContainer2) :is(.dx-pager, .dx-datagrid-pager) .dx-info { display: none !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } /* View Collections pager finish. Page numbers already show the current page; hide only the duplicate Page X of Y text. */ body.ff-app .ff-view-collections #gridContainer :is(.dx-pager, .dx-datagrid-pager) .dx-info { display: none !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } /* Portal grid pager standard. The numbered buttons already show the current page, so hide the duplicate Page X of Y text. */ body.ff-app .ff-page:is(.ff-query-grid-page, .ff-generate-manifest, .ff-generate-invoice, .ff-debriefing) :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer) :is(.dx-pager, .dx-datagrid-pager) .dx-info { display: none !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; overflow: hidden !important; padding: 0 !important; width: 0 !important; } /* View Quotes filter select alignment. Keep the dropdown/list fields level with the neighbouring text/date fields without changing the shared operations filter on other pages. */ body.ff-app .ff-view-quotes .ff-filter-flow-row > :is(.ff-filter-branch, .ff-filter-client, .ff-filter-agent, .ff-filter-service, .ff-filter-user) .form-group > .ff-ui.ui-select-bootstrap { display: block !important; margin-top: -4px !important; } body.ff-app .ff-view-quotes .ff-filter-flow-row > :is(.ff-filter-branch, .ff-filter-client, .ff-filter-agent, .ff-filter-service, .ff-filter-user) .form-group > .ff-ui.ui-select-bootstrap > .ui-select-match, body.ff-app .ff-view-quotes .ff-filter-flow-row > :is(.ff-filter-branch, .ff-filter-client, .ff-filter-agent, .ff-filter-service, .ff-filter-user) .form-group > .ff-ui.ui-select-bootstrap > .ui-select-match > .btn, body.ff-app .ff-view-quotes .ff-filter-flow-row > :is(.ff-filter-branch, .ff-filter-client, .ff-filter-agent, .ff-filter-service, .ff-filter-user) .form-group > .ff-ui.ui-select-bootstrap > .ui-select-match > .ui-select-toggle { align-items: center !important; display: flex !important; height: var(--ff-control-h, 34px) !important; line-height: var(--ff-control-h, 34px) !important; min-height: var(--ff-control-h, 34px) !important; } /* View Quotes viewport finish. Match the accepted content-aware view-grid pattern: grow the grid enough to show the current page rows, keep totals directly beneath the data, and group pager controls on the right without the duplicate Page X of Y text. */ body.ff-app .ff-view-quotes.ff-query-grid-page .ff-grid-result-row, body.ff-view-quotes-grid-viewport-active .ff-view-quotes.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-quotes.ff-query-grid-page .ff-grid-result-row > .col-md-12 { max-height: none !important; overflow: visible !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid.dx-datagrid, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid.dx-gridbase-container { height: var(--ff-view-quotes-grid-height-measured, auto) !important; max-height: var(--ff-view-quotes-grid-height-measured, none) !important; min-height: var(--ff-view-quotes-grid-height-measured, 180px) !important; overflow: visible !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-quotes-rows-height-measured, auto) !important; max-height: var(--ff-view-quotes-rows-height-measured, none) !important; min-height: var(--ff-view-quotes-rows-height-measured, 64px) !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; height: auto !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; min-height: 34px !important; overflow: visible !important; padding: 0 12px 6px !important; visibility: visible !important; width: 100% !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager .dx-info { display: none !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager .dx-selection { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 5px 0 !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding: 0 6px !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer.ff-quotes-viewport-grid .dx-pager .dx-navigate-button { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; transform: translateY(-3px) !important; vertical-align: middle !important; } /* View Quotes footer tally. The Quotes count is placed in a narrow leading summary cell, so do not let the generic compact footer ellipsis hide the count value. */ body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { overflow: visible !important; } body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer .dx-datagrid-total-footer td:first-child .dx-datagrid-summary-item, body.ff-app .ff-view-quotes.ff-query-grid-page #gridContainer .dx-datagrid-total-footer td:first-child :is(span, div) { display: inline-block !important; max-width: none !important; min-width: 112px !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; } /* Debtors grid standard. Match the accepted view-grid pattern: CSS owns density, row height, and command alignment; no post-render sizing scripts. */ body.ff-app .ff-debtors.ff-query-grid-page { --ff-grid-row-height: 26px; --ff-grid-cell-padding-y: 1px; --ff-debtors-select-column-width: 24px; --ff-debtors-command-column-width: 38px; --ff-debtors-grid-height: max(560px, calc(100dvh - 170px)); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-debtors.ff-query-grid-page, body.ff-app[data-grid-font-size="small"] .ff-debtors.ff-query-grid-page { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-debtors-select-column-width: 22px; --ff-debtors-command-column-width: 34px; --ff-debtors-grid-height: max(calc(100dvh - 128px), calc((var(--ff-grid-row-height) * 50) + 122px)); } body.ff-app[data-grid-font-size="large"] .ff-debtors.ff-query-grid-page { --ff-grid-row-height: 34px; --ff-grid-cell-padding-y: 2px; --ff-debtors-select-column-width: 26px; --ff-debtors-command-column-width: 44px; --ff-debtors-grid-height: max(600px, calc(100dvh - 185px)); } body.ff-app .ff-debtors.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-debtors.ff-query-grid-page > .container-fullw { padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results:not(.ng-hide), body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results:not(.ng-hide) .ff-grid-result-row, body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results:not(.ng-hide) .ff-grid-result-col { height: auto !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-row { margin: 0 0 4px !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-row::before, body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-row::after { content: none !important; display: none !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px 10px !important; min-height: 28px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-inner > :is(.label, .valuesonly, .checkbox-inline, .pull-right) { margin: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-inner > .label, body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-toolbar-inner .checkbox-inline { align-items: center !important; display: inline-flex !important; min-height: 24px !important; padding-top: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page .ff-debtors-results .ff-grid-actions-host { margin-left: auto !important; } body.ff-app .ff-debtors.ff-query-grid-page.ff-grid-tools-page #gridContainer .dx-datagrid-header-panel, body.ff-app .ff-debtors.ff-query-grid-page.ff-grid-tools-page #gridContainer .dx-datagrid-header-panel :is(.dx-toolbar, .dx-toolbar-items-container) { height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid { height: var(--ff-debtors-grid-height) !important; max-height: none !important; min-height: var(--ff-debtors-grid-height) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-gridbase-container { height: 100% !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-row, .dx-data-row), body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row > td, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-debtors-summary-command-col, .ff-debtors-detail-command-col) { box-sizing: border-box !important; height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-row > td > *, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-template-wrapper, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-text-content, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label) { box-sizing: border-box !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-grid-row-height) - 2px) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-debtors-summary-command-col, td.ff-debtors-detail-command-col) { line-height: 0 !important; overflow: visible !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-debtors-summary-command-col, td.ff-debtors-detail-command-col) :is(.dx-link, .dx-button, .dx-button-content, .dx-icon, .fa) { align-items: center !important; display: inline-flex !important; height: calc(var(--ff-grid-row-height) - 4px) !important; justify-content: center !important; line-height: calc(var(--ff-grid-row-height) - 6px) !important; margin: 0 auto !important; max-height: calc(var(--ff-grid-row-height) - 4px) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: relative !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .dx-command-select > td) { box-sizing: border-box !important; max-width: var(--ff-debtors-select-column-width) !important; min-width: var(--ff-debtors-select-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-debtors-select-column-width) !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { display: inline-flex !important; height: 14px !important; left: 50% !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; opacity: 1 !important; overflow: visible !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 14px !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-container { display: inline-flex !important; height: 14px !important; opacity: 1 !important; visibility: visible !important; width: 14px !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { background-color: var(--ff-surface, #fff) !important; border: 1px solid var(--ff-border, #9aa4b2) !important; box-sizing: border-box !important; display: block !important; height: 14px !important; opacity: 1 !important; visibility: visible !important; width: 14px !important; } /* Debriefing POD inline editor: make cell editing feel like typing in the cell. */ body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell { overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-button) { height: var(--ff-grid-row-height, 26px) !important; line-height: var(--ff-grid-row-height, 26px) !important; max-height: var(--ff-grid-row-height, 26px) !important; min-height: var(--ff-grid-row-height, 26px) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor { background: transparent !important; border-color: transparent !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor.dx-state-focused { box-shadow: inset 0 -2px 0 var(--ff-primary, #3478f6) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-input { background: transparent !important; padding-bottom: 0 !important; padding-left: 4px !important; padding-right: 4px !important; padding-top: 0 !important; } /* Tariffs absolute final viewport release. Keep this last: Tariffs must grow with the page, not clip its pager inside compact viewport guards. */ html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page > .container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 48px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, auto) !important; min-height: var(--ff-tariffs-grid-height-measured, 560px) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; max-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; min-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; height: auto !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding-bottom: 8px !important; position: relative !important; visibility: visible !important; z-index: 10 !important; } /* View Invoices absolute final fit. The invoice list is allowed to grow past the browser viewport; the page scrollbar then exposes the totals and page selector instead of clipping them. */ body.ff-app .ff-view-invoices.ff-query-grid-page { --ff-view-invoices-select-column-width: 26px; --ff-view-invoices-command-column-width: 24px; --ff-view-invoices-fixed-pane-width: calc(var(--ff-view-invoices-select-column-width) + var(--ff-view-invoices-command-column-width)); --ff-view-invoices-grid-height-fallback: max(820px, calc(100dvh - 170px)); --ff-view-invoices-grid-height-final: var(--ff-view-invoices-available-grid-height, var(--ff-view-invoices-grid-height-fallback)); --ff-view-invoices-grid-chrome-height-final: 188px; --ff-view-invoices-rows-height-final: var(--ff-view-invoices-rows-height-measured, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height-final))); min-height: 100dvh !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page.ff-view-compact { --ff-view-invoices-grid-height-fallback: max(900px, calc(100dvh - 150px)); --ff-view-invoices-grid-chrome-height-final: 162px; } html:has(body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) #app, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .app-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) #app > footer { display: block !important; } body.ff-app .main-content > .container:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid > .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { height: var(--ff-view-invoices-grid-height-final) !important; max-height: none !important; min-height: var(--ff-view-invoices-grid-height-final) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; position: relative !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-view-invoices-rows-height-final) !important; height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } /* View Images absolute final viewport fit. This block is intentionally after the invoice tail so View Images keeps the available page height and the DevExtreme scrollbar remains fully visible. */ body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-pager-height: 38px; --ff-image-search-grid-chrome-height: 132px; --ff-image-search-grid-height: clamp(640px, var(--ff-image-search-measured-grid-height, calc(100dvh - 182px)), 2200px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 10), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { height: var(--ff-image-search-grid-height) !important; max-height: var(--ff-image-search-grid-height) !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: var(--ff-image-search-rows-content-height-measured, 100%) !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable:not(.dx-scrollable-native) .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 0 !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; } /* Tariffs true end-of-file finish. This wins over the older Tariffs blocks above that still hide horizontal scrolling. */ body.ff-app .ff-tariffs.ff-query-grid-page { --ff-tariffs-horizontal-width: max(2600px, calc(100vw + 520px)) !important; --ff-tariffs-scrollbar-size: 15px !important; --ff-tariffs-grid-height-final: 560px !important; --ff-tariffs-grid-chrome-height-final: 132px !important; --ff-tariffs-rows-height-final: max(260px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page { --ff-tariffs-grid-height-final: 520px !important; --ff-tariffs-grid-chrome-height-final: 116px !important; --ff-tariffs-rows-height-final: max(240px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))) !important; } html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; padding-bottom: 8px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid:has(.dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; max-height: none !important; min-height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { border-bottom: 0 !important; flex: 0 0 var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; max-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; min-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; table-layout: fixed !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-tariffs-scrollbar-size) !important; left: 0 !important; right: var(--ff-tariffs-scrollbar-size) !important; z-index: 7 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-tariffs-scrollbar-size) !important; top: 0 !important; width: var(--ff-tariffs-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border-bottom-color: transparent !important; border-top-color: transparent !important; box-shadow: none !important; } /* Tariffs final viewport and scrollbar finish. Keep this at the end so older Tariffs blocks cannot hide horizontal scrolling again. */ body.ff-app .ff-tariffs.ff-query-grid-page { --ff-tariffs-horizontal-width: max(2600px, calc(100vw + 520px)); --ff-tariffs-scrollbar-size: 15px; --ff-tariffs-grid-height-final: 560px; --ff-tariffs-grid-chrome-height-final: 132px; --ff-tariffs-rows-height-final: max(260px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page { --ff-tariffs-grid-height-final: 520px; --ff-tariffs-grid-chrome-height-final: 116px; --ff-tariffs-rows-height-final: max(240px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))); } html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; padding-bottom: 8px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid:has(.dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; max-height: none !important; min-height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { border-bottom: 0 !important; flex: 0 0 var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; max-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; min-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; table-layout: fixed !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-tariffs-scrollbar-size) !important; left: 0 !important; right: var(--ff-tariffs-scrollbar-size) !important; z-index: 7 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-tariffs-scrollbar-size) !important; top: 0 !important; width: var(--ff-tariffs-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border-bottom-color: transparent !important; border-top-color: transparent !important; box-shadow: none !important; } /* Tariffs actual last-rule height guard. The shared compact query-grid selector is deliberately strong, so this page gets a stronger final rule that lets the browser page scroll expose the pager. */ body.ff-app .ff-tariffs.ff-query-grid-page { --ff-tariffs-grid-height-final: 560px; --ff-tariffs-grid-chrome-height-final: 136px; --ff-tariffs-rows-height-final: max(260px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))); } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page { --ff-tariffs-grid-height-final: 520px; --ff-tariffs-grid-chrome-height-final: 122px; --ff-tariffs-rows-height-final: max(240px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))); } html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; padding-bottom: 48px !important; } body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid:has(.dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; max-height: none !important; min-height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page.ff-view-compact:not(.ff-standard-grid-page):not(.ff-view-payments):not(.ff-debtors):not(.ff-view-manifests):not(.ff-view-manifests-simple):not(.ff-imaging-list):not(.ff-view-crdr):not(.ff-view-collections):not(.ff-capture-page):not(.ff-generate-invoice):not(.ff-generate-manifest):not(.ff-debriefing):not(.ff-view-manifest-routes) .ff-grid-result-row #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; max-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; min-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-total-footer .dx-datagrid-content, .dx-datagrid-total-footer .dx-datagrid-table, .dx-datagrid-total-footer .dx-row, .dx-datagrid-total-footer .dx-row > td) { height: auto !important; line-height: 28px !important; max-height: none !important; min-height: 30px !important; overflow: visible !important; vertical-align: middle !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { height: auto !important; line-height: 28px !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed > .dx-datagrid-table { max-width: var(--ff-view-invoices-fixed-pane-width) !important; min-width: var(--ff-view-invoices-fixed-pane-width) !important; width: var(--ff-view-invoices-fixed-pane-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed colgroup col:nth-child(n+3), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed .dx-datagrid-table tr > :is(th, td):nth-child(n+3) { border-left: 0 !important; border-right: 0 !important; box-sizing: border-box !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { max-width: var(--ff-view-invoices-select-column-width) !important; min-width: var(--ff-view-invoices-select-column-width) !important; width: var(--ff-view-invoices-select-column-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-invoice-view-command-col) { max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; width: var(--ff-view-invoices-command-column-width) !important; } /* View Invoices header/footer horizontal sync guard. Keep the header and total footer panes at the same scrollable width as the rows pane. */ body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { max-width: none !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; table-layout: fixed !important; } /* View Images end-of-file scrollbar and height guard. This must stay after every other grid block so compact-mode/native-scroll overrides cannot clip the View Images scrollbar again. */ body.ff-app .ff-imaging-list.ff-image-results-visible, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 32px !important; } body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-pager-height: 38px; --ff-image-search-grid-chrome-height: 132px; --ff-image-search-grid-height: clamp(1440px, var(--ff-image-search-measured-grid-height, calc(300dvh + 720px)), 7200px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 12), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: var(--ff-image-search-grid-height) !important; max-height: none !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; position: relative !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; overflow: hidden !important; position: relative !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-scrollable:not(.dx-scrollable-native) .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-scroll { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-image-search-scrollbar-size) !important; height: auto !important; max-height: none !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-image-search-scrollbar-size) !important; left: 0 !important; right: var(--ff-image-search-scrollbar-size) !important; z-index: 7 !important; } /* View Images final viewport fit. Fill the visible page, keep the page scrollbar available, and let the DevExtreme rows scrollbar expose the rest of the current page of results. */ body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-pager-height: 38px; --ff-image-search-grid-chrome-height: 132px; --ff-image-search-grid-height: clamp(640px, var(--ff-image-search-measured-grid-height, calc(100dvh - 182px)), 2200px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 10), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { height: var(--ff-image-search-grid-height) !important; max-height: var(--ff-image-search-grid-height) !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: var(--ff-image-search-rows-content-height-measured, 100%) !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable:not(.dx-scrollable-native) .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 0 !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; } /* View Invoices true end-of-file guard. Keep this after the Image Search scrollbar block, which contains a generic DevExtreme scroll-container override. */ body.ff-app .ff-view-invoices.ff-query-grid-page { --ff-view-invoices-select-column-width: 26px; --ff-view-invoices-command-column-width: 24px; --ff-view-invoices-fixed-pane-width: calc(var(--ff-view-invoices-select-column-width) + var(--ff-view-invoices-command-column-width)); --ff-view-invoices-grid-height-fallback: max(7200px, calc(720dvh + 1800px)); --ff-view-invoices-grid-height-final: var(--ff-view-invoices-available-grid-height, var(--ff-view-invoices-grid-height-fallback)); --ff-view-invoices-grid-chrome-height-final: 188px; --ff-view-invoices-rows-height-final: var(--ff-view-invoices-rows-height-measured, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height-final))); min-height: calc(var(--ff-view-invoices-grid-height-final) + 210px) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page { --ff-view-invoices-grid-height-fallback: max(10400px, calc(920dvh + 2400px)); --ff-view-invoices-grid-chrome-height-final: 162px; } html:has(body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) #app, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .app-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) #app > footer { display: block !important; } body.ff-app .main-content > .container:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid > .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { height: var(--ff-view-invoices-grid-height-final) !important; max-height: none !important; min-height: var(--ff-view-invoices-grid-height-final) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; position: relative !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-view-invoices-rows-height-final) !important; height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-total-footer .dx-datagrid-content, .dx-datagrid-total-footer .dx-datagrid-table, .dx-datagrid-total-footer .dx-row, .dx-datagrid-total-footer .dx-row > td) { height: auto !important; line-height: 28px !important; max-height: none !important; min-height: 30px !important; overflow: visible !important; vertical-align: middle !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { height: auto !important; line-height: 28px !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed > .dx-datagrid-table { max-width: var(--ff-view-invoices-fixed-pane-width) !important; min-width: var(--ff-view-invoices-fixed-pane-width) !important; width: var(--ff-view-invoices-fixed-pane-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed colgroup col:nth-child(n+3), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed .dx-datagrid-table tr > :is(th, td):nth-child(n+3) { border-left: 0 !important; border-right: 0 !important; box-sizing: border-box !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { max-width: var(--ff-view-invoices-select-column-width) !important; min-width: var(--ff-view-invoices-select-column-width) !important; width: var(--ff-view-invoices-select-column-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-invoice-view-command-col) { max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-image-search-pager-height) !important; height: var(--ff-image-search-pager-height) !important; max-height: none !important; min-height: var(--ff-image-search-pager-height) !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 8 !important; } /* View Images absolute final guard. Keep this at the end: older compact/result blocks above still contain native overflow rules, so this gives DevExtreme final ownership of the grid scrollbars. */ body.ff-app .ff-imaging-list.ff-image-results-visible, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 32px !important; } body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-pager-height: 38px; --ff-image-search-grid-chrome-height: 132px; --ff-image-search-grid-height: clamp(1440px, var(--ff-image-search-measured-grid-height, calc(300dvh + 720px)), 7200px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 12), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: var(--ff-image-search-grid-height) !important; max-height: none !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; position: relative !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; overflow: hidden !important; position: relative !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-scrollable:not(.dx-scrollable-native) .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-scroll { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-image-search-scrollbar-size) !important; height: auto !important; max-height: none !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-image-search-scrollbar-size) !important; left: 0 !important; right: var(--ff-image-search-scrollbar-size) !important; z-index: 7 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-image-search-pager-height) !important; height: var(--ff-image-search-pager-height) !important; max-height: none !important; min-height: var(--ff-image-search-pager-height) !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 8 !important; } /* Tariffs absolute final viewport release. Keep this last: Tariffs must grow with the page, not clip its pager inside compact viewport guards. */ html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page > .container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 48px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, auto) !important; min-height: var(--ff-tariffs-grid-height-measured, 560px) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; max-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; min-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; height: auto !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding-bottom: 8px !important; position: relative !important; visibility: visible !important; z-index: 10 !important; } /* Tariffs viewport release. This page should grow and use the page scrollbar; shared compact viewport guards clip the pager. */ html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page > .container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 40px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; overflow: visible !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { display: block !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; height: auto !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding-bottom: 8px !important; position: relative !important; visibility: visible !important; z-index: 10 !important; } /* Tariffs final compact alignment. Keep the fixed selector pane and scrollable pane on one row metric after the shared query-grid rules. */ body.ff-app .ff-tariffs.ff-query-grid-page { --ff-tariffs-final-row-height: var(--ff-grid-row-height, 26px); --ff-tariffs-final-cell-height: calc(var(--ff-tariffs-final-row-height) - 2px); --ff-tariffs-final-selector-width: var(--ff-grid-select-column-width, 26px); --ff-tariffs-final-check-size: var(--ff-tariffs-check-size, 14px); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-query-grid-page { --ff-grid-row-height: 26px; --ff-grid-select-column-width: 26px; --ff-tariffs-check-size: 14px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-tariffs.ff-query-grid-page, body.ff-app[data-grid-font-size="small"] .ff-tariffs.ff-query-grid-page { --ff-grid-row-height: 20px; --ff-grid-select-column-width: 24px; --ff-tariffs-check-size: 12px; } body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; overflow: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { min-height: 34px !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 8 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { min-height: 28px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; min-height: calc(var(--ff-tariffs-final-row-height) * 18) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-total-footer :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-total-footer :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-tariffs-final-row-height) !important; line-height: var(--ff-tariffs-final-cell-height) !important; max-height: var(--ff-tariffs-final-row-height) !important; min-height: var(--ff-tariffs-final-row-height) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) > *, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td:not(.dx-command-select):not(.dx-command-edit) :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; line-height: var(--ff-tariffs-final-cell-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-tariffs-final-cell-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select { box-sizing: border-box !important; height: var(--ff-tariffs-final-row-height) !important; line-height: 0 !important; max-height: var(--ff-tariffs-final-row-height) !important; max-width: var(--ff-tariffs-final-selector-width) !important; min-height: var(--ff-tariffs-final-row-height) !important; min-width: var(--ff-tariffs-final-selector-width) !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-tariffs-final-selector-width) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tariffs-final-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-tariffs-final-check-size) !important; margin: 0 !important; max-height: var(--ff-tariffs-final-check-size) !important; max-width: var(--ff-tariffs-final-check-size) !important; min-height: var(--ff-tariffs-final-check-size) !important; min-width: var(--ff-tariffs-final-check-size) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-tariffs-final-check-size) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-container, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox-icon { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tariffs-final-check-size) !important; justify-content: center !important; line-height: var(--ff-tariffs-final-check-size) !important; margin: 0 !important; max-height: var(--ff-tariffs-final-check-size) !important; max-width: var(--ff-tariffs-final-check-size) !important; min-height: var(--ff-tariffs-final-check-size) !important; min-width: var(--ff-tariffs-final-check-size) !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-tariffs-final-check-size) !important; } /* View Payments/Invoicing final viewport release. These pages now intentionally grow past the browser viewport; let the page scrollbar expose totals/paging instead of clipping the grid shell. */ html:has(body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid), html:has(body.ff-app .ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) #app, body.ff-app:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) #app, body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) .app-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) .app-content, body.ff-app:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid) .main-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) #app > footer { display: block !important; } body.ff-app .ff-view-payments.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > [class*="col-"], body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row > [class*="col-"], body.ff-app .main-content > .container:has(.ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid), body.ff-app .main-content > .container:has(.ff-view-invoices.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-view-viewport-grid) { max-height: none !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page { --ff-view-payments-command-column-width: 30px; --ff-view-payments-fixed-pane-width: calc(28px + var(--ff-view-payments-command-column-width)); } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-payments-view-command-col), body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-payments-view-command-col) > td, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-content-fixed colgroup col:nth-child(2) { box-sizing: border-box !important; max-width: var(--ff-view-payments-command-column-width) !important; min-width: var(--ff-view-payments-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-payments-command-column-width) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer:has(.ff-payments-view-command-col) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { max-width: var(--ff-view-payments-fixed-pane-width) !important; min-width: var(--ff-view-payments-fixed-pane-width) !important; width: var(--ff-view-payments-fixed-pane-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer { --ff-view-invoices-fixed-pane-width: calc(var(--ff-view-invoices-select-column-width, 26px) + var(--ff-view-invoices-command-column-width, 24px)); } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-invoice-view-command-col), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-invoice-view-command-col) > td, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed colgroup col:nth-child(2) { box-sizing: border-box !important; max-width: var(--ff-view-invoices-command-column-width, 24px) !important; min-width: var(--ff-view-invoices-command-column-width, 24px) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-invoices-command-column-width, 24px) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer:has(.ff-invoice-view-command-col) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { max-width: var(--ff-view-invoices-fixed-pane-width) !important; min-width: var(--ff-view-invoices-fixed-pane-width) !important; width: var(--ff-view-invoices-fixed-pane-width) !important; } body.ff-app .ff-debriefing-pod-date-popup .dx-popup-content { overflow: visible !important; } body.ff-app .ff-debriefing-pod-date-popup .dx-timeview-field { align-items: center !important; display: flex !important; gap: 10px !important; justify-content: center !important; } body.ff-app .ff-debriefing-pod-date-popup .dx-timeview-field .dx-numberbox { min-width: 92px !important; width: 92px !important; } body.ff-app .ff-debriefing-pod-date-popup .dx-timeview-field .dx-numberbox .dx-texteditor-input { min-width: 42px !important; padding-left: 8px !important; padding-right: 8px !important; text-align: center !important; } body.ff-app .ff-debriefing-pod-date-popup .dx-timeview-field .dx-numberbox-spin-container { min-width: 32px !important; width: 32px !important; } /* Debtors legacy fit: keep the old free-height behavior only before the page opts into the shared standard grid. */ body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid), body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid).dx-datagrid, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) > .dx-datagrid, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: visible !important; scrollbar-gutter: stable !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .dx-scrollable-content { display: block !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-total-footer, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-pager, body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-pager { margin-top: 0 !important; position: relative !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .ff-grid-boolean-checkbox { align-items: center !important; display: inline-flex !important; height: var(--ff-debtors-check-size, 16px) !important; justify-content: center !important; line-height: var(--ff-debtors-check-size, 16px) !important; margin: 0 auto !important; max-height: var(--ff-debtors-check-size, 16px) !important; max-width: var(--ff-debtors-check-size, 16px) !important; min-height: var(--ff-debtors-check-size, 16px) !important; min-width: var(--ff-debtors-check-size, 16px) !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-debtors-check-size, 16px) !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-debtors-check-size, 16px) !important; justify-content: center !important; line-height: var(--ff-debtors-check-size, 16px) !important; margin: 0 !important; max-height: var(--ff-debtors-check-size, 16px) !important; max-width: var(--ff-debtors-check-size, 16px) !important; min-height: var(--ff-debtors-check-size, 16px) !important; min-width: var(--ff-debtors-check-size, 16px) !important; padding: 0 !important; position: static !important; transform: none !important; width: var(--ff-debtors-check-size, 16px) !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox-icon { background-color: var(--ff-surface, #fff) !important; border: 1px solid var(--ff-border, #9aa4b2) !important; border-radius: 3px !important; } body.ff-app .ff-debtors.ff-query-grid-page #gridContainer:not(.ff-standard-grid) .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { color: var(--ff-primary, #3478f6) !important; font-size: calc(var(--ff-debtors-check-size, 16px) - 2px) !important; line-height: calc(var(--ff-debtors-check-size, 16px) - 2px) !important; } /* View Payments final fit: square boolean checks and use the available page height. */ body.ff-app .ff-view-payments.ff-query-grid-page { --ff-payments-check-size: 18px; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-payments.ff-query-grid-page, body.ff-app[data-grid-font-size="small"] .ff-view-payments.ff-query-grid-page { --ff-payments-check-size: 16px; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-query-grid-page { --ff-payments-check-size: 20px; } body.ff-app .ff-view-payments.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-gridbase-container { height: var(--ff-payments-grid-height-measured, auto) !important; max-height: var(--ff-payments-grid-height-measured, none) !important; min-height: var(--ff-payments-grid-height-measured, 220px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-native .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { box-sizing: border-box !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-payments-check-size, 18px) !important; justify-content: center !important; line-height: var(--ff-payments-check-size, 18px) !important; margin: 0 auto !important; max-height: var(--ff-payments-check-size, 18px) !important; max-width: var(--ff-payments-check-size, 18px) !important; min-height: var(--ff-payments-check-size, 18px) !important; min-width: var(--ff-payments-check-size, 18px) !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; visibility: visible !important; width: var(--ff-payments-check-size, 18px) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox { align-items: center !important; display: inline-flex !important; height: var(--ff-payments-check-size, 18px) !important; justify-content: center !important; line-height: var(--ff-payments-check-size, 18px) !important; margin: 0 auto !important; max-height: var(--ff-payments-check-size, 18px) !important; max-width: var(--ff-payments-check-size, 18px) !important; min-height: var(--ff-payments-check-size, 18px) !important; min-width: var(--ff-payments-check-size, 18px) !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-payments-check-size, 18px) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-payments-check-size, 18px) !important; justify-content: center !important; line-height: var(--ff-payments-check-size, 18px) !important; margin: 0 !important; max-height: var(--ff-payments-check-size, 18px) !important; max-width: var(--ff-payments-check-size, 18px) !important; min-height: var(--ff-payments-check-size, 18px) !important; min-width: var(--ff-payments-check-size, 18px) !important; opacity: 1 !important; padding: 0 !important; position: static !important; transform: none !important; width: var(--ff-payments-check-size, 18px) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox-icon { background-color: var(--ff-surface, #fff) !important; border: 1px solid var(--ff-border, #9aa4b2) !important; border-radius: 3px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before { color: var(--ff-primary, #3478f6) !important; font-size: calc(var(--ff-payments-check-size, 18px) - 2px) !important; line-height: calc(var(--ff-payments-check-size, 18px) - 2px) !important; } /* View Tracking final viewport fit: mirror View Manifests measured grid/rows contract. */ body.ff-app.ff-tracking-grid-viewport-active, body.ff-app.ff-tracking-grid-viewport-active #app { height: auto !important; min-height: 100dvh !important; overflow-x: hidden !important; overflow-y: auto !important; } body.ff-app.ff-tracking-grid-viewport-active .app-content, body.ff-app.ff-tracking-grid-viewport-active .main-content, body.ff-app.ff-tracking-grid-viewport-active .main-content > .container { height: auto !important; min-height: 100dvh !important; overflow-x: visible !important; overflow-y: visible !important; overflow: visible !important; padding-bottom: 0 !important; } body.ff-app.ff-tracking-grid-viewport-active .ff-view-tracking.ff-query-grid-page { min-height: calc(100dvh + 520px) !important; } body.ff-app .ff-view-tracking.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-tracking.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-tracking.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid.dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid > .dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-gridbase-container { height: var(--ff-view-grid-height-measured, auto) !important; max-height: var(--ff-view-grid-height-measured, none) !important; min-height: var(--ff-view-grid-height-measured, 260px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-view-grid-rows-height-measured, auto) !important; max-height: var(--ff-view-grid-rows-height-measured, none) !important; min-height: var(--ff-view-grid-rows-height-measured, 120px) !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: var(--ff-view-grid-rows-content-height-measured, 100%) !important; overflow: visible !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-tracking.ff-query-grid-page #gridContainer.ff-view-grid-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: flex !important; flex: 0 0 auto !important; position: relative !important; visibility: visible !important; z-index: 1 !important; } /* Image Search final viewport fit. The populated grid deliberately extends past Chrome's visible bottom so the pager does not sit above a large blank band on shorter result pages. */ body.ff-app.ff-image-grid-viewport-active, body.ff-app.ff-image-grid-viewport-active #app { height: auto !important; min-height: 100dvh !important; overflow-x: hidden !important; overflow-y: auto !important; } body.ff-app.ff-image-grid-viewport-active .app-content, body.ff-app.ff-image-grid-viewport-active .main-content, body.ff-app.ff-image-grid-viewport-active .main-content > .container { height: auto !important; min-height: 100dvh !important; overflow: visible !important; overflow-x: visible !important; overflow-y: visible !important; padding-bottom: 0 !important; } body.ff-app.ff-image-grid-viewport-active .ff-imaging-list.ff-query-grid-page { min-height: calc(100dvh + 240px) !important; } body.ff-app .ff-imaging-list.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-query-grid-page > .container-fullw, body.ff-app .ff-imaging-list.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid.dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid > .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-gridbase-container { height: var(--ff-image-search-measured-grid-height, var(--ff-image-search-grid-height, auto)) !important; max-height: var(--ff-image-search-measured-grid-height, var(--ff-image-search-grid-height, none)) !important; min-height: var(--ff-image-search-measured-grid-height, var(--ff-image-search-grid-height, 360px)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-image-search-rows-height-measured, var(--ff-image-search-rows-height, auto)) !important; max-height: var(--ff-image-search-rows-height-measured, var(--ff-image-search-rows-height, none)) !important; min-height: var(--ff-image-search-rows-height-measured, var(--ff-image-search-rows-height, 120px)) !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: var(--ff-image-search-rows-content-height-measured, 100%) !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: flex !important; flex: 0 0 auto !important; position: relative !important; visibility: visible !important; z-index: 1 !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select { line-height: 0 !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select > :is(.dx-checkbox, .dx-select-checkbox), body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select .dx-select-checkbox.dx-checkbox { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-search-selector-size, 14px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-image-search-selector-size, 14px) !important; margin: 0 !important; max-height: var(--ff-image-search-selector-size, 14px) !important; max-width: var(--ff-image-search-selector-size, 14px) !important; min-height: var(--ff-image-search-selector-size, 14px) !important; min-width: var(--ff-image-search-selector-size, 14px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-image-search-selector-size, 14px) !important; } body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-search-selector-size, 14px) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-image-search-selector-size, 14px) !important; margin: 0 !important; max-height: var(--ff-image-search-selector-size, 14px) !important; max-width: var(--ff-image-search-selector-size, 14px) !important; min-height: var(--ff-image-search-selector-size, 14px) !important; min-width: var(--ff-image-search-selector-size, 14px) !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; width: var(--ff-image-search-selector-size, 14px) !important; } /* Image Search hard fallback. Results-visible is the reliable page signal Basil sees; do not wait for the measured viewport class before giving Chrome a taller, scrollable grid. */ body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: max(1180px, calc(100dvh + 620px)) !important; --ff-image-search-grid-chrome-height: 128px !important; --ff-image-search-horizontal-width: max(2600px, calc(100vw + 520px)) !important; --ff-image-search-pager-height: 38px !important; --ff-image-search-rows-height: calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height)) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-chrome-height: 116px !important; --ff-image-search-pager-height: 34px !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { height: var(--ff-image-search-grid-height) !important; max-height: none !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-headers, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-headers .dx-datagrid-content, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-image-search-horizontal-width) !important; width: var(--ff-image-search-horizontal-width) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-image-search-horizontal-width) !important; table-layout: fixed !important; width: var(--ff-image-search-horizontal-width) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: 14px !important; left: 0 !important; right: 16px !important; z-index: 6 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-image-search-pager-height) !important; height: var(--ff-image-search-pager-height) !important; max-height: none !important; min-height: var(--ff-image-search-pager-height) !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 7 !important; } body.ff-app .ff-imaging-list .ff-image-loading-row { margin-bottom: 8px !important; margin-top: 0 !important; } body.ff-app .ff-imaging-list .ff-image-loading-banner { align-items: center !important; background: var(--surface, var(--ff-surface, #ffffff)) !important; border: 1px solid var(--border-color, var(--ff-border, #d6dde8)) !important; border-left: 4px solid var(--ff-primary, var(--primary, #367bf5)) !important; border-radius: 4px !important; color: var(--text, var(--ff-text, #263238)) !important; display: flex !important; font-size: 13px !important; font-weight: 600 !important; gap: 8px !important; line-height: 20px !important; min-height: 34px !important; padding: 6px 10px !important; } body.ff-app .ff-imaging-list .ff-image-loading-banner .fa { color: var(--ff-primary, var(--primary, #367bf5)) !important; font-size: 14px !important; } /* Image Search final height and scrollbar lock. The controller measures the old usable height; this doubles it and keeps DevExtreme, not browser overflow, responsible for both grid scrollbars. */ body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-grid-height: clamp(720px, var(--ff-image-search-measured-grid-height, calc(200dvh + 1240px)), 6400px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 8), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height, 128px))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-scroll, body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-scroll { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-query-grid-page #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 14px !important; height: auto !important; max-height: none !important; top: 0 !important; width: 15px !important; } /* Statement Month End Transaction Summary: use the page as a focused grid view. */ body.ff-app .ff-statement.ff-statement-transaction-summary-mode > .container-fluid.container-fullw, body.ff-app .ff-statement.ff-statement-transaction-summary-mode > .container-fullw { min-height: calc(100dvh - 72px) !important; padding-bottom: 8px !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-statement-result-section { margin-top: 0 !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-statement-result-fieldset { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 8px !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; min-width: 0 !important; } body.ff-app .ff-statement .ff-grid-toolbar-inner .ff-statement-summary-actions { align-items: center !important; display: inline-flex !important; gap: 6px !important; margin-left: auto !important; min-width: 0 !important; white-space: nowrap !important; } body.ff-app .ff-statement .ff-grid-toolbar-inner .ff-statement-summary-actions .ff-grid-actions-host { margin-left: 0 !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-statement-summary-back { align-items: center !important; display: inline-flex !important; gap: 6px !important; height: 30px !important; line-height: 1 !important; margin: 0 !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-grid-result-row, body.ff-app .ff-statement.ff-statement-transaction-summary-mode .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid.dx-datagrid, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid > .dx-datagrid, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-gridbase-container { height: var(--ff-statement-summary-grid-height, auto) !important; max-height: var(--ff-statement-summary-grid-height, none) !important; min-height: var(--ff-statement-summary-grid-height, 320px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { min-height: 120px !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; min-width: var(--ff-statement-summary-horizontal-width, 100%) !important; width: var(--ff-statement-summary-horizontal-width, auto) !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-statement-summary-horizontal-width, 100%) !important; width: var(--ff-statement-summary-horizontal-width, auto) !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, .dx-command-select) { max-width: 28px !important; min-width: 28px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 28px !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container) { margin-left: auto !important; margin-right: auto !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-statement.ff-statement-transaction-summary-mode #gridContainer.ff-statement-summary-viewport-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: flex !important; flex: 0 0 auto !important; position: relative !important; visibility: visible !important; z-index: 1 !important; } /* View Payments: keep DevExtreme in charge of both scrollbars and the row panes. */ body.ff-app .ff-view-payments.ff-query-grid-page { --ff-payments-fallback-grid-height: max(870px, calc(100dvh + 180px)); min-height: 100dvh !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-payments.ff-query-grid-page { --ff-payments-fallback-grid-height: max(1650px, calc(100dvh + 900px)); min-height: calc(100dvh + 1100px) !important; } body.ff-app .ff-view-payments.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > .col-md-12 { max-height: none !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-gridbase-container { height: var(--ff-payments-grid-height-measured, auto) !important; max-height: var(--ff-payments-grid-height-measured, none) !important; min-height: var(--ff-payments-grid-height-measured, 320px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview .dx-scrollable-native .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 0 !important; right: 0 !important; top: 0 !important; z-index: 7 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; left: 0 !important; right: 16px !important; z-index: 7 !important; } /* View Payments row visibility fallback. Payments is excluded from the shared compact-grid height rules, so keep only the row display safety net here without re-adding compact height caps. */ body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-gridbase-container { height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; max-height: none !important; min-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { max-height: none !important; min-height: 28px !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 8 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; justify-content: flex-end !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; min-height: calc(var(--ff-grid-row-height, 26px) * 18) !important; overflow: hidden !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { display: table-row !important; visibility: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { display: table-cell !important; visibility: visible !important; } /* Shared add/edit grid inline editor. Keep compact rows tight, but let the actual editor render clean corners while typing. */ body.ff-app .dx-datagrid .dx-datagrid-rowsview td.dx-editor-cell { overflow: visible !important; padding: 1px 3px !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview td.dx-editor-cell :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container, .dx-dropdowneditor-button) { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; line-height: calc(var(--ff-grid-row-height, 26px) - 4px) !important; max-height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor { border-radius: 3px !important; margin: 0 !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-input { box-sizing: border-box !important; height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; line-height: calc(var(--ff-grid-row-height, 26px) - 4px) !important; max-height: calc(var(--ff-grid-row-height, 26px) - 2px) !important; min-height: 0 !important; padding: 0 6px !important; } /* Debriefing POD keeps its transparent cell editor. */ body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell { overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input, .dx-dropdowneditor-button) { height: var(--ff-grid-row-height, 26px) !important; line-height: var(--ff-grid-row-height, 26px) !important; max-height: var(--ff-grid-row-height, 26px) !important; min-height: var(--ff-grid-row-height, 26px) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor { background: transparent !important; border-color: transparent !important; border-radius: 0 !important; box-shadow: none !important; margin: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor.dx-state-focused { box-shadow: inset 0 -2px 0 var(--ff-primary, #3478f6) !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-input { background: transparent !important; padding-bottom: 0 !important; padding-left: 4px !important; padding-right: 4px !important; padding-top: 0 !important; } /* Tariffs absolute final viewport release. Keep this last: Tariffs must grow with the page, not clip its pager inside compact viewport guards. */ html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page > .container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 48px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, auto) !important; min-height: var(--ff-tariffs-grid-height-measured, 560px) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; max-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; min-height: var(--ff-tariffs-rows-height-measured, max(260px, calc(var(--ff-tariffs-grid-height-measured, 560px) - var(--ff-tariffs-grid-chrome-height, 136px)))) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; height: auto !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding-bottom: 8px !important; position: relative !important; visibility: visible !important; z-index: 10 !important; } /* Debriefing final page-flow recovery. Keep the grid chrome visible while letting the page end after the grid footer. */ html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .main-content, html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid .dx-datagrid) .main-content, html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 0 !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid), body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-viewport-grid), body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer .dx-datagrid), body.ff-app .ff-debriefing.ff-query-grid-page, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-toolbar-row, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-debriefing.ff-query-grid-page #page-title.ff-page-header, body.ff-app .ff-debriefing.ff-query-grid-page .ff-trip-expenses, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-toolbar-row, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer) { display: block !important; opacity: 1 !important; position: relative !important; visibility: visible !important; z-index: 5 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer :is(.dx-datagrid-pager, .dx-pager) { display: flex !important; opacity: 1 !important; position: relative !important; visibility: visible !important; z-index: 5 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-gridbase-container { max-height: none !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; min-height: calc(var(--ff-grid-row-height, 20px) * 12) !important; overflow: hidden !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; } /* View Images true end-of-file scrollbar and height guard. Keep this after every other grid block so compact/native-scroll overrides cannot clip the View Images scrollbar again. */ body.ff-app .ff-imaging-list.ff-image-results-visible, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-image-results-visible .ff-grid-result-row > .col-md-12 { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 32px !important; } body.ff-app .ff-imaging-list.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-pager-height: 38px; --ff-image-search-grid-chrome-height: 132px; --ff-image-search-grid-height: clamp(1440px, var(--ff-image-search-measured-grid-height, calc(300dvh + 720px)), 7200px) !important; --ff-image-search-rows-height: max(calc(var(--ff-image-search-row-height-final, var(--ff-grid-row-height, 20px)) * 12), calc(var(--ff-image-search-grid-height) - var(--ff-image-search-grid-chrome-height))) !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer.dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer > .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: var(--ff-image-search-grid-height) !important; max-height: none !important; min-height: var(--ff-image-search-grid-height) !important; overflow: hidden !important; position: relative !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: var(--ff-image-search-rows-height) !important; max-height: var(--ff-image-search-rows-height) !important; min-height: var(--ff-image-search-rows-height) !important; overflow: hidden !important; position: relative !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-scrollable:not(.dx-scrollable-native) .dx-scrollable-container, body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview .dx-scrollable-scroll { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-image-search-scrollbar-size) !important; height: auto !important; max-height: none !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-imaging-list.ff-image-results-visible #gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-image-search-scrollbar-size) !important; left: 0 !important; right: var(--ff-image-search-scrollbar-size) !important; z-index: 7 !important; } /* View Invoices actual last-rule override. This sits after all generic DevExtreme scrollbar rules. */ body.ff-app .ff-view-invoices.ff-query-grid-page { --ff-view-invoices-select-column-width: 26px; --ff-view-invoices-command-column-width: 24px; --ff-view-invoices-fixed-pane-width: calc(var(--ff-view-invoices-select-column-width) + var(--ff-view-invoices-command-column-width)); --ff-view-invoices-grid-height-fallback: max(820px, calc(100dvh - 170px)); --ff-view-invoices-grid-height-final: var(--ff-view-invoices-available-grid-height, var(--ff-view-invoices-grid-height-fallback)); --ff-view-invoices-grid-chrome-height-final: 188px; --ff-view-invoices-rows-height-final: var(--ff-view-invoices-rows-height-measured, calc(var(--ff-view-invoices-grid-height-final) - var(--ff-view-invoices-grid-chrome-height-final))); min-height: 100dvh !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page.ff-view-compact { --ff-view-invoices-grid-height-fallback: max(900px, calc(100dvh - 150px)); --ff-view-invoices-grid-chrome-height-final: 162px; } html:has(body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) #app, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .app-content, body.ff-app:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid), body.ff-app .ff-view-invoices.ff-query-grid-page, body.ff-app .ff-view-invoices.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-invoices.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid > .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { height: var(--ff-view-invoices-grid-height-final) !important; max-height: none !important; min-height: var(--ff-view-invoices-grid-height-final) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid.dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-view-invoices-rows-height-final) !important; height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { height: var(--ff-view-invoices-rows-height-final) !important; max-height: var(--ff-view-invoices-rows-height-final) !important; min-height: var(--ff-view-invoices-rows-height-final) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) > .dx-datagrid-table, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview .dx-scrollable-content { min-width: var(--ff-view-invoices-horizontal-width, 100%) !important; width: var(--ff-view-invoices-horizontal-width, 100%) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-datagrid-content:not(.dx-datagrid-content-fixed), .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) { display: none !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview .dx-scrollable-scroll { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: 15px !important; left: 0 !important; right: 15px !important; z-index: 7 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-compact-crop .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 15px !important; top: 0 !important; width: 15px !important; z-index: 6 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { height: auto !important; line-height: 28px !important; max-height: none !important; overflow: visible !important; text-overflow: clip !important; white-space: nowrap !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed > .dx-datagrid-table { display: none !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed colgroup col:nth-child(n+3), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer .dx-datagrid-content-fixed .dx-datagrid-table tr > :is(th, td):nth-child(n+3) { border-left: 0 !important; border-right: 0 !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) td.dx-command-select { max-width: var(--ff-view-invoices-select-column-width) !important; min-width: var(--ff-view-invoices-select-column-width) !important; width: var(--ff-view-invoices-select-column-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, .ff-invoice-view-command-col) { max-width: var(--ff-view-invoices-command-column-width) !important; min-width: var(--ff-view-invoices-command-column-width) !important; width: var(--ff-view-invoices-command-column-width) !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer.ff-invoice-view-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-view-invoices.ff-query-grid-page #clientGridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) > .dx-datagrid-table { left: 0 !important; margin-left: 0 !important; padding-left: 0 !important; } /* View Images actual last-rule override. Mirrors View Invoices: the page grows with the grid instead of clipping it. */ body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible { --ff-image-search-scrollbar-size: 15px; --ff-image-search-grid-height-fallback: max(820px, calc(100dvh - 170px)); --ff-image-search-grid-height-final: var(--ff-image-search-available-grid-height, var(--ff-image-search-measured-grid-height, var(--ff-image-search-grid-height-fallback))); --ff-image-search-grid-chrome-height-final: 132px; --ff-image-search-rows-height-final: var(--ff-image-search-rows-height-measured, calc(var(--ff-image-search-grid-height-final) - var(--ff-image-search-grid-chrome-height-final))); min-height: 100dvh !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-query-grid-page.ff-image-results-visible, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-view-compact.ff-image-results-visible { --ff-image-search-grid-height-fallback: max(1240px, calc(100dvh + 170px)); --ff-image-search-grid-chrome-height-final: 118px; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible > .container-fluid.container-fullw, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible [block-ui], body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible .ff-grid-result-row, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid.dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid > .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-gridbase-container { height: var(--ff-image-search-grid-height-final) !important; max-height: none !important; min-height: var(--ff-image-search-grid-height-final) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid.dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid, body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-image-search-rows-height-final) !important; height: var(--ff-image-search-rows-height-final) !important; max-height: var(--ff-image-search-rows-height-final) !important; min-height: var(--ff-image-search-rows-height-final) !important; overflow: hidden !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; min-width: var(--ff-image-search-horizontal-width, 100%) !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-imaging-list.ff-query-grid-page.ff-image-results-visible #gridContainer.ff-image-search-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: 0 !important; top: 0 !important; width: var(--ff-image-search-scrollbar-size) !important; } /* Tariffs true end-of-file finish. This wins over the older Tariffs blocks above that still hide horizontal scrolling. */ body.ff-app .ff-tariffs.ff-query-grid-page { --ff-tariffs-horizontal-width: max(2600px, calc(100vw + 520px)) !important; --ff-tariffs-scrollbar-size: 15px !important; --ff-tariffs-grid-height-final: 560px !important; --ff-tariffs-grid-chrome-height-final: 132px !important; --ff-tariffs-rows-height-final: max(260px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))) !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-tariffs.ff-query-grid-page { --ff-tariffs-grid-height-final: 520px !important; --ff-tariffs-grid-chrome-height-final: 116px !important; --ff-tariffs-rows-height-final: max(240px, calc(var(--ff-tariffs-grid-height-final) - var(--ff-tariffs-grid-chrome-height-final))) !important; } html:has(body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) #app, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 100dvh !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page, body.ff-app .ff-tariffs.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-tariffs.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; overflow: visible !important; padding-bottom: 8px !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid:has(.dx-datagrid), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid.dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid > .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; max-height: none !important; min-height: var(--ff-tariffs-grid-height-measured, var(--ff-tariffs-grid-height-final)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid, body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { border-bottom: 0 !important; flex: 0 0 var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; max-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; min-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; overflow: hidden !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width) !important; table-layout: fixed !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: var(--ff-tariffs-scrollbar-size) !important; left: 0 !important; right: var(--ff-tariffs-scrollbar-size) !important; z-index: 7 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { bottom: var(--ff-tariffs-scrollbar-size) !important; top: 0 !important; width: var(--ff-tariffs-scrollbar-size) !important; z-index: 6 !important; } body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border-bottom-color: transparent !important; border-top-color: transparent !important; box-shadow: none !important; } /* Tariffs row viewport content-fit override. Keep this at EOF so the footer can sit below the last rendered Tariff row. */ body.ff-app .ff-tariffs.ff-query-grid-page #gridContainer.ff-tariffs-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; max-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; min-height: var(--ff-tariffs-rows-height-measured, var(--ff-tariffs-rows-height-final)) !important; } /* Query page final viewport finish. Keep the external toolbar tools visible, reserve real footer space for the totals/pager, and center compact selector checkboxes in the tighter rows. */ body.ff-app .ff-query.ff-query-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; min-height: 28px !important; } body.ff-app .ff-query.ff-query-grid-page .ff-grid-toolbar-row .ff-grid-actions-host { margin-left: auto !important; } html body.ff-app .ff-query.ff-query-grid-page:not(.ff-query-has-data):not(.ff-query-loading) .ff-grid-toolbar-row, html body.ff-app .ff-query.ff-query-grid-page:not(.ff-query-has-data):not(.ff-query-loading) .ff-grid-result-row { display: none !important; } html body.ff-app .ff-query.ff-query-grid-page:not(.ff-query-has-data) #gridContainer.ff-standard-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: none !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid.dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid > .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-gridbase-container { height: var(--ff-query-grid-height, auto) !important; max-height: var(--ff-query-grid-height, none) !important; min-height: var(--ff-query-grid-height, 260px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-total-footer { min-height: 30px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; justify-content: flex-end !important; line-height: 30px !important; max-height: none !important; min-height: 48px !important; overflow: visible !important; padding: 4px 12px 12px !important; width: 100% !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid :is(.dx-datagrid-pager, .dx-pager) { line-height: 28px !important; min-height: 42px !important; padding-bottom: 10px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; align-self: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager :is(.dx-page, .dx-page-size) { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; overflow: visible !important; padding: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager .dx-selection { height: 20px !important; line-height: 20px !important; margin: 4px 0 !important; max-height: 20px !important; min-height: 20px !important; padding: 0 7px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-pager .dx-navigate-button { align-items: center !important; display: inline-flex !important; height: 26px !important; justify-content: center !important; line-height: 26px !important; margin: 0 !important; max-height: 26px !important; min-height: 26px !important; overflow: visible !important; padding: 0 !important; transform: none !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-query-grid-rows-height, 160px) !important; height: var(--ff-query-grid-rows-height, 160px) !important; max-height: var(--ff-query-grid-rows-height, 160px) !important; min-height: var(--ff-query-grid-rows-height, 72px) !important; overflow: hidden !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: none !important; min-height: 100% !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-viewport-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; box-shadow: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select { box-sizing: border-box !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox), body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select.dx-checkbox, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select.dx-select-checkbox, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select input[type="checkbox"] { align-items: center !important; display: inline-flex !important; height: 14px !important; justify-content: center !important; left: 50% !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; overflow: visible !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: 14px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; display: inline-flex !important; height: 14px !important; justify-content: center !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; width: 14px !important; } /* Generate Invoice final pager and bottom-indicator standard. Keep page sizes and page numbers grouped on the right, and suppress the old DevExtreme bottom load panel that can paint as a double X below the totals. */ body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; min-height: 38px !important; overflow: visible !important; padding: 2px 12px 8px !important; width: 100% !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-info { display: none !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; align-self: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-page-sizes { margin-left: auto !important; margin-right: 6px !important; order: 1 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-pages { gap: 2px !important; justify-content: center !important; order: 2 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 1px !important; max-height: 24px !important; min-height: 24px !important; min-width: 24px !important; overflow: visible !important; padding: 0 6px !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-selection { background-color: var(--ff-primary, #367bf5) !important; border-color: var(--ff-primary, #367bf5) !important; border-radius: 6px !important; color: #fff !important; height: 18px !important; line-height: 18px !important; margin: 5px 2px !important; max-height: 18px !important; min-height: 18px !important; padding: 0 8px !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-pager .dx-navigate-button { padding: 0 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row > td { box-sizing: border-box !important; height: 26px !important; line-height: 22px !important; min-height: 26px !important; overflow: visible !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row .dx-editor-cell { padding-left: 6px !important; padding-right: 6px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor, .dx-textbox, .dx-datebox, .dx-dropdowneditor) { box-sizing: border-box !important; height: 22px !important; line-height: 20px !important; margin: 0 !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input-container, .dx-dropdowneditor-input-wrapper) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 20px !important; line-height: 20px !important; max-height: 20px !important; min-height: 20px !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row .dx-texteditor-input { box-sizing: border-box !important; font-size: var(--ff-control-font-size, 12px) !important; height: 20px !important; line-height: 18px !important; margin: 0 !important; max-height: 20px !important; min-height: 20px !important; padding: 1px 6px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer) .dx-datagrid-filter-row :is(.dx-dropdowneditor-button, .dx-button-content, .dx-dropdowneditor-icon, .dx-icon-event) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 20px !important; justify-content: center !important; line-height: 18px !important; margin: 0 !important; max-height: 20px !important; min-height: 20px !important; padding: 0 !important; width: 22px !important; } /* Query grid EOF override. This is intentionally last so shared grid/footer rules cannot push the pager below the viewport or recreate a blank rows area above the totals. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid > .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-gridbase-container { height: var(--ff-query-grid-height, auto) !important; max-height: var(--ff-query-grid-height, none) !important; min-height: var(--ff-query-grid-height, 220px) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-query-grid-rows-height, 160px) !important; height: var(--ff-query-grid-rows-height, 160px) !important; max-height: var(--ff-query-grid-rows-height, 160px) !important; min-height: var(--ff-query-grid-rows-height, 72px) !important; overflow: hidden !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-query-grid-rows-height, 160px) !important; max-height: var(--ff-query-grid-rows-height, 160px) !important; min-height: var(--ff-query-grid-rows-height, 72px) !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; box-shadow: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { max-height: none !important; overflow: visible !important; visibility: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; justify-content: flex-end !important; line-height: 30px !important; min-height: 48px !important; padding: 4px 12px 12px !important; width: 100% !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid :is(.dx-datagrid-pager, .dx-pager) { line-height: 28px !important; min-height: 42px !important; padding-bottom: 10px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; align-self: center !important; display: inline-flex !important; float: none !important; height: 28px !important; line-height: 28px !important; margin: 0 !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; white-space: nowrap !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; display: inline-flex !important; height: 26px !important; justify-content: center !important; line-height: 26px !important; margin: 0 2px !important; min-height: 26px !important; min-width: 24px !important; overflow: visible !important; padding: 0 6px !important; transform: none !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-selection { height: 20px !important; line-height: 20px !important; margin: 3px 2px !important; min-height: 20px !important; padding: 0 7px !important; } /* Query pager arrow placement. Keep the page-size buttons and page navigation grouped on the right, with the previous/next arrows inside the page-number group. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-pager.dx-pager { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 16px !important; justify-content: flex-end !important; overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; bottom: auto !important; display: inline-flex !important; float: none !important; gap: 8px !important; left: auto !important; margin: 0 !important; position: static !important; right: auto !important; top: auto !important; transform: none !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-pages { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-pages .dx-prev-button { order: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-pages .dx-page { order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-pages .dx-next-button { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button { align-items: center !important; align-self: center !important; bottom: auto !important; box-sizing: border-box !important; color: #111 !important; display: inline-flex !important; float: none !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 0 !important; height: 26px !important; justify-content: center !important; left: auto !important; line-height: 26px !important; margin: 0 2px !important; max-height: 26px !important; min-height: 26px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; position: static !important; right: auto !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: 22px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button::before { align-items: center !important; display: inline-flex !important; font-size: 20px !important; font-weight: 700 !important; height: 26px !important; justify-content: center !important; line-height: 26px !important; width: 22px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-prev-button::before { content: "<" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-next-button::before { content: ">" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button.dx-button-disable::before, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button.dx-state-disabled::before { color: #b7bec7 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button::after, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-pager .dx-navigate-button .dx-icon { content: none !important; display: none !important; } /* Query pager direct-child fallback. Some DevExtreme pager builds render next/previous as direct pager children, so order those direct buttons around the page-number group as well. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; justify-content: flex-end !important; overflow: visible !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager > .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager > .dx-prev-button { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager > .dx-pages { order: 3 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager > .dx-next-button { order: 4 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-pages { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 8px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-pages .dx-prev-button { order: 0 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-pages .dx-page { order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-pages .dx-next-button { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-navigate-button { align-items: center !important; align-self: center !important; bottom: auto !important; box-sizing: border-box !important; color: #111 !important; display: inline-flex !important; float: none !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 0 !important; height: 26px !important; justify-content: center !important; left: auto !important; line-height: 26px !important; margin: 0 2px !important; max-height: 26px !important; min-height: 26px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; position: static !important; right: auto !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: 22px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-navigate-button::before { align-items: center !important; display: inline-flex !important; font-size: 20px !important; font-weight: 700 !important; height: 26px !important; justify-content: center !important; line-height: 26px !important; width: 22px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-prev-button::before { content: "<" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-next-button::before { content: ">" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-navigate-button::after, body.ff-app .ff-query.ff-query-grid-page #gridContainer .dx-pager .dx-navigate-button .dx-icon { content: none !important; display: none !important; } /* Query footer alignment. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; text-align: right !important; } /* Query pager final standard. Keep the footer pager grouped like the other view grids and let DevExtreme render the navigation icons inside the page-number group. */ body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 10px !important; justify-content: flex-end !important; margin: 0 !important; min-height: 42px !important; overflow: visible !important; padding: 2px 12px 8px !important; width: 100% !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-info { display: none !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-page-indexes, .dx-light-pages) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; height: 28px !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; white-space: nowrap !important; width: auto !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-page-sizes { margin-left: auto !important; order: 1 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-pages { gap: 8px !important; order: 3 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager :is(.dx-page-indexes, .dx-light-pages) { gap: 8px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager > .dx-prev-button { order: 2 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager > .dx-next-button { order: 4 !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 2px !important; max-height: 24px !important; min-height: 24px !important; min-width: 24px !important; overflow: visible !important; padding: 0 6px !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-navigate-button { color: #111 !important; font-family: DXIcons !important; font-size: 21px !important; padding: 0 !important; position: relative !important; width: 24px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-prev-button::before, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-next-button::before { align-items: center !important; display: inline-flex !important; font-family: DXIcons !important; font-size: 21px !important; font-weight: 400 !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; position: static !important; width: 24px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-prev-button::before { content: "\f012" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-next-button::before { content: "\f010" !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-selection { align-items: center !important; background-color: var(--ff-primary, #367bf5) !important; border-color: var(--ff-primary, #367bf5) !important; border-radius: 6px !important; box-sizing: border-box !important; color: #fff !important; display: inline-flex !important; height: 20px !important; justify-content: center !important; line-height: 20px !important; margin: 2px !important; max-height: 20px !important; min-height: 20px !important; overflow: hidden !important; padding: 0 8px !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-navigate-button { transform: translateY(2px) !important; } body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-prev-button::before, body.ff-app .ff-query.ff-query-grid-page #gridContainer.ff-query-results-grid.ff-query-pager-normalized .dx-pager .dx-next-button::before { transform: translateY(1px) !important; } /* Compact DevExtreme grid filter-row editor standard. Match the Generate Invoice search-row fix on safe portal grids. */ body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row > td { box-sizing: border-box !important; height: 26px !important; line-height: 22px !important; min-height: 26px !important; overflow: visible !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row .dx-editor-cell { padding-left: 6px !important; padding-right: 6px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row :is(.dx-texteditor, .dx-textbox, .dx-numberbox, .dx-datebox, .dx-selectbox, .dx-dropdowneditor) { box-sizing: border-box !important; height: 22px !important; line-height: 20px !important; margin: 0 !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input-container, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 20px !important; line-height: 20px !important; max-height: 20px !important; min-height: 20px !important; overflow: visible !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row .dx-texteditor-input { box-sizing: border-box !important; font-size: var(--ff-control-font-size, 12px) !important; height: 20px !important; line-height: 18px !important; margin: 0 !important; max-height: 20px !important; min-height: 20px !important; padding: 1px 6px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-page:not(.ff-view-waybills):not(.ff-generate-manifest) .dx-datagrid-filter-row :is(.dx-dropdowneditor-button, .dx-button-content, .dx-dropdowneditor-icon, .dx-icon-event, .dx-icon-search, .dx-icon-clear) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 20px !important; justify-content: center !important; line-height: 18px !important; margin: 0 !important; max-height: 20px !important; min-height: 20px !important; padding: 0 !important; width: 22px !important; } /* Generate Manifest filter-row editor finish. Page-scoped because Generate Manifest keeps its own accepted grid rules. */ body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row, body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row > td { box-sizing: border-box !important; height: 32px !important; line-height: 26px !important; max-height: 32px !important; min-height: 32px !important; overflow: visible !important; padding-bottom: 3px !important; padding-top: 3px !important; vertical-align: middle !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row .dx-editor-cell { padding-left: 6px !important; padding-right: 6px !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-textbox, .dx-numberbox, .dx-datebox, .dx-selectbox, .dx-dropdowneditor) { box-sizing: border-box !important; height: 24px !important; line-height: 22px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input-container, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 22px !important; line-height: 22px !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row .dx-texteditor-input { box-sizing: border-box !important; font-size: var(--ff-control-font-size, 12px) !important; height: 22px !important; line-height: 20px !important; margin: 0 !important; max-height: 22px !important; min-height: 22px !important; padding: 1px 6px !important; } body.ff-app .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-dropdowneditor-button, .dx-button-content, .dx-dropdowneditor-icon, .dx-icon-event, .dx-icon-search, .dx-icon-clear) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 22px !important; justify-content: center !important; line-height: 20px !important; margin: 0 !important; max-height: 22px !important; min-height: 22px !important; padding: 0 !important; width: 24px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row > td { height: 28px !important; line-height: 22px !important; max-height: 28px !important; min-height: 28px !important; padding-bottom: 2px !important; padding-top: 2px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor, .dx-textbox, .dx-numberbox, .dx-datebox, .dx-selectbox, .dx-dropdowneditor) { height: 22px !important; line-height: 20px !important; max-height: 22px !important; min-height: 22px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input-container, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container) { height: 20px !important; line-height: 20px !important; max-height: 20px !important; min-height: 20px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row .dx-texteditor-input { height: 20px !important; line-height: 18px !important; max-height: 20px !important; min-height: 20px !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-generate-manifest #gridContainer .dx-datagrid-filter-row :is(.dx-dropdowneditor-button, .dx-button-content, .dx-dropdowneditor-icon, .dx-icon-event, .dx-icon-search, .dx-icon-clear) { height: 20px !important; line-height: 18px !important; max-height: 20px !important; min-height: 20px !important; width: 22px !important; } /* Generate Invoice pager normalization. Keep the page-size buttons and previous/next arrows in the same standard footer row. */ body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized :is(.dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px !important; justify-content: flex-end !important; margin: 0 !important; min-height: 42px !important; overflow: visible !important; padding: 2px 12px 8px !important; width: 100% !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-info { display: none !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-page-indexes, .dx-light-pages) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; height: 28px !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; min-width: max-content !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; white-space: nowrap !important; width: auto !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-page-sizes { margin-left: auto !important; margin-right: 6px !important; order: 1 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-pages { gap: 2px !important; justify-content: center !important; order: 2 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager :is(.dx-page-indexes, .dx-light-pages) { gap: 2px !important; justify-content: center !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager > .dx-navigate-button { display: none !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager :is(.dx-page, .dx-page-size, .dx-pages .dx-navigate-button) { align-items: center !important; align-self: center !important; box-sizing: border-box !important; display: inline-flex !important; float: none !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 1px !important; max-height: 24px !important; min-height: 24px !important; min-width: 24px !important; overflow: visible !important; padding: 0 6px !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-pages .dx-navigate-button { color: #111 !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 0 !important; font-weight: 700 !important; padding: 0 !important; position: relative !important; width: 24px !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-prev-button::before, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-next-button::before { align-items: center !important; display: inline-flex !important; font-family: Arial, Helvetica, sans-serif !important; font-size: 20px !important; font-weight: 700 !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; position: static !important; transform: none !important; width: 24px !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-prev-button::before { content: "<" !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-next-button::before { content: ">" !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-navigate-button.dx-button-disable::before, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-navigate-button.dx-state-disabled::before { color: #b7bec7 !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-navigate-button::after, body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-navigate-button .dx-icon { content: none !important; display: none !important; } body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection), body.ff-app .ff-generate-invoice.ff-query-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-generate-pager-normalized .dx-pager .dx-selection { align-items: center !important; background-color: var(--ff-primary, #367bf5) !important; border-color: var(--ff-primary, #367bf5) !important; border-radius: 6px !important; box-sizing: border-box !important; color: #fff !important; display: inline-flex !important; height: 20px !important; justify-content: center !important; line-height: 20px !important; margin: 2px !important; max-height: 20px !important; min-height: 20px !important; overflow: hidden !important; padding: 0 8px !important; } /* Boolean grid checkbox standard. Match read-only boolean checkbox corners to the row selector square. */ body.ff-app { --ff-grid-boolean-checkbox-radius: var(--ff-view-grid-row-selector-radius, 3px); } body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .ff-grid-boolean-checkbox .dx-checkbox-icon, body.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .dx-checkbox:not(.dx-select-checkbox) .dx-checkbox-icon { border-radius: var(--ff-grid-boolean-checkbox-radius) !important; } /* View Payments final viewport and row-density lock. Fixed and scrollable panes render separate tables, so every row/cell gets the same explicit height here. */ body.ff-app .ff-view-payments.ff-query-grid-page { --ff-payments-fallback-grid-height: clamp(360px, calc(100dvh - 170px), 1800px); --ff-payments-row-height-final: 26px; min-height: 100dvh !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-payments.ff-query-grid-page { --ff-payments-fallback-grid-height: clamp(360px, calc(100dvh - 145px), 1800px); --ff-payments-row-height-final: 22px; min-height: 100dvh !important; } body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-query-grid-page { --ff-payments-row-height-final: 34px; } body.ff-app .ff-view-payments.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-gridbase-container { height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; max-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; min-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { flex: 1 1 auto !important; height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 132px))) !important; max-height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 132px))) !important; min-height: var(--ff-payments-rows-height-measured, calc(var(--ff-payments-row-height-final) * 2)) !important; overflow: hidden !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 132px))) !important; max-height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 132px))) !important; min-height: var(--ff-payments-rows-height-measured, calc(var(--ff-payments-row-height-final) * 2)) !important; overflow: hidden !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: max(100%, calc(var(--ff-payments-row-height-final) * var(--ff-payments-row-slots, 2))) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed), body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) { height: var(--ff-payments-row-height-final) !important; line-height: var(--ff-payments-row-height-final) !important; max-height: var(--ff-payments-row-height-final) !important; min-height: var(--ff-payments-row-height-final) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: var(--ff-payments-row-height-final) !important; line-height: calc(var(--ff-payments-row-height-final) - 2px) !important; max-height: var(--ff-payments-row-height-final) !important; min-height: var(--ff-payments-row-height-final) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-command-select, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.dx-command-edit, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td.ff-payments-view-command-col { padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td :is(.dx-link, a, button, .btn, .dx-button, .dx-button-content, .dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .ff-grid-boolean-checkbox, .dx-template-wrapper, .dx-datagrid-text-content) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: calc(var(--ff-payments-row-height-final) - 4px) !important; line-height: calc(var(--ff-payments-row-height-final) - 6px) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: calc(var(--ff-payments-row-height-final) - 4px) !important; min-height: 0 !important; overflow: hidden !important; vertical-align: middle !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview td :is(.dx-checkbox-icon, .dx-select-checkbox .dx-checkbox-icon) { height: 16px !important; line-height: 16px !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; width: 16px !important; } /* Query filter action placement hard lock. This loads after the shared finance filter rules, so the action row spans the whole filter card and keeps Keep Filter Open + Search on the right. */ body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-primary-filters > .ff-finance-client-filter, .ff-filter-client, .ff-query-generic-client-filter) { flex: 0 0 390px !important; max-width: 390px !important; min-width: 260px !important; width: 390px !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-primary-filters, body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-secondary-filters { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 6px !important; justify-content: flex-start !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-date-block, body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-date-block > .row, body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-user-group, body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-user-row { display: contents !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-primary-filters > [class*="col-"], body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-secondary-filters > [class*="col-"], body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-date-block > .row > [class*="col-"], body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-user-row > [class*="col-"] { float: none !important; max-width: none !important; min-height: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card :is(.ff-finance-client-filter, .ff-filter-client, .ff-query-generic-client-filter) { flex: 0 0 390px !important; max-width: 390px !important; min-width: 260px !important; width: 390px !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-date-period { flex: 0 0 232px !important; max-width: 232px !important; width: 232px !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-date-range { flex: 0 0 300px !important; max-width: 300px !important; width: 300px !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-branch-filter { flex: 0 0 232px !important; max-width: 232px !important; min-width: 190px !important; width: 232px !important; } body.ff-app .ff-query.ff-query-grid-page .accordion-no-display .ff-sr-card .ff-finance-acc-filter { flex: 0 0 220px !important; max-width: 220px !important; min-width: 170px !important; width: 220px !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-filter-actions-row, .ff-finance-crdr-actions-row, .ff-filter-actions-row, .ff-image-actions-row, .ff-query-generic-actions-row) { display: block !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions) { align-items: center !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: minmax(0, 1fr) auto auto !important; column-gap: 10px !important; max-width: none !important; min-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-show-dormant, .ff-filter-clear, .ff-filter-show-dormant) { grid-column: 1 !important; justify-self: start !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-search-type { grid-column: 1 !important; justify-self: start !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter) { grid-column: 2 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-search, .ff-image-search, .ff-query-generic-search) { grid-column: 3 !important; justify-self: end !important; min-width: 190px !important; order: initial !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-filter-actions { grid-template-columns: auto auto minmax(0, 1fr) auto auto !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-filter-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; min-width: 92px !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-filter-actions .ff-finance-show-dormant { grid-column: 2 !important; justify-self: start !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-filter-actions .ff-finance-keep-filter { grid-column: 4 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-filter-actions .ff-finance-search { grid-column: 5 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions { grid-template-columns: auto auto auto minmax(0, 1fr) auto auto auto !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; min-width: 92px !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-crdr-search-type { grid-column: 2 !important; justify-self: start !important; white-space: nowrap !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-show-dormant { grid-column: 3 !important; justify-self: start !important; white-space: nowrap !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { grid-column: 5 !important; justify-self: end !important; margin-left: 0 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter { grid-column: 6 !important; justify-self: end !important; min-width: var(--ff-control-h, 30px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter .fa { line-height: 1 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-finance-crdr-actions .ff-finance-search { grid-column: 7 !important; justify-self: end !important; min-width: 190px !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-filter-actions { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 10px !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-filter-actions .ff-filter-keep-open { margin-left: auto !important; order: 90 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-filter-actions:not(:has(.ff-filter-keep-open)) .ff-filter-close { margin-left: auto !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-filter-actions .ff-filter-close { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card .ff-filter-actions .ff-filter-search { min-width: 190px !important; order: 100 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions) { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 8px !important; justify-content: flex-start !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-clear, .ff-filter-clear) { order: 0 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-unsettled, .ff-finance-fewer-cols, .ff-finance-save-history, .ff-finance-crdr-search-type, .ff-finance-show-dormant) { order: 1 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-filter-keep-open) { margin-left: auto !important; order: 90 !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-filter-close) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } body.ff-app .ff-query .accordion-no-display .ff-sr-card :is(.ff-finance-search, .ff-image-search, .ff-query-generic-search, .ff-filter-search) { min-width: 190px !important; order: 100 !important; } /* Debriefing bottom crop guard. The rows pane may scroll internally for 100/200 row pages, but the page shell should end shortly after the grid footer/pager. */ html:has(body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid), body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) #app, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .app-content, body.ff-app:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid .dx-datagrid) .main-content { height: auto !important; max-height: none !important; min-height: 0 !important; overflow-y: auto !important; } body.ff-app .main-content > .container:has(.ff-debriefing.ff-query-grid-page .ff-grid-result-row:not(.ng-hide) #gridContainer.ff-debriefing-pagefit-grid), body.ff-app .ff-debriefing.ff-query-grid-page, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-debriefing.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 8px !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid { margin-bottom: 0 !important; } body.ff-app .ff-debriefing.ff-query-grid-page #gridContainer.ff-debriefing-pagefit-grid :is(.dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { margin-bottom: 0 !important; padding-bottom: 2px !important; } /* Debriefing active result shell crop. The controller sets this body class so the app flex shell can stop stretching after the grid footer without relying on :has() ancestor rules. */ html:has(body.ff-app.ff-debriefing-results-active), body.ff-app.ff-debriefing-results-active, body.ff-app.ff-debriefing-results-active #app, body.ff-app.ff-debriefing-results-active #app > .ff-shell, body.ff-app.ff-debriefing-results-active #app > .ff-shell.ng-scope, body.ff-app.ff-debriefing-results-active #app .app-content, body.ff-app.ff-debriefing-results-active #app .main-content, body.ff-app.ff-debriefing-results-active #app .wrap-content, body.ff-app.ff-debriefing-results-active #container { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app.ff-debriefing-results-active #app > .ff-shell, body.ff-app.ff-debriefing-results-active #app > .ff-shell.ng-scope, body.ff-app.ff-debriefing-results-active #app .app-content, body.ff-app.ff-debriefing-results-active #app .main-content { flex: 0 0 auto !important; } body.ff-app.ff-debriefing-results-active #app .main-content > .container, body.ff-app.ff-debriefing-results-active #app .wrap-content, body.ff-app.ff-debriefing-results-active #container, body.ff-app.ff-debriefing-results-active .ff-debriefing.ff-query-grid-page, body.ff-app.ff-debriefing-results-active .ff-debriefing.ff-query-grid-page > .container-fullw, body.ff-app.ff-debriefing-results-active .ff-debriefing.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app.ff-debriefing-results-active .ff-debriefing.ff-query-grid-page .ff-grid-result-row, body.ff-app.ff-debriefing-results-active .ff-debriefing.ff-query-grid-page .ff-grid-result-row > .col-md-12 { margin-bottom: 0 !important; padding-bottom: 4px !important; } body.ff-app.ff-debriefing-results-active #app > footer { margin-top: 0 !important; } /* View Payments footer guard. The controller measures the available page space; keep the footer/pager visible without replacing that measured height with a fixed viewport value. */ body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid { box-sizing: border-box !important; height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; max-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; min-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container { box-sizing: border-box !important; height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 164px))) !important; max-height: var(--ff-payments-rows-height-measured, max(72px, calc(var(--ff-payments-fallback-grid-height) - 164px))) !important; min-height: var(--ff-payments-rows-height-measured, calc(var(--ff-payments-row-height-final) * 2)) !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-total-footer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-pager, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-pager { display: flex !important; flex-shrink: 0 !important; min-height: 40px !important; overflow: visible !important; position: relative !important; z-index: 4 !important; } body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-total-footer, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-pager, body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-view-payments.ff-query-grid-page #gridContainer .dx-pager { min-height: 36px !important; } /* View Payments stripped page-scroll layout. Match the stable view pages: data rows, totals, then pager. */ body.ff-app .ff-view-payments.ff-query-grid-page { min-height: 0 !important; } body.ff-app .ff-view-payments.ff-query-grid-page > .container-fluid.container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page > .container-fullw, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row, body.ff-app .ff-view-payments.ff-query-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-gridbase-container { display: block !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-datagrid-content-fixed, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-container, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview { overflow: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-total-footer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-datagrid-pager, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer .dx-pager { clear: both !important; display: flex !important; height: auto !important; max-height: none !important; min-height: 36px !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 5 !important; } /* View Payments bounded viewport restore. Keep DevExpress scrollbars visible while leaving totals and pager inside the measured grid height. This block intentionally wins over the stripped auto-height rules above. */ html body.ff-app .ff-view-payments:not(.ff-payments-grid-has-data):not(.ff-payments-grid-loading) #gridContainer .dx-datagrid-total-footer, html body.ff-app .ff-view-payments:not(.ff-payments-grid-has-data):not(.ff-payments-grid-loading) #gridContainer .dx-datagrid-pager, html body.ff-app .ff-view-payments:not(.ff-payments-grid-has-data):not(.ff-payments-grid-loading) #gridContainer .dx-pager, html body.ff-app .ff-view-payments:not(.ff-payments-grid-has-data):not(.ff-payments-grid-loading) .ff-payments-hide-until-data { display: none !important; } html body.ff-app .ff-view-payments.ff-payments-grid-loading #gridContainer { position: relative; } html body.ff-app .ff-view-payments.ff-payments-grid-loading #gridContainer::before { content: none !important; display: none !important; } html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview { flex: 1 1 0 !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-total-footer, html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-pager, html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager { flex: 0 0 auto !important; height: auto !important; min-height: 38px !important; max-height: none !important; overflow: visible !important; visibility: visible !important; } html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-pager, html body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager { min-height: 54px !important; padding-top: 6px !important; padding-bottom: 6px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid.dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid > .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-gridbase-container { height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; max-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; min-height: var(--ff-payments-grid-height-measured, var(--ff-payments-fallback-grid-height)) !important; overflow: hidden !important; width: 100% !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview { flex: 1 1 auto !important; height: auto !important; max-height: none !important; min-height: calc(var(--ff-payments-row-height-final) * 4) !important; overflow: hidden !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-vertical, .dx-scrollable-scrollbar-horizontal) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-total-footer, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-pager, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager { display: flex !important; flex: 0 0 auto !important; height: auto !important; max-height: none !important; min-height: 36px !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 6 !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-total-footer { min-height: 38px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-datagrid-pager.dx-pager, body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager { align-items: center !important; box-sizing: border-box !important; justify-content: flex-end !important; flex-basis: 58px !important; min-height: 58px !important; padding-bottom: 8px !important; padding-top: 8px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; min-height: 34px !important; } body.ff-app .ff-view-payments.ff-query-grid-page #gridContainer.ff-payments-viewport-grid .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; min-height: 28px !important; } /* View Tracking loading/header guard. Hide the grid header/filter fields until DevExtreme has rendered data rows. */ body.ff-app .ff-view-tracking #gridContainer:not(.ff-grid-has-data) .dx-datagrid-headers { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } body.ff-app .ff-view-tracking #gridContainer.ff-grid-has-data .dx-datagrid-headers { opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } /* Full capture quote conversion buttons: keep button text vertically centered. */ .ff-full-capture .btn, .ff-full-capture button, .ff-full-capture .dx-button, .ff-capture-full .btn, .ff-capture-full button, .ff-capture-full .dx-button { align-items: center; } /* View Collections standard grid pilot. One compact style, CSS-sized grid, native DevExtreme scrolling, no density branches. */ body.ff-app .ff-view-collections.ff-standard-grid-page { --ff-standard-grid-row-height: 22px; --ff-standard-grid-cell-line-height: 19px; --ff-standard-grid-cell-padding-y: 1px; --ff-standard-grid-cell-padding-x: 4px; --ff-standard-grid-font-size: 11px; --ff-standard-grid-header-height: 24px; --ff-standard-grid-filter-height: 24px; --ff-standard-grid-pager-height: 22px; --ff-standard-grid-check-size: 16px; --ff-standard-grid-action-size: 16px; --ff-collection-select-width-final: 30px; --ff-collection-action-width-final: 58px; --ff-standard-grid-command-width: var(--ff-collection-action-width-final); --ff-standard-grid-id-width: 64px; --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 290px), 900px); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-collections.ff-standard-grid-page { --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 310px), 900px); } body.ff-app .ff-view-collections.ff-standard-grid-page > .ff-collection-body, body.ff-app .ff-view-collections.ff-standard-grid-page > .container-fullw.ff-collection-body, body.ff-app .ff-view-collections.ff-standard-grid-page > .container-fluid.container-fullw.ff-collection-body { padding-right: 9px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 8px !important; min-height: 28px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-toolbar-inner .ff-grid-status-filters { align-items: center !important; display: inline-flex !important; float: none !important; gap: 4px !important; margin-left: auto !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-toolbar-inner :is(.checkbox, .valuesonly) { align-items: center !important; display: inline-flex !important; line-height: 20px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-toolbar-inner .label { align-items: center !important; display: inline-flex !important; font-size: 11px !important; line-height: 16px !important; min-height: 18px !important; padding: 2px 5px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-action-btn, body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-reset-layout-btn { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 22px !important; margin-left: 4px !important; padding: 0 !important; width: 28px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-result-row, body.ff-app .ff-view-collections.ff-standard-grid-page .ff-grid-result-row > .ff-dx-theme { min-height: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } @supports not (height: clamp(1px, 2px, 3px)) { body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 290px); height: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 310px); } } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid > .dx-datagrid, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; width: 100% !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-rows-max-height) !important; height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: var(--ff-standard-grid-rows-max-height) !important; overflow: hidden !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers .dx-header-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-header-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-header-height) !important; min-height: var(--ff-standard-grid-header-height) !important; overflow: hidden !important; padding: 2px var(--ff-standard-grid-cell-padding-x) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: var(--ff-standard-grid-filter-height) !important; max-height: var(--ff-standard-grid-filter-height) !important; min-height: var(--ff-standard-grid-filter-height) !important; padding: 1px var(--ff-standard-grid-cell-padding-x) !important; vertical-align: middle !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { font-size: var(--ff-standard-grid-font-size) !important; height: 21px !important; line-height: 19px !important; min-height: 21px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td :is(span, div, input, img, .dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-boolean-checkbox), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-link, a, button, .btn, .label), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-command-select, .ff-collection-command-col, .ff-collection-id-col) { overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-collection-command-col, .dx-command-edit) { max-width: var(--ff-standard-grid-command-width) !important; min-width: var(--ff-standard-grid-command-width) !important; width: var(--ff-standard-grid-command-width) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-id-col { max-width: var(--ff-standard-grid-id-width) !important; min-width: var(--ff-standard-grid-id-width) !important; width: var(--ff-standard-grid-id-width) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox) { box-sizing: border-box !important; height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; justify-content: center !important; overflow: visible !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-collection-command-col, .dx-command-edit) :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-collection-command-col, .dx-command-edit) :is(.dx-icon, .dx-icon-overflow, .fa) { font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-pager, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-standard-grid-pager-height) !important; justify-content: flex-end !important; max-height: var(--ff-standard-grid-pager-height) !important; min-height: var(--ff-standard-grid-pager-height) !important; overflow: visible !important; padding: 1px 6px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; min-height: 22px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; display: inline-flex !important; font-size: 11px !important; height: 22px !important; justify-content: center !important; line-height: 22px !important; min-height: 22px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper) { display: none !important; } body.ff-app .ff-view-collections.ff-standard-grid-page > .ff-collection-body.csspinner::after, body.ff-app .ff-view-collections.ff-standard-grid-page > .ff-collection-body .csspinner::after { display: none !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-dx-preserved-row-colour-cell { background-color: var(--ff-preserved-row-bg) !important; color: var(--ff-preserved-row-fg) !important; } /* Plain-selector fallback for the embedded browser: keep the Collections standard grid compact even when newer selector helpers are ignored. */ body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { height: auto !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers .dx-header-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-header-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-header-height) !important; min-height: var(--ff-standard-grid-header-height) !important; overflow: hidden !important; padding: 2px var(--ff-standard-grid-cell-padding-x) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: var(--ff-standard-grid-filter-height) !important; max-height: var(--ff-standard-grid-filter-height) !important; min-height: var(--ff-standard-grid-filter-height) !important; padding: 1px var(--ff-standard-grid-cell-padding-x) !important; vertical-align: middle !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor-container, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor-input { font-size: var(--ff-standard-grid-font-size) !important; height: 21px !important; line-height: 19px !important; min-height: 21px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content .dx-datagrid-table > tbody > tr.dx-data-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table > tbody > tr.dx-data-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td span, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td div, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td input, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td img, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td .dx-template-wrapper, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td .dx-datagrid-text-content, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-link, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview a, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview button, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .btn, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td span, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td div, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td .dx-datagrid-summary-item { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-id-col { overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit { max-width: var(--ff-standard-grid-command-width) !important; min-width: var(--ff-standard-grid-command-width) !important; width: var(--ff-standard-grid-command-width) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox-container, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox-icon, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-select-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox-container, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox-icon, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-select-checkbox { box-sizing: border-box !important; height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox-container, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-select-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-checkbox-container, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) .dx-select-checkbox { align-items: center !important; display: inline-flex !important; justify-content: center !important; overflow: visible !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-dropdownbutton, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-button, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-button-content, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-dropdownbutton-action, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-dropdownbutton-toggle, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-dropdownbutton, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-button, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-button-content, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-dropdownbutton-action, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-dropdownbutton-toggle { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-icon, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .dx-icon-overflow, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-collection-command-col .fa, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-icon, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .dx-icon-overflow, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-edit .fa { font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-page-sizes, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-pages { align-items: center !important; display: inline-flex !important; min-height: 22px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-page, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-page-size, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-navigate-button { align-items: center !important; display: inline-flex !important; font-size: 11px !important; height: 22px !important; justify-content: center !important; line-height: 22px !important; min-height: 22px !important; } body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-freespace-row, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-virtual-row, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-freespace-row > td, body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-virtual-row > td { border: 0 !important; height: 0 !important; min-height: 0 !important; padding: 0 !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview { height: var(--ff-standard-grid-rows-max-height, calc(100vh - 290px)) !important; max-height: var(--ff-standard-grid-rows-max-height, calc(100vh - 290px)) !important; min-height: var(--ff-standard-grid-rows-max-height, calc(100vh - 290px)) !important; overflow: hidden !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-standard-grid-rows-max-height, calc(100vh - 290px)) !important; max-height: var(--ff-standard-grid-rows-max-height, calc(100vh - 290px)) !important; min-height: 0 !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers .dx-header-row > td, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; font-size: 11px !important; height: 24px !important; line-height: 19px !important; max-height: 24px !important; min-height: 24px !important; overflow: hidden !important; padding: 2px 4px !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > td, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: 24px !important; max-height: 24px !important; min-height: 24px !important; padding: 1px 4px !important; vertical-align: middle !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor-container, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-texteditor-input { font-size: 11px !important; height: 21px !important; line-height: 19px !important; min-height: 21px !important; padding-bottom: 0 !important; padding-top: 0 !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row > td { box-sizing: border-box !important; font-size: 11px !important; height: 22px !important; line-height: 19px !important; max-height: 22px !important; min-height: 22px !important; overflow: hidden !important; padding-bottom: 1px !important; padding-left: 4px !important; padding-right: 4px !important; padding-top: 1px !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row td *, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td * { box-sizing: border-box !important; font-size: 11px !important; line-height: 19px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 19px !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox-container, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-checkbox-icon, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select .dx-select-checkbox, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-checkbox, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-checkbox-container, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-checkbox-icon, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-select-checkbox { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin: 0 auto !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; overflow: visible !important; width: 16px !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-freespace-row, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-virtual-row, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-freespace-row > td, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-virtual-row > td { border: 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } .ff-view-collections.ff-standard-grid-page .ff-grid-result-row > .ff-dx-theme { border: 0 !important; border-radius: 0 !important; box-shadow: none !important; } .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer, .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-pager { border-radius: 0 !important; box-shadow: none !important; } /* Final View Collections pager hard-stop: trim the pager band only. The page buttons remain 22px high; only the surrounding area is removed. */ html body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-pager.dx-pager, html body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container > .dx-datagrid-pager.dx-pager, html body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 var(--ff-standard-grid-pager-height) !important; height: var(--ff-standard-grid-pager-height) !important; justify-content: flex-end !important; margin: 0 !important; max-height: var(--ff-standard-grid-pager-height) !important; min-height: var(--ff-standard-grid-pager-height) !important; overflow: visible !important; padding: 0 6px !important; } html body.ff-app .ff-view-collections.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-page-indexes, .dx-light-pages) { align-items: center !important; display: inline-flex !important; height: 22px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; } /* View Waybills standard grid. Same fast CSS-only sizing as View Collections, with no post-load measuring. */ body.ff-app .ff-view-waybills.ff-standard-grid-page { --ff-grid-row-height: 18px; --ff-grid-cell-padding-y: 0; --ff-standard-grid-row-height: 18px; --ff-standard-grid-cell-line-height: 16px; --ff-standard-grid-cell-padding-y: 0; --ff-standard-grid-cell-padding-x: 4px; --ff-standard-grid-font-size: 11px; --ff-standard-grid-header-height: 24px; --ff-standard-grid-filter-height: 24px; --ff-standard-grid-pager-height: 22px; --ff-standard-grid-check-size: 14px; --ff-standard-grid-action-size: 14px; --ff-standard-grid-command-width: 32px; --ff-standard-grid-total-footer-height: 24px; --ff-view-grid-action-icon-size: 14px; --ff-view-waybills-image-link-line-height: 16px; --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 304px), 900px); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page { --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 324px), 900px); } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw { padding-top: 0 !important; padding-right: 9px !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #page-title.ff-page-header { margin-bottom: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw > .row, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw > .row { margin-bottom: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw { position: relative !important; } body.ff-app .ff-standard-grid-page > .container-fullw, body.ff-app .ff-standard-grid-page > .container-fluid.container-fullw, body.ff-app .ff-standard-grid-page > .container-fullw [block-ui], body.ff-app .ff-standard-grid-page > .container-fluid.container-fullw [block-ui] { position: relative !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-row[ng-cloak] { display: none !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-row { contain: layout paint !important; left: 9px !important; margin: 0 !important; opacity: 1 !important; pointer-events: none !important; position: absolute !important; right: 9px !important; visibility: visible !important; z-index: 1050 !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--closed { left: 9px !important; opacity: 0 !important; pointer-events: none !important; position: fixed !important; right: 9px !important; top: -2000px !important; visibility: visible !important; z-index: -1 !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--open { opacity: 1 !important; pointer-events: none !important; position: absolute !important; top: auto !important; visibility: visible !important; z-index: 1050 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-waybills) .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--persistent { contain: layout !important; display: block !important; left: auto !important; margin: 0 0 4px 0 !important; opacity: 1 !important; pointer-events: auto !important; position: relative !important; right: auto !important; top: auto !important; visibility: visible !important; z-index: auto !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-panel { background: var(--surface, #fff) !important; border: 1px solid var(--border, #d9e0ea) !important; border-radius: 6px !important; box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18) !important; contain: layout paint !important; max-height: calc(100dvh - 145px) !important; overflow-x: hidden !important; overflow-y: auto !important; pointer-events: auto !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-waybills) .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--persistent .ff-standard-filter-overlay-panel { box-shadow: none !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-standard-grid-page.ff-standard-grid-overlay-filter-page:not(.ff-view-waybills) .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--persistent { contain: layout paint !important; left: 9px !important; margin: 0 !important; opacity: 1 !important; pointer-events: none !important; position: absolute !important; right: 9px !important; top: auto !important; visibility: visible !important; z-index: 1050 !important; } body.ff-app .ff-standard-grid-page.ff-standard-grid-overlay-filter-page:not(.ff-view-waybills) .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--persistent .ff-standard-filter-overlay-panel { box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18) !important; max-height: calc(100dvh - 145px) !important; overflow-x: hidden !important; overflow-y: auto !important; pointer-events: auto !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-inline-row, body.ff-app .ff-standard-grid-page .ff-finance-filter-inline-row { contain: layout !important; display: block !important; left: auto !important; margin: 0 0 4px 0 !important; opacity: 1 !important; pointer-events: auto !important; position: relative !important; right: auto !important; top: auto !important; visibility: visible !important; z-index: auto !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-inline-row .ff-standard-filter-overlay-panel, body.ff-app .ff-standard-grid-page .ff-finance-filter-inline-row .ff-standard-filter-overlay-panel { box-shadow: none !important; max-height: none !important; overflow: visible !important; } body.ff-app .ff-standard-grid-page .ff-standard-filter-overlay-row--closed .ff-standard-filter-overlay-panel { pointer-events: none !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw > .ff-view-waybills-filter-overlay-row, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw > .ff-view-waybills-filter-overlay-row { contain: layout paint !important; left: 9px !important; margin: 0 !important; pointer-events: none !important; position: absolute !important; right: 9px !important; z-index: 1050 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-filter-panel { background: var(--surface, #fff) !important; border: 1px solid var(--border, #d9e0ea) !important; border-radius: 6px !important; box-shadow: 0 10px 22px rgba(15, 23, 42, 0.18) !important; contain: layout paint !important; max-height: calc(100dvh - 145px) !important; overflow-x: hidden !important; overflow-y: auto !important; pointer-events: auto !important; } body.ff-app .ff-action.ff-action--loading { position: relative !important; } body.ff-app .ff-action.ff-action--loading > :is(.fa, .ff-action-label) { opacity: 0.35 !important; } body.ff-app .ff-action.ff-action--loading::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(47, 125, 246, 0.22) !important; border-top-color: var(--primary, #2f7df6) !important; border-radius: 50% !important; content: "" !important; height: 18px !important; left: 50% !important; margin-left: -9px !important; margin-top: -9px !important; position: absolute !important; top: 50% !important; width: 18px !important; } @keyframes ff-waybill-filter-spin { to { transform: rotate(360deg); } } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw > .ff-view-waybills-filter-overlay-row.ff-standard-filter-overlay-row--closed, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw > .ff-view-waybills-filter-overlay-row.ff-standard-filter-overlay-row--closed { position: fixed !important; top: -2000px !important; z-index: -1 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw > .ff-view-waybills-filter-overlay-row.ff-standard-filter-overlay-row--open, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw > .ff-view-waybills-filter-overlay-row.ff-standard-filter-overlay-row--open { position: absolute !important; top: auto !important; z-index: 1050 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw > .row:has(> .accordion-no-display):not(:has(.panel-collapse.in)), body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw > .row:has(> .accordion-no-display):not(:has(.panel-collapse.in)) { display: none !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-toolbar-row { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 0 8px !important; margin-bottom: 0 !important; min-height: 24px !important; padding-bottom: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-toolbar-row :is(.checkbox, .valuesonly) { align-items: center !important; display: inline-flex !important; line-height: 20px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-toolbar-row .label { align-items: center !important; display: inline-flex !important; font-size: 11px !important; line-height: 16px !important; min-height: 18px !important; padding: 2px 5px !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-grid-reset-layout-btn { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; line-height: 22px !important; margin-left: 4px !important; padding: 0 !important; width: 28px !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-row, body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-row > .col-md-12 { margin-top: 0 !important; min-height: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; margin-top: 0 !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } @supports not (height: clamp(1px, 2px, 3px)) { body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 304px); height: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 324px); } } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid > .dx-datagrid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; width: 100% !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-rows-max-height) !important; height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: var(--ff-standard-grid-rows-max-height) !important; overflow: hidden !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers .dx-header-row > td, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-header-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-header-height) !important; min-height: var(--ff-standard-grid-header-height) !important; overflow: hidden !important; padding: 2px var(--ff-standard-grid-cell-padding-x) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > td, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: var(--ff-standard-grid-filter-height) !important; max-height: var(--ff-standard-grid-filter-height) !important; min-height: var(--ff-standard-grid-filter-height) !important; padding: 1px var(--ff-standard-grid-cell-padding-x) !important; vertical-align: middle !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { font-size: var(--ff-standard-grid-font-size) !important; height: 21px !important; line-height: 19px !important; min-height: 21px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row td *, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer td * { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-command-select, .ff-waybill-command-col, .dx-command-edit) { box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; position: relative !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-waybill-command-col, .dx-command-edit) { max-width: var(--ff-standard-grid-command-width) !important; min-width: var(--ff-standard-grid-command-width) !important; width: var(--ff-standard-grid-command-width) !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox), body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td:not(.dx-command-select) :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-standard-grid-check-size) !important; height: var(--ff-standard-grid-check-size) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; width: var(--ff-standard-grid-check-size) !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-waybill-command-col, .dx-command-edit) :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.ff-waybill-command-col, .dx-command-edit) :is(.dx-icon, .dx-icon-overflow, .fa) { font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview td.ff-waybill-command-col > .dx-template-wrapper { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-standard-grid-row-height) !important; justify-content: center !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; position: relative !important; width: 100% !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa::before, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa:before { box-sizing: border-box !important; font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; width: var(--ff-standard-grid-action-size) !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper) { display: none !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw.csspinner::before, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw.csspinner::after, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw.loading::before, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fullw.loading::after, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw.csspinner::before, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw.csspinner::after, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw.loading::before, body.ff-app .ff-view-waybills.ff-standard-grid-page > .container-fluid.container-fullw.loading::after { animation: none !important; content: none !important; display: none !important; } body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.dx-datagrid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-headers, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-rowsview, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-total-footer, body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-pager { border-radius: 0 !important; box-shadow: none !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-datagrid-pager.dx-pager, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-gridbase-container > .dx-datagrid-pager.dx-pager, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 var(--ff-standard-grid-pager-height) !important; height: var(--ff-standard-grid-pager-height) !important; justify-content: flex-end !important; margin: 0 !important; max-height: var(--ff-standard-grid-pager-height) !important; min-height: var(--ff-standard-grid-pager-height) !important; overflow: visible !important; padding: 0 6px !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-page-indexes, .dx-light-pages) { align-items: center !important; display: inline-flex !important; height: 22px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; } /* Shared migrated view-grid standard. Used for view pages converted after Collections and Waybills. It is CSS-only: no row measuring, no post-fetch sizing, and normal/compact modes do not alter grids. */ body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) { --ff-standard-grid-row-height: 22px; --ff-standard-grid-cell-line-height: 19px; --ff-standard-grid-cell-padding-y: 1px; --ff-standard-grid-cell-padding-x: 4px; --ff-standard-grid-font-size: 11px; --ff-standard-grid-header-height: 24px; --ff-standard-grid-filter-height: 24px; --ff-standard-grid-pager-height: 22px; --ff-standard-grid-check-size: 16px; --ff-standard-grid-action-size: 16px; --ff-standard-grid-command-width: 32px; --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 257px)); } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 277px)); } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fullw, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fluid.container-fullw { padding-top: 0 !important; padding-right: 9px !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) #page-title.ff-page-header { margin-bottom: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fullw > .row, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fluid.container-fullw > .row { margin-bottom: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fullw > .row:has(> .accordion-no-display):not(:has(.panel-collapse.in)):not(.ff-standard-filter-overlay-row):not(.ff-standard-filter-inline-row):not(.ff-finance-filter-inline-row), body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) > .container-fluid.container-fullw > .row:has(> .accordion-no-display):not(:has(.panel-collapse.in)):not(.ff-standard-filter-overlay-row):not(.ff-standard-filter-inline-row):not(.ff-finance-filter-inline-row) { display: none !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-toolbar-row { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 0 8px !important; margin-bottom: 0 !important; min-height: 24px !important; padding-bottom: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 0 8px !important; min-height: 24px !important; padding-bottom: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-toolbar-row :is(.checkbox, .valuesonly) { align-items: center !important; display: inline-flex !important; line-height: 20px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-toolbar-row .label { align-items: center !important; display: inline-flex !important; font-size: 11px !important; line-height: 16px !important; min-height: 18px !important; padding: 2px 5px !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-result-row, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-result-row > .col-md-12, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-result-row > .col-sm-12, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-grid-result-row > [class*="col-"] { margin-top: 0 !important; min-height: 0 !important; padding-top: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid.dx-datagrid { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; margin-top: 0 !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } @supports not (height: clamp(1px, 2px, 3px)) { body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 257px); height: auto !important; } body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid, body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid.dx-datagrid { --ff-standard-grid-rows-max-height: calc(100vh - 277px); } } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid > .dx-datagrid, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; width: 100% !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-rows-max-height) !important; height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: var(--ff-standard-grid-rows-max-height) !important; overflow: hidden !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-rows-max-height) !important; max-height: var(--ff-standard-grid-rows-max-height) !important; min-height: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-headers .dx-header-row > td, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-total-footer .dx-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-header-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-header-height) !important; min-height: var(--ff-standard-grid-header-height) !important; overflow: hidden !important; padding: 2px var(--ff-standard-grid-cell-padding-x) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-filter-row > td, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-filter-row > tr > td { box-sizing: border-box !important; height: var(--ff-standard-grid-filter-height) !important; max-height: var(--ff-standard-grid-filter-height) !important; min-height: var(--ff-standard-grid-filter-height) !important; padding: 1px var(--ff-standard-grid-cell-padding-x) !important; vertical-align: middle !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-filter-row :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { font-size: var(--ff-standard-grid-font-size) !important; height: 21px !important; line-height: 19px !important; min-height: 21px !important; padding-bottom: 0 !important; padding-top: 0 !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row > td { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row td *, body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-datagrid-total-footer td * { box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid :is(.dx-command-select, .dx-command-edit) { overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-standard-grid .dx-command-edit { max-width: var(--ff-standard-grid-command-width) !important; min-width: var(--ff-standard-grid-command-width) !important; width: var(--ff-standard-grid-command-width) !important; } body.ff-app .ff-standard-grid-page:not(.ff-view-collections):not(.ff-view-waybills) .ff-p-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background-color: var(--primary, #2f7df6) !important; border-radius: 1px !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; max-height: 8px !important; max-width: 8px !important; min-height: 8px !important; min-width: 8px !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple):is(.ff-standard-grid-page, .ff-query-grid-page) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.ff-manifest-row-actions, .ff-manifest-row-action) { align-items: center !important; display: inline-flex !important; justify-content: center !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; vertical-align: middle !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple):is(.ff-standard-grid-page, .ff-query-grid-page) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.ff-manifest-row-actions, .ff-manifest-row-action) :is(.fa-eye, .fa.fa-eye, .dx-icon-eye, svg, i) { font-size: 16px !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; padding: 0 !important; width: 20px !important; } /* Final Image Search standard-grid parity and header scroll lock. Keep the migrated Images page on the same compact row contract as the other accepted standard grids, and force headers/rows/totals to share one measured horizontal width so the header cannot lag behind the row scroll surface. */ html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page { --ff-grid-row-height: 22px !important; --ff-grid-cell-padding-y: 1px !important; --ff-standard-grid-row-height: 22px !important; --ff-standard-grid-cell-line-height: 19px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-check-size: 16px !important; --ff-standard-grid-command-width: 32px !important; --ff-image-standard-horizontal-width-final: var(--ff-image-standard-horizontal-width, 100%) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final) !important; width: var(--ff-image-standard-horizontal-width-final) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final) !important; table-layout: fixed !important; width: var(--ff-image-standard-horizontal-width-final) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-image-select-col, .ff-image-command-col) { height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; font-size: 0 !important; max-width: var(--ff-standard-grid-command-width) !important; min-width: var(--ff-standard-grid-command-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; width: var(--ff-standard-grid-command-width) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) input[type="checkbox"] { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: var(--ff-standard-grid-check-size) !important; } /* Final View Waybills column chooser density. The popup is appended to body, so scope it to the active page and use the same normal/compact density flags as the grid. */ html body.ff-app:has(.ff-view-waybills) { --ff-waybill-column-chooser-font-size: 12px; --ff-waybill-column-chooser-line-height: 18px; --ff-waybill-column-chooser-item-height: 25px; } html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact):has(.ff-view-waybills), html body.ff-app[data-grid-font-size="small"]:has(.ff-view-waybills) { --ff-waybill-column-chooser-font-size: 11px; --ff-waybill-column-chooser-line-height: 17px; --ff-waybill-column-chooser-item-height: 23px; } html body.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact):has(.ff-view-waybills) { --ff-waybill-column-chooser-font-size: 13px; --ff-waybill-column-chooser-line-height: 19px; --ff-waybill-column-chooser-item-height: 28px; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-overlay-content { max-height: min(86vh, 820px) !important; width: min(420px, calc(100vw - 24px)) !important; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-popup-title, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-popup-title .dx-toolbar-label, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-popup-content, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-datagrid-column-chooser-list, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-treeview-item, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-checkbox-text { font-size: var(--ff-waybill-column-chooser-font-size) !important; line-height: var(--ff-waybill-column-chooser-line-height) !important; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-popup-title { min-height: 36px !important; padding-bottom: 4px !important; padding-top: 4px !important; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-popup-content { padding: 6px 8px !important; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-datagrid-column-chooser-list.dx-treeview .dx-treeview-item, html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-datagrid-column-chooser-list.dx-treeview .dx-empty-message { min-height: var(--ff-waybill-column-chooser-item-height) !important; padding-bottom: 2px !important; padding-top: 2px !important; } html body.ff-app:has(.ff-view-waybills) .dx-datagrid-column-chooser .dx-treeview-item-content { align-items: center !important; display: inline-flex !important; min-height: var(--ff-waybill-column-chooser-line-height) !important; } /* Final shared grid column chooser density. DevExtreme applies mobile-sized chooser rows on narrow viewports; keep all portal grid choosers aligned with normal/compact density instead. */ html body.ff-app.ff-app { --ff-grid-column-chooser-font-size: 12px; --ff-grid-column-chooser-title-size: 18px; --ff-grid-column-chooser-line-height: 18px; --ff-grid-column-chooser-item-height: 25px; --ff-grid-column-chooser-check-size: 18px; } html body.ff-app.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact), html body.ff-app.ff-app[data-grid-font-size="small"] { --ff-grid-column-chooser-font-size: 11px; --ff-grid-column-chooser-title-size: 16px; --ff-grid-column-chooser-line-height: 16px; --ff-grid-column-chooser-item-height: 22px; --ff-grid-column-chooser-check-size: 16px; } html body.ff-app.ff-app[data-grid-font-size="large"]:not([data-grid-density="compact"]):not(.ff-grid-density-compact) { --ff-grid-column-chooser-font-size: 13px; --ff-grid-column-chooser-title-size: 19px; --ff-grid-column-chooser-line-height: 19px; --ff-grid-column-chooser-item-height: 28px; --ff-grid-column-chooser-check-size: 18px; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-overlay-content { max-height: min(86vh, 820px) !important; width: min(420px, calc(100vw - 24px)) !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title .dx-toolbar-label, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title .dx-toolbar-label > div { font-size: var(--ff-grid-column-chooser-title-size) !important; line-height: 22px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title { min-height: 34px !important; padding: 4px 10px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title .dx-closebutton, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title .dx-closebutton .dx-button-content { height: 26px !important; min-height: 26px !important; width: 26px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-title .dx-closebutton .dx-icon { font-size: 18px !important; height: 18px !important; line-height: 18px !important; width: 18px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-content { padding: 6px 8px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-content, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-popup-content *, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-datagrid-column-chooser-list, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-treeview-item, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-treeview-item-content, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-checkbox-text, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-item-content { font-size: var(--ff-grid-column-chooser-font-size) !important; line-height: var(--ff-grid-column-chooser-line-height) !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-datagrid-column-chooser-list.dx-treeview .dx-treeview-item, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-datagrid-column-chooser-list.dx-treeview .dx-empty-message, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-column-chooser-item { min-height: var(--ff-grid-column-chooser-item-height) !important; padding-bottom: 2px !important; padding-top: 2px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-treeview-node { min-height: var(--ff-grid-column-chooser-item-height) !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-treeview-item-content { align-items: center !important; display: inline-flex !important; min-height: var(--ff-grid-column-chooser-line-height) !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-grid-column-chooser-check-size) !important; max-height: var(--ff-grid-column-chooser-check-size) !important; max-width: var(--ff-grid-column-chooser-check-size) !important; min-height: var(--ff-grid-column-chooser-check-size) !important; min-width: var(--ff-grid-column-chooser-check-size) !important; width: var(--ff-grid-column-chooser-check-size) !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-checkbox { margin-right: 7px !important; } html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app .dx-datagrid-column-chooser.dx-datagrid-column-chooser .dx-checkbox-checked .dx-checkbox-icon:before { font-size: 14px !important; line-height: var(--ff-grid-column-chooser-check-size) !important; } /* Portal-managed grid column chooser. Changes are staged here and applied to the grid only when Apply is clicked. */ html body.ff-app .ff-grid-column-chooser-overlay { align-items: center; background: rgba(15, 23, 42, .08); bottom: 0; display: flex; justify-content: center; left: 0; padding: 10px; position: fixed; right: 0; top: 0; z-index: 10050; } html body.ff-app .ff-grid-column-chooser-dialog { background: var(--surface, #f5f7fb); border: 1px solid var(--border, #cfd6df); border-radius: 8px; box-shadow: 0 8px 22px rgba(15, 23, 42, .18); box-sizing: border-box; color: var(--text, #1f2933); display: flex; flex-direction: column; max-height: min(82vh, 720px); min-height: 300px; padding: 10px; position: relative; width: min(270px, calc(100vw - 16px)); } html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-grid-column-chooser-dialog, html body.ff-app[data-grid-font-size="small"] .ff-grid-column-chooser-dialog { width: min(255px, calc(100vw - 16px)); } html body.ff-app .ff-grid-column-chooser-title { font-size: 14px; font-weight: 600; line-height: 22px; margin: 0 30px 8px 0; min-height: 22px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-grid-column-chooser-title, html body.ff-app[data-grid-font-size="small"] .ff-grid-column-chooser-title { font-size: 13px; line-height: 21px; min-height: 21px; } html body.ff-app .ff-grid-column-chooser-close { align-items: center; background: transparent; border: 0; color: var(--text, #1f2933); display: inline-flex; font-size: 22px; font-weight: 600; height: 22px; justify-content: center; line-height: 22px; margin: 0; padding: 0; position: absolute; right: 7px; top: 5px; width: 22px; } html body.ff-app .ff-grid-column-chooser-search { background: var(--surface, #fff); border: 1px solid var(--border, #aeb7c2); border-radius: 5px; box-sizing: border-box; color: var(--text, #1f2933); font-size: 12px; height: 28px; line-height: 18px; margin: 0 0 6px; padding: 3px 8px; width: 100%; } html body.ff-app .ff-grid-column-chooser-bulk, html body.ff-app .ff-grid-column-chooser-row { align-items: center; box-sizing: border-box; cursor: pointer; display: flex; font-size: 12px; gap: 7px; line-height: 18px; margin: 0; min-height: 24px; padding: 2px 4px; white-space: nowrap; } html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-grid-column-chooser-bulk, html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-grid-column-chooser-row, html body.ff-app[data-grid-font-size="small"] .ff-grid-column-chooser-bulk, html body.ff-app[data-grid-font-size="small"] .ff-grid-column-chooser-row { font-size: 11px; line-height: 16px; min-height: 22px; } html body.ff-app .ff-grid-column-chooser-bulk { border-bottom: 1px solid var(--border, #d7dde5); font-weight: 600; margin-bottom: 4px; padding-bottom: 5px; } html body.ff-app .ff-grid-column-chooser-list { flex: 1 1 auto; min-height: 120px; overflow-x: hidden; overflow-y: auto; padding-right: 2px; } html body.ff-app .ff-grid-column-chooser-row:hover { background: rgba(47, 116, 255, .08); } html body.ff-app .ff-grid-column-chooser-row span { min-width: 0; overflow: hidden; text-overflow: ellipsis; } html body.ff-app .ff-grid-column-chooser-check { accent-color: #2f74ff; flex: 0 0 16px; height: 16px; margin: 0; width: 16px; } html body.ff-app .ff-grid-column-chooser-empty { color: var(--text-muted, #6b7280); font-size: 12px; padding: 10px 4px; } html body.ff-app .ff-grid-column-chooser-footer { align-items: center; border-top: 1px solid var(--border, #d7dde5); display: flex; flex: 0 0 auto; gap: 6px; justify-content: flex-end; margin-top: 8px; padding-top: 8px; } html body.ff-app .ff-grid-column-chooser-footer .btn { align-items: center; display: inline-flex; font-size: 12px; justify-content: center; min-width: 62px; padding: 3px 10px; } html body.ff-app .ff-grid-column-chooser-apply::before { animation: ff-grid-column-chooser-spin .8s linear infinite; border: 2px solid rgba(255, 255, 255, .5); border-top-color: #fff; border-radius: 50%; content: ""; display: none; height: 12px; margin-right: 6px; width: 12px; } html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-apply::before { display: inline-block; } html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-list, html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-bulk, html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-search, html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-close, html body.ff-app .ff-grid-column-chooser-applying .ff-grid-column-chooser-cancel { opacity: .65; } @keyframes ff-grid-column-chooser-spin { to { transform: rotate(360deg); } } /* View Waybills shared row action menu. Keep this at EOF so it wins over the older row-action dropdown styling. */ html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger { align-items: center !important; background: transparent !important; border: 0 !important; border-radius: 6px !important; box-shadow: none !important; color: inherit !important; cursor: pointer !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; left: 50% !important; margin: 0 auto !important; min-height: 0 !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger:focus, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger:hover { background: rgba(59, 117, 247, 0.08) !important; outline: 0 !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa::before, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid .ff-waybill-row-action-trigger > .fa:before { align-items: center !important; display: inline-flex !important; font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; text-align: center !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-backdrop { background: transparent !important; inset: 0 !important; position: fixed !important; z-index: 1499 !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu { background: #fff !important; border: 1px solid #d9e2ef !important; border-radius: 12px !important; box-shadow: 0 14px 32px rgba(15, 23, 42, 0.18) !important; max-width: 240px !important; min-width: 220px !important; overflow: hidden !important; padding: 8px 0 !important; position: fixed !important; z-index: 1500 !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-item { align-items: center !important; background: transparent !important; border: 0 !important; color: #1f2937 !important; cursor: pointer !important; display: flex !important; gap: 14px !important; justify-content: flex-start !important; padding: 12px 18px !important; text-align: left !important; width: 100% !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-item:hover, html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-item:focus { background: rgba(59, 117, 247, 0.08) !important; outline: 0 !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-item[disabled] { color: #9aa4b2 !important; cursor: default !important; } html body.ff-app .ff-view-waybills .ff-waybill-row-action-menu-item > .fa { flex: 0 0 24px !important; font-size: 20px !important; text-align: center !important; } /* Waybill filter list inputs: allow pasted multi-value lists without making every textarea tall. */ html body.ff-app .ff-waybill textarea.form-control.ff-multi-value-filter, html body.ff-app .ff-generate-manifest textarea.form-control.ff-multi-value-filter { height: calc((var(--ff-control-h, 30px) * 2) + 4px) !important; line-height: 1.25 !important; max-height: 92px !important; min-height: calc((var(--ff-control-h, 30px) * 2) + 4px) !important; overflow-y: auto !important; resize: vertical !important; white-space: pre-wrap !important; } html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-waybill textarea.form-control.ff-multi-value-filter, html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-generate-manifest textarea.form-control.ff-multi-value-filter { height: calc((var(--ff-control-h, 28px) * 2) + 2px) !important; max-height: 78px !important; min-height: calc((var(--ff-control-h, 28px) * 2) + 2px) !important; } /* View Invoices summary grid: match the invoice-detail selector checkbox layout. */ html body.ff-app .ff-view-invoices #clientGridContainer.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: 28px !important; min-width: 28px !important; overflow: visible !important; padding: 0 !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 28px !important; } html body.ff-app .ff-view-invoices #clientGridContainer.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox) { box-sizing: border-box !important; display: inline-flex !important; height: 14px !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; overflow: visible !important; padding: 0 !important; right: auto !important; vertical-align: middle !important; width: 14px !important; } html body.ff-app .ff-view-invoices #clientGridContainer.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; justify-content: center !important; left: 50% !important; margin-left: 0 !important; margin-right: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app .ff-view-invoices #clientGridContainer.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { left: auto !important; position: relative !important; top: auto !important; transform: none !important; } /* View Invoices invoice-drill waybill grid: keep rows dense for high-volume invoices. */ html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills { --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-row-height: 18px !important; --ff-invoice-waybill-row-content-height: 16px !important; --ff-invoice-waybill-row-height: 18px !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-invoice-waybill-row-height) !important; height: var(--ff-invoice-waybill-row-height) !important; line-height: var(--ff-invoice-waybill-row-content-height) !important; max-height: var(--ff-invoice-waybill-row-height) !important; min-height: var(--ff-invoice-waybill-row-height) !important; overflow: hidden !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox { align-items: center !important; display: flex !important; height: var(--ff-townhub-content-height) !important; justify-content: center !important; line-height: var(--ff-townhub-content-height) !important; margin: 0 auto !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; vertical-align: middle !important; width: 100% !important; } html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; aspect-ratio: 1 / 1 !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-selector-size) !important; justify-content: center !important; line-height: var(--ff-townhub-selector-size) !important; margin: 0 !important; max-height: var(--ff-townhub-selector-size) !important; max-width: var(--ff-townhub-selector-size) !important; min-height: var(--ff-townhub-selector-size) !important; min-width: var(--ff-townhub-selector-size) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; transform: none !important; width: var(--ff-townhub-selector-size) !important; } html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview td .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { font-size: calc(var(--ff-townhub-selector-size) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer { display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, span, a, button, .btn, .label, .badge), html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; line-height: var(--ff-invoice-waybill-row-content-height) !important; max-height: var(--ff-invoice-waybill-row-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-invoice-view-waybill-command-col) { height: var(--ff-invoice-waybill-row-height) !important; max-height: var(--ff-invoice-waybill-row-height) !important; min-height: var(--ff-invoice-waybill-row-height) !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { box-sizing: border-box !important; height: 14px !important; line-height: 14px !important; max-height: 14px !important; min-height: 14px !important; width: 14px !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: 28px !important; min-width: 28px !important; overflow: visible !important; padding: 0 !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 28px !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon, .dx-select-checkbox) { box-sizing: border-box !important; display: inline-flex !important; height: 14px !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; overflow: visible !important; padding: 0 !important; right: auto !important; vertical-align: middle !important; width: 14px !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; justify-content: center !important; left: 50% !important; margin-left: 0 !important; margin-right: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { left: auto !important; position: relative !important; top: auto !important; transform: none !important; } html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .ff-invoice-view-waybill-actions, html body.ff-app .ff-view-invoices #waybillGridContainer.ff-standard-grid--invoice-waybills .ff-invoice-view-waybill-actions :is(.dx-dropdownbutton, .dx-button, .dx-button-content, .dx-icon, .dx-icon-overflow) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; max-height: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; padding: 0 !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-invoices .ff-invoice-waybill-context { display: inline-flex; margin-left: 8px; vertical-align: middle; } html body.ff-app .ff-view-invoices .ff-invoice-waybill-toolbar { align-items: center; display: flex; flex-wrap: wrap; gap: 6px; } html body.ff-app .ff-view-invoices .ff-grid-toolbar-inner { align-items: center; display: flex; flex-wrap: wrap; gap: 6px; } html body.ff-app .ff-view-invoices .ff-invoice-detail-mode-btn, html body.ff-app .ff-view-invoices .ff-invoice-waybill-export-btn { align-items: center; display: inline-flex; height: 24px !important; justify-content: center; min-height: 24px !important; min-width: 28px !important; padding: 2px 6px !important; width: 28px !important; } html body.ff-app .ff-view-invoices .ff-invoice-detail-mode-btn--compact { background-color: var(--primary-700, #1f5fd8) !important; border-color: var(--primary-700, #1f5fd8) !important; } html body.ff-app .ff-view-invoices .ff-invoice-detail-mode-btn .fa, html body.ff-app .ff-view-invoices .ff-invoice-waybill-export-btn .fa { font-size: 13px !important; line-height: 1 !important; } html body.ff-app .ff-view-invoices .ff-invoice-waybill-toolbar-spacer { flex: 1 1 auto; } html body.ff-app .ff-view-invoices .ff-invoice-detail-back { align-items: center; display: inline-flex; font-weight: 700; gap: 6px; min-height: 34px; padding: 6px 14px; } /* Final View Waybills native-scroll density lock. Keep the most-used grid on the accepted compact 18px data-row height after all shared standard-grid and DevExtreme repaint work has settled. */ html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills { --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-view-waybills-image-link-line-height: 16px !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { border-bottom: 0 !important; border-top: 0 !important; block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 11px) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { box-shadow: inset 0 -1px 0 var(--border, #d7dde5) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-waybill-select-col, .ff-waybill-command-col, .ff-waybill-image-link-col) { height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa::before, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa:before { box-sizing: border-box !important; height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa::before, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa:before { font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: var(--ff-standard-grid-action-size) !important; min-width: var(--ff-standard-grid-action-size) !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-image-link-col > .dx-template-wrapper, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-image-link-col a { align-items: center !important; display: inline-flex !important; height: var(--ff-view-waybills-image-link-line-height) !important; line-height: var(--ff-view-waybills-image-link-line-height) !important; margin: 0 !important; max-height: var(--ff-view-waybills-image-link-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } /* Final View Waybills command-template density lock. The selector and row-action templates render after the first data paint, so keep those late cells from increasing the accepted compact row height. */ html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, td.dx-command-edit, th.dx-command-edit, .dx-command-select, .dx-command-edit, .ff-waybill-select-col, .ff-waybill-command-col) { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-command-col > .dx-template-wrapper { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; display: block !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; position: relative !important; width: 100% !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; padding: 0 !important; position: relative !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills .ff-waybill-row-action-trigger { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Final View Manifests filter action alignment. The live page uses ff-view-manifests-simple, so target both page markers. */ html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) .ff-sr-card > .row > :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-actions) { align-self: flex-start !important; padding-top: 20px !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) .ff-sr-card > .row > .ff-manifest-filter-actions { display: flex !important; justify-content: flex-end !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; min-height: var(--ff-control-h, 40px) !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) .ff-manifest-filter-submit { gap: 14px !important; justify-content: flex-end !important; width: 100% !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) :is(.checkbox, .checkbox-inline, .valuesonly, .check-inline) { align-items: center !important; display: inline-flex !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-h, 40px) !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) .clip-check label { align-items: center !important; display: inline-flex !important; line-height: 20px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: var(--ff-control-h, 40px) !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) .clip-check label::before, html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) .clip-check label:before, html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) .clip-check input[type="checkbox"]:checked + label::after, html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) :is(.ff-manifest-filter-options-under-webuser, .ff-manifest-filter-submit) .clip-check input[type="checkbox"]:checked + label:after { top: 50% !important; transform: translateY(-50%) !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple) .ff-manifest-clear-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; height: var(--ff-control-h, 40px) !important; justify-content: center !important; line-height: calc(var(--ff-control-h, 40px) - 2px) !important; margin: 0 !important; min-height: var(--ff-control-h, 40px) !important; min-width: 92px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Native standard-grid row density guard. Native-scroll grids must not rely on post-render row measurement; keep every pane on the CSS row variables from the first paint. */ html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td { border-bottom: 0 !important; border-top: 0 !important; block-size: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 11px) !important; height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; line-height: var(--ff-standard-grid-cell-line-height, calc(var(--ff-grid-row-height, 20px) - 2px)) !important; max-height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; min-height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y, var(--ff-grid-cell-padding-y, 0)) !important; padding-top: var(--ff-standard-grid-cell-padding-y, var(--ff-grid-cell-padding-y, 0)) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td { box-shadow: inset 0 -1px 0 var(--border, #d7dde5) !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img), html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height, calc(var(--ff-grid-row-height, 20px) - 2px)) !important; line-height: var(--ff-standard-grid-cell-line-height, calc(var(--ff-grid-row-height, 20px) - 2px)) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height, calc(var(--ff-grid-row-height, 20px) - 2px)) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .dx-command-expand, [class*="command-col"], [class*="select-col"]) { height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; line-height: var(--ff-standard-grid-cell-line-height, calc(var(--ff-grid-row-height, 20px) - 2px)) !important; max-height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; min-height: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 20px)) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y, var(--ff-grid-cell-padding-y, 0)) !important; padding-top: var(--ff-standard-grid-cell-padding-y, var(--ff-grid-cell-padding-y, 0)) !important; position: relative !important; text-align: center !important; transition: none !important; vertical-align: middle !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { box-sizing: border-box !important; height: var(--ff-standard-grid-check-size, 14px) !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; padding: 0 !important; transition: none !important; width: var(--ff-standard-grid-check-size, 14px) !important; } /* Final View Waybills async-template row-height clamp. Async selector/action templates render after the first result paint; keep their wrappers from growing rows past the compact row variable. */ html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-view-waybills-image-link-line-height: 16px !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { border-bottom: 0 !important; border-top: 0 !important; block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(td.dx-command-select, td.dx-command-edit, td.ff-waybill-select-col, td.ff-waybill-command-col, td.ff-waybill-image-link-col) { padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-widget, .dx-button, .dx-button-content), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-command-col > .dx-template-wrapper, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-image-link-col > .dx-template-wrapper { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.dx-command-select :is(.dx-checkbox, .dx-select-checkbox), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.ff-waybill-select-col :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; justify-content: center !important; left: 50% !important; margin: 0 !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.dx-command-select input[type="checkbox"] { box-sizing: border-box !important; height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; padding: 0 !important; transition: none !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-checkbox-container, .dx-checkbox-wrapper) { align-items: center !important; display: inline-flex !important; justify-content: center !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .ff-waybill-row-action-trigger { align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa::before, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .ff-waybill-row-action-trigger > .fa:before { display: inline-block !important; font-size: var(--ff-standard-grid-action-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { border-collapse: collapse !important; border-spacing: 0 !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview tr.dx-row-lines > td, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid-native-scroll.ff-standard-grid-native-scroll.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview tr.dx-data-row.dx-row-lines > td { border-bottom-width: 0 !important; border-top-width: 0 !important; } /* Final View Waybills rendered-row guard. */ html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 304px), 900px) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-row-height: 18px !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td::before, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td::after, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td *, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td *::before, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td *::after { box-sizing: border-box !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; } html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills .dx-datagrid-rowsview td.dx-command-select input[type="checkbox"] { height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } /* Final standard-grid selector checkbox shape and partial-selection fill. Keep partial select visible in blue headers without turning the whole box blue. */ html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { border-radius: 2px !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background-color: var(--primary, #2f7df6) !important; border-radius: 1px !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; line-height: 8px !important; margin: 0 !important; max-height: 8px !important; max-width: 8px !important; min-height: 8px !important; min-width: 8px !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } /* Final CSS-first standard-grid viewport lock. View grids must not repaint once with a fallback height and again with a measured height. Each page's --ff-standard-grid-rows-max-height is the final rows viewport; resize is handled by the CSS dvh/vh calculation. */ html body.ff-app .ff-standard-grid-page.ff-standard-grid-page:not(.ff-debriefing):not(.ff-view-query):not(.ff-view-ops-fin-query) :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid { --ff-standard-grid-effective-rows-height: min(var(--ff-standard-grid-measured-rows-height, var(--ff-standard-grid-rows-max-height)), var(--ff-standard-grid-rows-max-height)) !important; min-height: calc( var(--ff-standard-grid-effective-rows-height, var(--ff-standard-grid-rows-max-height, 320px)) + var(--ff-standard-grid-header-height, 24px) + var(--ff-standard-grid-filter-height, 24px) + var(--ff-standard-grid-total-footer-height, 0px) + var(--ff-standard-grid-pager-height, 22px) ) !important; } html body.ff-app .ff-standard-grid-page.ff-standard-grid-page:not(.ff-debriefing):not(.ff-view-query):not(.ff-view-ops-fin-query) :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app .ff-standard-grid-page.ff-standard-grid-page:not(.ff-debriefing):not(.ff-view-query):not(.ff-view-ops-fin-query) :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } /* Credit/Debit totals need the measured short-result path so the totals footer sits directly below one/few data rows instead of at the bottom of a tall grid. */ html body.ff-app .ff-view-crdr.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-measured-rows-height, var(--ff-standard-grid-rows-max-height)) !important; --ff-standard-grid-min-rows-height: 32px !important; --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 268px)); --ff-standard-grid-short-result-row-limit: 18 !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 288px)); } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-crdr.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 268px); } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-crdr.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 288px); } } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-has-data:not(.ff-grid-loading) :is(.dx-datagrid-headers, .dx-datagrid-total-footer) { display: block !important; height: auto !important; line-height: normal !important; margin: 0 !important; max-height: none !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; visibility: visible !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-has-data:not(.ff-grid-loading) .dx-datagrid-header-panel { display: block !important; flex: 0 0 0 !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 1 !important; overflow: hidden !important; padding: 0 !important; visibility: visible !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-has-data:not(.ff-grid-loading) .dx-datagrid-header-panel :is(.dx-toolbar, .dx-toolbar-items-container, .dx-toolbar-before, .dx-toolbar-center, .dx-toolbar-after) { height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer.ff-standard-grid.ff-grid-has-data:not(.ff-grid-loading) :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-standard-grid-pager-height) !important; height: var(--ff-standard-grid-pager-height) !important; max-height: var(--ff-standard-grid-pager-height) !important; min-height: var(--ff-standard-grid-pager-height) !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; } html body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-row--rendering #gridContainer.ff-standard-grid { min-height: calc( var(--ff-standard-grid-rows-max-height, 320px) + var(--ff-standard-grid-header-height, 24px) + var(--ff-standard-grid-filter-height, 24px) + var(--ff-standard-grid-total-footer-height, 0px) + var(--ff-standard-grid-pager-height, 22px) ) !important; opacity: 0 !important; pointer-events: none !important; transition: none !important; visibility: visible !important; } html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid:is(.ff-standard-grid-pager-loading, .ff-waybill-page-loading) .dx-pager .dx-pages .dx-page.dx-selection { color: transparent !important; position: relative !important; } html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid:is(.ff-standard-grid-pager-loading, .ff-waybill-page-size-loading) .dx-pager .dx-page-sizes .dx-page-size.dx-selection { color: transparent !important; position: relative !important; } html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid:is(.ff-standard-grid-pager-loading, .ff-waybill-page-loading) .dx-pager .dx-pages .dx-page.dx-selection::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(255, 255, 255, 0.45) !important; border-top-color: #fff !important; border-radius: 50% !important; content: "" !important; height: 12px !important; left: 50% !important; margin-left: -6px !important; margin-top: -6px !important; position: absolute !important; top: 50% !important; width: 12px !important; } html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid:is(.ff-standard-grid-pager-loading, .ff-waybill-page-size-loading) .dx-pager .dx-page-sizes .dx-page-size.dx-selection::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(255, 255, 255, 0.45) !important; border-top-color: #fff !important; border-radius: 50% !important; content: "" !important; height: 12px !important; left: 50% !important; margin-left: -6px !important; margin-top: -6px !important; position: absolute !important; top: 50% !important; width: 12px !important; } /* Final Debtors standard-grid page-fit. Debtors was still using the legacy accordion/auto-height path; keep the filter overlaid and make the grid rows viewport a CSS-owned value like View Waybills so searches do not grow the page after data binds. */ html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page { --ff-grid-cell-padding-y: 1px !important; --ff-grid-row-height: 22px !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-cell-line-height: 19px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-filter-height: 24px !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-header-height: 24px !important; --ff-standard-grid-pager-height: 22px !important; --ff-standard-grid-row-height: 22px !important; --ff-standard-grid-rows-max-height: max(300px, calc(100dvh - 286px)); --ff-standard-grid-total-footer-height: 24px !important; --ff-debtors-select-column-width: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page { --ff-standard-grid-rows-max-height: max(300px, calc(100dvh - 306px)); } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page { --ff-standard-grid-rows-max-height: calc(100vh - 286px); } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page { --ff-standard-grid-rows-max-height: calc(100vh - 306px); } } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page > .container-fullw, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page > .container-fluid.container-fullw { padding-right: 9px !important; padding-top: 0 !important; position: relative !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page .ff-debtors-results, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page .ff-grid-result-row, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page .ff-grid-result-row > [class*="col-"], html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.dx-datagrid, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid > .dx-datagrid, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content { min-height: 100% !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { box-sizing: border-box !important; height: var(--ff-standard-grid-total-footer-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-total-footer-height) !important; min-height: var(--ff-standard-grid-total-footer-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, input), html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer td :is(span, div, .dx-datagrid-summary-item) { line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .dx-command-select > td) { max-width: var(--ff-debtors-select-column-width) !important; min-width: var(--ff-debtors-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-debtors-select-column-width) !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-command-select, .dx-command-edit) { height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; } html body.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } /* Final View Payments page-fit and command icon parity. Payments has a 30px command column; keep the icon centered and consistent with the other migrated view grids without widening that column. */ html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid { --ff-finance-view-action-size: 16px !important; --ff-standard-grid-action-size: 16px !important; --ff-view-payments-command-column-width: 30px !important; } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, td.ff-payments-view-command-col, .ff-payments-view-command-col), html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, td.ff-payments-view-command-col, .ff-payments-view-command-col) > td { box-sizing: border-box !important; max-width: var(--ff-view-payments-command-column-width) !important; min-width: var(--ff-view-payments-command-column-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-payments-command-column-width) !important; } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-payments-view-command-col, .ff-payments-view-command-col) :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-finance-view-action-size) !important; justify-content: center !important; line-height: var(--ff-finance-view-action-size) !important; margin: 0 !important; max-height: var(--ff-finance-view-action-size) !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-finance-view-action-size) !important; } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-payments-view-command-col, .ff-payments-view-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa.fa-eye), html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-payments-view-command-col, .ff-payments-view-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa.fa-eye)::before { display: inline-block !important; font-size: var(--ff-finance-view-action-size) !important; height: var(--ff-finance-view-action-size) !important; line-height: var(--ff-finance-view-action-size) !important; margin: 0 !important; max-height: var(--ff-finance-view-action-size) !important; max-width: var(--ff-finance-view-action-size) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-finance-view-action-size) !important; } html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-grid-row--hidden { height: 0 !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-grid-row--hidden > [class*="col-"], html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-grid-row--hidden #gridContainer { height: 1px !important; min-height: 1px !important; overflow: hidden !important; } html body.ff-app .ff-query.ff-standard-grid-page.ff-query-loading .ff-query-loading-row { display: block !important; height: auto !important; margin-bottom: 4px !important; margin-top: 4px !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; } html body.ff-app .ff-query.ff-standard-grid-page.ff-query-loading .ff-query-loading-row > [class*="col-"] { padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid:not(.ff-grid-loading):not(.ff-grid-has-data):not(.ff-grid-filter-active) :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { display: none !important; flex: 0 0 0 !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row > [class*="col-"], html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .ff-standard-filter-overlay-panel, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .accordion-no-display, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .ff-waybill, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .ff-sr-card, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .range-picker, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .input-icon, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .start-date, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .end-date { overflow: visible !important; } html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .ff-standard-filter-overlay-panel, html body.ff-app .ff-imaging-list.ff-image-standard-page .ff-image-filter-row .ff-sr-card { contain: none !important; max-height: none !important; } html body.ff-app .uib-datepicker-popup.dropdown-menu { z-index: 3000 !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 239px)); } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 259px)); } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page { --ff-standard-grid-rows-max-height: calc(100vh - 239px); } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page { --ff-standard-grid-rows-max-height: calc(100vh - 259px); } } /* View Invoices summary final fit and selector alignment. Keep the summary grid inside the viewport footer area and centre the DevExtreme selector checkbox after the shared standard-grid rules. */ html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid { --ff-invoice-summary-selector-width: 30px; --ff-invoice-summary-selector-nudge-x: -2px; --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 251px)) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices.ff-standard-grid-page:not(.ff-view-compact) #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 271px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: calc(100vh - 251px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices.ff-standard-grid-page:not(.ff-view-compact) #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: calc(100vh - 271px) !important; } } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: var(--ff-invoice-summary-selector-width, 30px) !important; min-width: var(--ff-invoice-summary-selector-width, 30px) !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-summary-selector-width, 30px) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; bottom: auto !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-standard-grid-check-size, 16px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 16px) !important; max-width: var(--ff-standard-grid-check-size, 16px) !important; min-height: var(--ff-standard-grid-check-size, 16px) !important; min-width: var(--ff-standard-grid-check-size, 16px) !important; padding: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(calc(-50% + var(--ff-invoice-summary-selector-nudge-x, 0px)), -50%) !important; width: var(--ff-standard-grid-check-size, 16px) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 16px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 16px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 16px) !important; max-width: var(--ff-standard-grid-check-size, 16px) !important; min-height: var(--ff-standard-grid-check-size, 16px) !important; min-width: var(--ff-standard-grid-check-size, 16px) !important; padding: 0 !important; width: var(--ff-standard-grid-check-size, 16px) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* View Invoices waybill detail final fit. The drilldown grid has its own totals footer and a wider action toolbar; reserve that chrome so only the grid scrolls and the browser page does not. */ html body.ff-app .ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid--invoice-waybills { --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 299px)) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-measured-rows-height, var(--ff-standard-grid-rows-max-height)) !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices.ff-standard-grid-page:not(.ff-view-compact) #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid--invoice-waybills { --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 319px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid--invoice-waybills { --ff-standard-grid-rows-max-height: calc(100vh - 299px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-invoices.ff-standard-grid-page:not(.ff-view-compact) #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid--invoice-waybills { --ff-standard-grid-rows-max-height: calc(100vh - 319px) !important; } } /* View Manifests final viewport fit. The manifest grid has a totals footer and page-size pager below the rows; reserve that chrome so the browser page itself does not scroll. */ html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-min-rows-height: 180px !important; --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 318px)); --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height); --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 338px)); } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: calc(100vh - 318px); } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: calc(100vh - 338px); } } /* View Manifests final loading/density guard. Keep loading feedback to one page spinner and enforce compact rows on the simple page class that the live View Manifests page uses. */ html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-grid-row-height: 18px !important; --ff-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-view-manifests-cell-height-final: 16px !important; --ff-view-manifests-fixed-row-height: 18px !important; --ff-view-manifests-fixed-row-height-final: 18px !important; --ff-view-manifests-row-height: 18px !important; --ff-view-manifests-row-height-final: 18px !important; --ff-view-manifests-row-height-normal: 18px !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-grid-loading { min-height: 160px !important; position: relative !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-grid-loading::before, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-grid-loading::after { animation: none !important; content: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 11px) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x, 4px) !important; padding-right: var(--ff-standard-grid-cell-padding-x, 4px) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link, .ff-manifest-row-actions, .ff-manifest-row-action), html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { font-size: inherit !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-grid-loading :is(.dx-datagrid-header-panel, .dx-datagrid-headers) { display: block !important; flex: 0 0 auto !important; height: auto !important; line-height: normal !important; margin: 0 !important; max-height: none !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; visibility: visible !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"]) { display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app:has(.ff-view-manifests-simple.ff-standard-grid-page #gridContainer.ff-standard-grid--manifests.ff-grid-loading) > :is(.dx-overlay-wrapper.dx-loadpanel-wrapper, .dx-loadpanel-wrapper) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple, .ff-view-quotes) .ff-grid-toolbar-row .ff-grid-option-copy-on-click, html body.ff-app :is(.ff-view-manifests, .ff-view-manifests-simple, .ff-view-quotes) .ff-grid-toolbar-row .ff-grid-option-show-values { align-items: center !important; display: inline-flex !important; padding-top: 0 !important; vertical-align: middle !important; } /* View Quotes final viewport and filter overflow guard. Keep the quotes grid inside the visible page footer and let body-appended date pickers paint outside the filter card. */ html body.ff-app .ff-view-quotes.ff-standard-grid-page, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 330px)) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-short-result-padding: 8px !important; --ff-standard-grid-short-result-min-rows-height: 0px !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 350px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-quotes.ff-standard-grid-page, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes { --ff-standard-grid-rows-max-height: calc(100vh - 330px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes { --ff-standard-grid-rows-max-height: calc(100vh - 350px) !important; } } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *), html body.ff-app:has(.ff-view-quotes.ff-standard-grid-page #gridContainer.ff-standard-grid--quotes) > :is(.dx-overlay-wrapper.dx-loadpanel-wrapper, .dx-loadpanel-wrapper, .dx-loadpanel) { animation: none !important; display: none !important; height: 0 !important; max-height: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-pager-loading .dx-pager .dx-pages .dx-page.dx-selection, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-waybill-pager-loading .dx-pager .dx-pages .dx-page.dx-selection { color: inherit !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-pager-loading .dx-pager .dx-pages .dx-page.dx-selection::after, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-waybill-pager-loading .dx-pager .dx-pages .dx-page.dx-selection::after, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-grid-loading::before, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-grid-loading::after { animation: none !important; content: none !important; display: none !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page .ff-standard-filter-overlay-row, html body.ff-app .ff-view-quotes.ff-standard-grid-page .ff-standard-filter-overlay-panel, html body.ff-app .ff-view-quotes.ff-standard-grid-page .ff-standard-filter-inline-row, html body.ff-app .ff-view-quotes.ff-standard-grid-page .accordion-no-display, html body.ff-app .ff-view-quotes.ff-standard-grid-page .ff-waybill, html body.ff-app .ff-view-quotes.ff-standard-grid-page .ff-sr-card, html body.ff-app .ff-view-quotes.ff-standard-grid-page .range-picker, html body.ff-app .ff-view-quotes.ff-standard-grid-page .input-icon, html body.ff-app .ff-view-quotes.ff-standard-grid-page .start-date, html body.ff-app .ff-view-quotes.ff-standard-grid-page .end-date { contain: none !important; max-height: none !important; overflow: visible !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; bottom: auto !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-standard-grid-check-size, 16px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 16px) !important; max-width: var(--ff-standard-grid-check-size, 16px) !important; min-height: var(--ff-standard-grid-check-size, 16px) !important; min-width: var(--ff-standard-grid-check-size, 16px) !important; padding: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-standard-grid-check-size, 16px) !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; border-radius: 3px !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 16px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 16px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 16px) !important; max-width: var(--ff-standard-grid-check-size, 16px) !important; min-height: var(--ff-standard-grid-check-size, 16px) !important; min-width: var(--ff-standard-grid-check-size, 16px) !important; padding: 0 !important; width: var(--ff-standard-grid-check-size, 16px) !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* View Quotes totals fit. Let the current page's real rows define short-result height, and keep total cells visibly separated so each tally lines up with its column. */ html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-short-result { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-measured-rows-height, 140px) !important; --ff-standard-grid-min-rows-height: 32px !important; } html body.ff-app .ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { border-left: 1px solid #ddd !important; border-right: 1px solid #ddd !important; border-top: 1px solid #ddd !important; height: var(--ff-standard-grid-total-footer-height, 24px) !important; line-height: calc(var(--ff-standard-grid-total-footer-height, 24px) - 2px) !important; max-height: var(--ff-standard-grid-total-footer-height, 24px) !important; min-height: var(--ff-standard-grid-total-footer-height, 24px) !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } /* Final shared standard/query filter-row placeholder centering. DevExtreme keeps the input container baseline-aligned by default, which makes Select... sit low inside dropdown filter editors on the migrated grids. */ html body.ff-app :is(.ff-standard-grid-page, .ff-query-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer) .dx-datagrid-filter-row :is(.dx-texteditor-container, .dx-texteditor-input-container, .dx-dropdowneditor-input-wrapper, .dx-texteditor-buttons-container) { align-items: center !important; } html body.ff-app :is(.ff-standard-grid-page, .ff-query-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer) .dx-datagrid-filter-row .dx-texteditor-input { padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app :is(.ff-standard-grid-page, .ff-query-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer) .dx-datagrid-filter-row .dx-placeholder { align-items: center !important; display: flex !important; } html body.ff-app :is(.ff-standard-grid-page, .ff-query-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer) .dx-datagrid-filter-row .dx-placeholder::after { display: none !important; } /* Debriefing header selector glyph centering. Older page-local checkbox rules still nudge the inner tick/dash off-centre. */ html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { inset-inline-start: 50% !important; left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Final View Waybills spacer-row collapse. The grid uses standard scrolling, so DevExtreme virtual/freespace rows are layout noise here and must not reserve a blank row under the filter row. */ html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-freespace-row, tr.dx-virtual-row), html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-freespace-row, tr.dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } /* Final short-result footer fit. Standard view grids with only a few rows should not leave DevExtreme's blank filler body between the last real row and the totals footer. */ html body.ff-app .ff-standard-grid-page:not(.ff-debriefing) :is(#gridContainer#gridContainer, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-standard-grid-page:not(.ff-debriefing) :is(#gridContainer#gridContainer, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview :is(tr.dx-freespace-row, tr.dx-virtual-row), html body.ff-app .ff-standard-grid-page:not(.ff-debriefing) :is(#gridContainer#gridContainer, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview :is(tr.dx-freespace-row, tr.dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } /* Credit/Debit short-result totals alignment. Keep the totals row immediately below the visible credit/debit rows, and keep footer cell borders visible so totals can be matched to headers. */ html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-measured-rows-height, 140px) !important; --ff-standard-grid-min-rows-height: 32px !important; --ff-standard-grid-short-result-padding: 8px !important; --ff-standard-grid-short-result-min-rows-height: 0px !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-datagrid, html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-view-crdr.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-short-result .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { border-left: 1px solid #ddd !important; border-right: 1px solid #ddd !important; border-top: 1px solid #ddd !important; height: 24px !important; line-height: 22px !important; max-height: 24px !important; min-height: 24px !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } /* Final View Invoices summary selector nudge. The selector column is a fixed command column, so centre every DevExtreme checkbox wrapper and apply the same slight left correction in header/rows. */ html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox, input[type="checkbox"]) { left: 50% !important; margin-left: 0 !important; margin-right: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(calc(-50% + var(--ff-invoice-summary-selector-nudge-x, -2px)), -50%) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { margin-left: 0 !important; margin-right: 0 !important; } /* Final Debriefing native-scroll viewport clamp. Keep the rows viewport on CSS variables only. The shared standard-grid helper may refresh state, but it must not drive a post-load height feedback loop. */ html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-native-scroll { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; transition: none !important; width: 100% !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-native-scroll :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; transition: none !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; transition: none !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; transition: none !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-native-scroll .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Final Debriefing filter action alignment. The shared filter partial keeps SEARCH on the right; Debriefing also needs CLEAR anchored to the left of the action row. */ html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions { align-items: center !important; display: grid !important; gap: 8px 12px !important; grid-template-columns: auto minmax(0, 1fr) auto auto !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions::before, html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions::after { content: none !important; display: none !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions :is(.btn, .valuesonly, .checkbox) { float: none !important; margin: 0 !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-clear { grid-column: 1 !important; justify-self: start !important; order: 0 !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-show-dormant { grid-column: 3 !important; justify-self: end !important; order: 10 !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-search { grid-column: 4 !important; justify-self: end !important; margin-left: 0 !important; min-width: 190px !important; order: 20 !important; } @media (max-width: 760px) { html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions { grid-template-columns: 1fr !important; } html body.ff-app .ff-debriefing .ff-sr-card .ff-filter-actions :is(.ff-filter-clear, .ff-filter-show-dormant, .ff-filter-search) { grid-column: 1 !important; justify-self: stretch !important; } } /* Absolute-final Receiver Master filter and width containment. Receivers has many columns, so the horizontal overflow must stay inside the grid rows viewport instead of widening the page and hiding the right pager. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-card { margin-bottom: 8px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-legend { align-items: center !important; background: transparent !important; border: 0 !important; display: inline-flex !important; gap: 6px !important; line-height: 1 !important; padding: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-legend .ff-sr-legend__text { align-items: center !important; background: var(--surface-2) !important; border: 1px solid var(--divider) !important; border-radius: 999px !important; color: var(--text-muted) !important; display: inline-flex !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: .08em !important; padding: 6px 10px !important; text-transform: uppercase !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-title-clear, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-title-clear:is(:hover, :focus, :active, .active) { align-items: center !important; background: color-mix(in srgb, var(--error) 6%, var(--surface)) !important; border-color: color-mix(in srgb, var(--error) 55%, var(--border)) !important; border-radius: 999px !important; color: var(--error) !important; display: inline-flex !important; height: 26px !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; min-height: 26px !important; min-width: 26px !important; opacity: .85 !important; padding: 0 !important; position: static !important; transform: none !important; width: 26px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-title-clear:hover { opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-title-clear > .fa { font-size: 13px !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row { align-items: flex-end !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row > [class*="col-"] { float: none !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-clear-filter-field { display: none !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-keep-filter-field { align-items: center !important; display: flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 118px !important; padding-top: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-keep-filter { align-items: center !important; display: inline-flex !important; height: var(--ff-control-h, 30px) !important; margin: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-keep-filter .checkbox { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-filter-close-field, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-search-field { margin-left: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-keep-filter-field, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-filter-close-field, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-view-compact .ff-receivers-filter-secondary-row--has-dates .ff-receivers-keep-filter-field, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-view-compact .ff-receivers-filter-secondary-row--has-dates .ff-receivers-filter-close-field { padding-top: 12px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-receivers-results, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-receivers-results > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-pager.dx-pager, .dx-pager) { box-sizing: border-box !important; overflow: visible !important; padding-right: 44px !important; } /* Absolute-last View Waybills filter action lock. The shared footer can inherit competing auto margins; keep the close X fixed immediately beside SEARCH so the target cannot slide while the user clicks. */ html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions-slot--bottom, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions-row { box-sizing: border-box !important; display: block !important; grid-column: 1 / -1 !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions { align-items: center !important; box-sizing: border-box !important; column-gap: 8px !important; display: grid !important; grid-template-columns: minmax(0, 1fr) var(--ff-control-h, 30px) minmax(190px, 242px) !important; justify-content: stretch !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-show-dormant { grid-column: 1 !important; justify-self: start !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-close, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-close:is(:hover, :focus, :active, .active) { grid-column: 2 !important; justify-self: end !important; margin-left: 0 !important; margin-right: 0 !important; order: initial !important; transition: none !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-search { grid-column: 3 !important; justify-self: stretch !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 190px !important; order: initial !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-pager .dx-pages { overflow: visible !important; padding-right: 6px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-pager :is(.dx-next-button, .dx-navigate-button.dx-next-button) { margin-right: 10px !important; opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 3 !important; } /* Final View Payments viewport and horizontal sync. Match the working invoice-style page fit and keep header, body, filter row, and totals on one explicit scroll width so they cannot drift apart. */ html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page, html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 269px)) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-total-footer-height: 24px !important; --ff-view-payments-horizontal-width-final: var(--ff-view-payments-horizontal-width, 100%) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 289px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page, html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments { --ff-standard-grid-rows-max-height: calc(100vh - 269px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments { --ff-standard-grid-rows-max-height: calc(100vh - 289px) !important; } } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-view-payments-horizontal-width-final) !important; width: var(--ff-view-payments-horizontal-width-final) !important; } html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: var(--ff-view-payments-horizontal-width-final) !important; table-layout: fixed !important; width: var(--ff-view-payments-horizontal-width-final) !important; } /* Final standard-grid scrollbar hitbox and invoice selector guard. Keep DevExtreme's scroll math intact, but remove extra visual thumb inset so the click/drag target matches the visible scrollbar slider. */ html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) { margin: 0 !important; padding: 0 !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollbar-horizontal, .dx-scrollbar-vertical, .dx-scrollable-scrollbar, .dx-scrollable-scrollbar-horizontal, .dx-scrollable-scrollbar-vertical) :is(.dx-scrollable-scroll, .dx-scroll, .dx-scrollable-scroll-content) { border: 0 !important; box-sizing: border-box !important; margin: 0 !important; padding: 0 !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-native .dx-scrollable-container::-webkit-scrollbar-thumb, html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-native .dx-scrollable-container::-webkit-scrollbar-thumb:hover, html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-native .dx-scrollable-container::-webkit-scrollbar-thumb:active { border: 0 !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients { --ff-invoice-summary-selector-width: 22px; --ff-invoice-summary-selector-left: 1px; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { max-width: var(--ff-invoice-summary-selector-width, 22px) !important; min-width: var(--ff-invoice-summary-selector-width, 22px) !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: left !important; width: var(--ff-invoice-summary-selector-width, 22px) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-select-checkbox, input[type="checkbox"]) { left: var(--ff-invoice-summary-selector-left, 1px) !important; margin-left: 0 !important; margin-right: 0 !important; position: absolute !important; right: auto !important; transform: translateY(-50%) !important; } /* Final invoice selector correction. DevExtreme can keep the generated select cell wider than the configured command width; anchor the visible checkbox widget itself to the left edge. */ html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) { max-width: 22px !important; min-width: 22px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: left !important; width: 22px !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox) { display: inline-flex !important; height: var(--ff-standard-grid-check-size, 16px) !important; left: -3px !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 16px) !important; max-width: var(--ff-standard-grid-check-size, 16px) !important; min-height: var(--ff-standard-grid-check-size, 16px) !important; min-width: var(--ff-standard-grid-check-size, 16px) !important; padding: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translateY(-50%) !important; width: var(--ff-standard-grid-check-size, 16px) !important; } html body.ff-app .ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { margin-left: 0 !important; margin-right: 0 !important; } /* Final View Tracking density and page-fit lock. Tracking uses native DevExtreme scrolling, so keep row density and rows viewport CSS-owned from first paint instead of relying on post-load sizing. */ html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 270px)) !important; --ff-standard-grid-total-footer-height: 0px !important; --ff-tracking-cell-height-final: 16px !important; --ff-tracking-cell-padding-y-final: 0 !important; --ff-tracking-content-height: 16px !important; --ff-tracking-fill-cell-height: 16px !important; --ff-tracking-fill-row-height: 18px !important; --ff-tracking-row-height: 18px !important; --ff-tracking-row-height-final: 18px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 290px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: calc(100vh - 270px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid { --ff-standard-grid-rows-max-height: calc(100vh - 290px) !important; } } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { border-top: 0 !important; block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, button, .btn, .label, .badge, .ff-grid-boolean-checkbox), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } /* Receiver Master final loading and viewport guard. Use the page spinner only, and keep the compact rows viewport CSS-owned so stale measured heights cannot leave blank space below the grid footer. */ html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 248px)) !important; --ff-standard-grid-total-footer-height: 0px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-rows-max-height: max(260px, calc(100dvh - 268px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-rows-max-height: calc(100vh - 248px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-rows-max-height: calc(100vh - 268px) !important; } } html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview, html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app .ff-receivers.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } /* Query final density/loading guard. Query had late legacy overrides that pushed the migrated grid back to 22px rows and showed an old text loading strip. Keep Query on the standard 18px grid contract and leave loading feedback to the portal circle spinner. */ html body.ff-app .app-content.csspinner:has(.ff-query.ff-view-query)::after, html body.ff-app .app-content.loading:has(.ff-query.ff-view-query)::after { animation: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } html body.ff-app .ff-query.ff-standard-grid-page, html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-query-cell-line-height: 16px !important; --ff-query-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-measured-rows-height, var(--ff-standard-grid-rows-max-height)) !important; --ff-standard-grid-min-rows-height: 32px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-short-result-min-rows-height: 0px !important; --ff-standard-grid-short-result-padding: 8px !important; --ff-standard-grid-short-result-row-limit: 18 !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app .ff-query.ff-standard-grid-page .ff-query-loading-row, html body.ff-app .ff-query.ff-standard-grid-page.ff-query-loading .ff-query-loading-row, html body.ff-app .ff-query.ff-standard-grid-page .ff-query-loading-row.ng-hide, html body.ff-app .ff-query.ff-standard-grid-page.ff-query-loading .ff-query-loading-row.ng-hide { display: none !important; height: 0 !important; line-height: 0 !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; visibility: hidden !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { animation: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, button, .btn, .label, .badge, .ff-grid-boolean-checkbox), html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; width: var(--ff-standard-grid-check-size) !important; } /* Tariffs final density/loading guard. Keep Tariffs on the shared 18px row contract and let CSS own the viewport height from first paint, so data binding does not rewrite grid height after the rows arrive. */ html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-min-rows-height: 240px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: max(240px, calc(100dvh - 235px)) !important; --ff-standard-grid-total-footer-height: 0px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs { --ff-standard-grid-rows-max-height: max(240px, calc(100dvh - 255px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs { --ff-standard-grid-rows-max-height: calc(100vh - 235px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs { --ff-standard-grid-rows-max-height: calc(100vh - 255px) !important; } } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs :is(.dx-datagrid, .dx-gridbase-container) { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; transition: none !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; transition: none !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { animation: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, button, .btn, .label, .badge, .ff-grid-boolean-checkbox), html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } /* Tariffs boolean-cell checkbox guard. Keep checked Use Pieces boxes visible and contained so their tick cannot read as a stray mark beside the numeric Factor column. */ html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td :is(.dx-checkbox, .dx-select-checkbox) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 14px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; vertical-align: middle !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox-container { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 14px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox-icon { align-items: center !important; background: #fff !important; border: 1px solid #6f7782 !important; border-radius: 3px !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 14px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { color: #2f7cf6 !important; font-size: calc(var(--ff-standard-grid-check-size, 14px) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* View Waybills final load/reflow guard. Keep the grid visible as soon as it is built, and fill the viewport footer area without relying on a post-load measured-height rewrite. */ html body.ff-app .ff-view-waybills.ff-standard-grid-page, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills { --ff-grid-row-height: 16px !important; --ff-standard-grid-row-height: 16px !important; --ff-standard-grid-cell-line-height: 14px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-action-size: 14px !important; --ff-view-waybills-image-link-line-height: 14px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 252px), 900px) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 260px), 900px) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-waybills.ff-standard-grid-page, html body.ff-app .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: calc(100vh - 260px) !important; } } html body.ff-app .ff-view-waybills.ff-standard-grid-page .ff-view-waybills-grid-row--rendering #gridContainer#gridContainer.ff-standard-grid { opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } /* View Tracking final CSS-owned lock. This wins over the older large-result tracking rules and keeps sizing from being recalculated after data binds. */ html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 242px), 920px) !important; --ff-standard-grid-total-footer-height: 0px !important; --ff-tracking-cell-height-final: 16px !important; --ff-tracking-cell-padding-y-final: 0 !important; --ff-tracking-content-height: 16px !important; --ff-tracking-fill-cell-height: 16px !important; --ff-tracking-fill-row-height: 18px !important; --ff-tracking-row-height: 18px !important; --ff-tracking-row-height-final: 18px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 252px), 920px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-standard-grid-rows-max-height: calc(100vh - 242px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; min-height: 28px !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-option-copy-on-click, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-option-copy-on-click > label { align-items: center !important; display: inline-flex !important; line-height: 22px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 24px !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-option-copy-on-click > input[type="checkbox"] { margin-top: 0 !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-gridbase-container { display: flex !important; flex-direction: column !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: 100% !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-tracking-select-col, .ff-tracking-command-col) { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-tracking-scroll-rows:not(.ff-grid-empty) .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.ff-tracking-command-col, .dx-command-edit) :is(.dx-button, .dx-button-content, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; max-height: 18px !important; min-height: 18px !important; padding: 0 !important; width: 18px !important; } html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.ff-tracking-command-col, .dx-command-edit) :is(.fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye), html body.ff-app .ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview :is(.ff-tracking-command-col, .dx-command-edit) :is(.fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye)::before { font-size: 15px !important; height: 16px !important; line-height: 16px !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; width: 16px !important; } /* View Images final CSS-owned load and viewport lock. Older Image Search rules contain measured and oversized fallback heights; keep this page on a fixed standard-grid viewport with no grid load panel. */ html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-image-search-grid-height: auto !important; --ff-image-search-grid-height-final: auto !important; --ff-image-search-measured-grid-height: auto !important; --ff-image-search-row-height-final: 18px !important; --ff-image-search-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-image-search-rows-height-final: var(--ff-standard-grid-rows-max-height) !important; --ff-image-standard-horizontal-width-final: max(100%, var(--ff-image-standard-horizontal-width, 100%)) !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-command-width: 30px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 270px), 900px) !important; --ff-standard-grid-total-footer-height: 0px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 278px), 900px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 270px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 278px) !important; } } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fullw, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fluid.container-fullw, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"] { height: auto !important; margin-bottom: 0 !important; max-height: none !important; min-height: 0 !important; overflow-y: visible !important; padding-bottom: 0 !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images > .dx-datagrid, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; position: relative !important; width: 100% !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-gridbase-container { display: flex !important; flex-direction: column !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; visibility: visible !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final) !important; width: var(--ff-image-standard-horizontal-width-final) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final) !important; table-layout: fixed !important; width: var(--ff-image-standard-horizontal-width-final) !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { animation: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-grid-loading::before { align-items: center !important; background: rgba(255, 255, 255, 0.94) !important; border: 1px solid #cfd8e3 !important; border-radius: 6px !important; box-shadow: 0 10px 24px rgba(15, 23, 42, 0.16) !important; color: #1f2937 !important; content: "Loading..." !important; display: flex !important; font-weight: 700 !important; height: 46px !important; justify-content: center !important; left: 50% !important; min-width: 170px !important; pointer-events: none !important; position: absolute !important; top: 92px !important; transform: translateX(-50%) !important; z-index: 50 !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-grid-loading::after { content: none !important; display: none !important; } html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.ff-image-command-col, .dx-command-edit) :is(.fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye), html body.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.ff-image-command-col, .dx-command-edit) :is(.fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye)::before { font-size: 16px !important; height: 16px !important; line-height: 16px !important; width: 16px !important; } /* Debriefing final CSS-owned viewport lock. The Debriefing grid keeps the trip-expenses panel above it, so reserve that space up front and do not allow a post-pager measured-height rewrite. */ html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(220px, calc(100dvh - 430px), 760px) !important; --ff-standard-grid-total-footer-height: 0px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing { --ff-standard-grid-rows-max-height: clamp(220px, calc(100dvh - 450px), 760px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing { --ff-standard-grid-rows-max-height: calc(100vh - 430px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing { --ff-standard-grid-rows-max-height: calc(100vh - 450px) !important; } } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; margin-bottom: 0 !important; max-height: none !important; min-height: 0 !important; overflow-y: visible !important; padding-bottom: 0 !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing > .dx-datagrid, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: hidden !important; transition: none !important; width: 100% !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-gridbase-container { display: flex !important; flex-direction: column !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; transition: none !important; visibility: visible !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; min-height: 100% !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: 100% !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { align-items: center !important; display: inline-flex !important; font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *), html body.ff-app:has(.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer.ff-standard-grid--debriefing) > :is(.dx-overlay-wrapper.dx-loadpanel-wrapper, .dx-loadpanel-wrapper, .dx-loadpanel) { animation: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* View Credits/Debits final filter action alignment. Keep the reset/search-type controls at the left of the filter card while the persistent actions remain grouped on the right. */ html body.ff-app .ff-view-crdr .accordion-no-display .ff-sr-card .ff-finance-crdr-actions-row, html body.ff-app .ff-view-crdr .ff-finance-crdr-actions-row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app .ff-view-crdr .accordion-no-display .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions, html body.ff-app .ff-view-crdr .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { align-items: center !important; box-sizing: border-box !important; column-gap: 8px !important; display: grid !important; grid-template-columns: auto auto auto minmax(0, 1fr) auto auto minmax(150px, 190px) !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; row-gap: 2px !important; width: 100% !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-crdr-search-type { grid-column: 2 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-show-dormant { grid-column: 3 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-keep-filter { grid-column: 5 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-close-filter { grid-column: 6 !important; justify-self: end !important; min-width: var(--ff-control-h, 30px) !important; order: initial !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-view-crdr .ff-finance-crdr-actions .ff-finance-search { grid-column: 7 !important; justify-self: stretch !important; min-width: 150px !important; order: initial !important; width: 100% !important; } /* View Invoices final filter action alignment. Keep invoice reset/options left-aligned, with only Keep Open, close, and Search grouped on the right edge of the filter section. */ html body.ff-app .ff-view-invoices .accordion-no-display .ff-sr-card .ff-finance-filter-actions-row, html body.ff-app .ff-view-invoices .ff-finance-filter-actions-row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app .ff-view-invoices .accordion-no-display .ff-sr-card .ff-finance-filter-actions-row > .ff-finance-filter-actions, html body.ff-app .ff-view-invoices .ff-finance-filter-actions-row > .ff-finance-filter-actions { align-items: center !important; box-sizing: border-box !important; column-gap: 8px !important; display: grid !important; grid-template-columns: auto auto auto auto auto minmax(0, 1fr) auto auto minmax(150px, 190px) !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; row-gap: 2px !important; width: 100% !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-unsettled { grid-column: 2 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-fewer-cols { grid-column: 3 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-save-history { grid-column: 4 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-show-dormant { grid-column: 5 !important; justify-self: start !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-keep-filter { grid-column: 7 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-close-filter { grid-column: 8 !important; justify-self: end !important; min-width: var(--ff-control-h, 30px) !important; order: initial !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-view-invoices .ff-finance-filter-actions .ff-finance-search { grid-column: 9 !important; justify-self: stretch !important; min-width: 150px !important; order: initial !important; width: 100% !important; } /* View Invoices should use the portal/page wait spinner during searches, not DevExtreme's smaller grid indicators. */ html body.ff-app .ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-standard-grid :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *), html body.ff-app:has(.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-grid-loading) > :is(.dx-overlay-wrapper.dx-loadpanel-wrapper, .dx-loadpanel-wrapper, .dx-loadpanel) { animation: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* Final standard view filter action order. Keep CLEAR and Show Dormant together on the left; keep Close directly before SEARCH on the right across the migrated view filter panels. */ html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-footer-actions-inner, .ff-image-filter-actions, .ff-query-generic-actions), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-actions, html body.ff-app .ff-view-payments .ff-finance-payment-actions { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 8px !important; justify-content: flex-start !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions)::before, html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions)::after, html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-footer-actions-inner, .ff-image-filter-actions, .ff-query-generic-actions)::before, html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-footer-actions-inner, .ff-image-filter-actions, .ff-query-generic-actions)::after { content: none !important; display: none !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions) :is(.btn, .valuesonly, .checkbox, .clip-radio), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-footer-actions-inner, .ff-image-filter-actions, .ff-query-generic-actions) :is(.btn, .valuesonly, .checkbox, .clip-radio), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-actions :is(.btn, .valuesonly, .checkbox, .clip-radio), html body.ff-app .ff-view-payments .ff-finance-payment-actions :is(.btn, .valuesonly, .checkbox, .clip-radio) { float: none !important; grid-column: auto !important; justify-self: auto !important; margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-clear, .ff-finance-clear) { margin-left: 0 !important; order: 0 !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-show-dormant, .ff-finance-show-dormant) { margin-left: 0 !important; order: 1 !important; white-space: nowrap !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-finance-crdr-search-type, .ff-finance-unsettled, .ff-finance-fewer-cols, .ff-finance-save-history) { margin-left: 0 !important; order: 2 !important; white-space: nowrap !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-keep-open, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-tariff-keep-filter), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-keep-open, html body.ff-app .ff-view-payments .ff-finance-keep-filter { margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-close, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-close, html body.ff-app .ff-view-payments .ff-finance-close-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-image-filter-actions, .ff-query-generic-actions):not(:has(:is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter))) :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-footer-actions-inner, .ff-image-filter-actions, .ff-query-generic-actions):not(:has(:is(.ff-filter-keep-open, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-tariff-keep-filter))) :is(.ff-filter-close, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-actions:not(:has(.ff-filter-keep-open)) .ff-filter-close, html body.ff-app .ff-view-payments .ff-finance-payment-actions:not(:has(.ff-finance-keep-filter)) .ff-finance-close-filter { margin-left: auto !important; } html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-search, .ff-finance-search, .ff-image-search, .ff-query-generic-search), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-search, .ff-image-search, .ff-query-generic-search, .ff-tariff-search), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-search, html body.ff-app .ff-view-payments .ff-finance-search { margin-left: 0 !important; min-width: 190px !important; order: 100 !important; } @media (max-width: 760px) { html body.ff-app :is(.ff-waybill, .ff-query, .ff-debriefing, .ff-view-invoices, .ff-view-crdr) .ff-sr-card :is(.ff-filter-search, .ff-finance-search, .ff-image-search, .ff-query-generic-search), html body.ff-app :is(.ff-tariffs, .ff-imaging-list, .ff-query) .ff-sr-card :is(.ff-filter-search, .ff-image-search, .ff-query-generic-search, .ff-tariff-search), html body.ff-app .ff-debtors .ff-debtors-actions-field .ff-filter-search, html body.ff-app .ff-view-payments .ff-finance-search { flex: 1 1 190px !important; } } /* Final standard-grid loading guard. Loading feedback must come from the page/blocking spinner only. Suppress all grid-local DevExtreme spinners, bottom loading panels, no-data loading text, and legacy grid pseudo banners such as "Loading...". */ html body.ff-app .app-content.csspinner:has(.ff-standard-grid-page)::before, html body.ff-app .app-content.csspinner:has(.ff-standard-grid-page)::after, html body.ff-app .app-content.loading:has(.ff-standard-grid-page)::before, html body.ff-app .app-content.loading:has(.ff-standard-grid-page)::after { animation: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-loading::before, html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-loading::after, html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-grid-loading::before, html body.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-grid-loading::after { animation: none !important; content: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-loading :is(.dx-datagrid-nodata, .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *), html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"]), html body.ff-app:has(.ff-standard-grid-page .ff-standard-grid.ff-grid-loading) > :is(.dx-overlay-wrapper.dx-loadpanel-wrapper, .dx-loadpanel-wrapper, .dx-loadpanel) { animation: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-loading :is(.dx-datagrid-nodata, .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *)::before, html body.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-loading :is(.dx-datagrid-nodata, .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *)::after, html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"])::before, html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"])::after { animation: none !important; content: none !important; display: none !important; } /* View Waybills final viewport fill. This must stay after the generic loading/grid guards because older Waybills-specific rules have higher selector specificity and otherwise leave a spare band below the footer/version area. */ html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-grid-row-height: 16px !important; --ff-standard-grid-row-height: 16px !important; --ff-standard-grid-cell-line-height: 14px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-action-size: 14px !important; --ff-view-waybills-image-link-line-height: 14px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 264px), 940px) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 288px), 940px) !important; } /* Receiver Master loading guard. The grid owns the loading indicator; suppress the legacy page-wrapper csspinner so Receivers does not show a second circle above the grid. */ html body.ff-app .ff-receivers > [block-ui].csspinner::before, html body.ff-app .ff-receivers > [block-ui].csspinner::after, html body.ff-app .ff-receivers > [block-ui].loading::before, html body.ff-app .ff-receivers > [block-ui].loading::after, html body.ff-app .ff-receivers > [block-ui].load1::before, html body.ff-app .ff-receivers > [block-ui].load1::after, html body.ff-app .app-content.csspinner:has(.ff-receivers)::before, html body.ff-app .app-content.csspinner:has(.ff-receivers)::after, html body.ff-app .app-content.loading:has(.ff-receivers)::before, html body.ff-app .app-content.loading:has(.ff-receivers)::after { animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: calc(100vh - 264px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-waybills.ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--waybills.ff-standard-grid--waybills { --ff-standard-grid-rows-max-height: calc(100vh - 288px) !important; } } /* Filter close buttons must not shift while pressed; the click should only close the filter panel. */ html body.ff-app :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter), html body.ff-app :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter):is(:hover, :focus, :active, .active) { left: auto !important; position: relative !important; right: auto !important; top: auto !important; transform: none !important; } /* View Waybills has no Keep Open control, so the close X is the spacer before SEARCH. Keep that hit target fixed while the overlay is closing. */ html body.ff-app .ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-close, html body.ff-app .ff-view-waybills .ff-sr-card .ff-filter-actions .ff-filter-close:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 30px) !important; margin-left: auto !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; transition: none !important; width: var(--ff-control-h, 30px) !important; } /* View Manifests final filter order and 18px data-row lock. This must stay at the end because older manifest blocks still define 22px rows and the shared filter-action rules do not know about manifest buttons. */ html body.ff-app .ff-view-manifests-simple .ff-manifest-filter-submit, html body.ff-app .ff-view-manifests .ff-manifest-filter-submit { align-items: center !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple .ff-manifest-filter-submit .ff-manifest-keep-filter, html body.ff-app .ff-view-manifests .ff-manifest-filter-submit .ff-manifest-keep-filter { margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple .ff-manifest-filter-submit .ff-manifest-close-filter, html body.ff-app .ff-view-manifests .ff-manifest-filter-submit .ff-manifest-close-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-view-manifests-simple .ff-manifest-filter-submit .ff-manifest-search, html body.ff-app .ff-view-manifests .ff-manifest-filter-submit .ff-manifest-search { margin-left: 0 !important; min-width: 190px !important; order: 100 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app .ff-view-manifests.ff-standard-grid-page, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-grid-row-height: 18px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 180px !important; --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 318px)) !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-view-manifests-cell-height-final: 16px !important; --ff-view-manifests-fixed-row-height: 18px !important; --ff-view-manifests-fixed-row-height-final: 18px !important; --ff-view-manifests-row-height: 18px !important; --ff-view-manifests-row-height-final: 18px !important; --ff-view-manifests-row-height-normal: 18px !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: max(180px, calc(100dvh - 338px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app .ff-view-manifests.ff-standard-grid-page, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: calc(100vh - 318px) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests { --ff-standard-grid-rows-max-height: calc(100vh - 338px) !important; } } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-gridbase-container, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview .dx-scrollable-container, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview .dx-scrollable-content, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview .dx-scrollable-content, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 11px) !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link, .ff-manifest-row-actions, .ff-manifest-row-action), html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link, .ff-manifest-row-actions, .ff-manifest-row-action), html body.ff-app .ff-view-manifests.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { font-size: inherit !important; height: 16px !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } /* View Quotes final CSS-owned viewport lock. Quotes should not use the old measured compact/normal fallback after data binds. Keep the populated grid at one CSS-owned height so the footer/version area does not leave a spare band and no post-load viewport refresh is needed. */ html body.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 235px), 930px) !important; } html body.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid--quotes:not(.ff-standard-grid-short-result) { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 235px), 930px) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid--quotes:not(.ff-standard-grid-short-result) { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 255px), 930px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 235px) !important; } html body.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid--quotes:not(.ff-standard-grid-short-result) { --ff-standard-grid-rows-max-height: calc(100vh - 235px) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; } html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid--quotes:not(.ff-standard-grid-short-result) { --ff-standard-grid-rows-max-height: calc(100vh - 255px) !important; } } /* Debriefing final filter and grid-width guard. Older Debriefing blocks still use a grid action row and force the data body to 100% width. Keep the standard action order and give the native-scroll grid one stable horizontal width so the rows cannot collapse to two columns. */ html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions { align-items: center !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; grid-template-columns: none !important; justify-content: flex-start !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions::before, html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions::after { content: none !important; display: none !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions :is(.btn, .valuesonly, .checkbox) { float: none !important; grid-column: auto !important; justify-self: auto !important; margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-clear { flex: 0 0 auto !important; margin-left: 0 !important; order: 0 !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-show-dormant { flex: 0 0 auto !important; margin-left: 0 !important; order: 1 !important; white-space: nowrap !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-close, html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-close:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: auto !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; transition: none !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-search { flex: 0 0 auto !important; margin-left: 0 !important; min-width: 190px !important; order: 100 !important; } html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing { --ff-debriefing-horizontal-width-final: max(100%, 1780px) !important; } html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-width: var(--ff-debriefing-horizontal-width-final) !important; width: var(--ff-debriefing-horizontal-width-final) !important; } html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed), html body.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid--debriefing :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody { max-width: none !important; min-width: var(--ff-debriefing-horizontal-width-final) !important; table-layout: fixed !important; width: var(--ff-debriefing-horizontal-width-final) !important; } @media (max-width: 760px) { html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions { flex-wrap: wrap !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-close { margin-left: auto !important; } html body.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-search { flex: 1 1 190px !important; } } /* Final shared standard-grid width guard. Several standard-grid pages can render header width correctly while the native rows scroll surface collapses to the first few visible columns. Keep the host, rows viewport, non-fixed content, and scroll surface at full width; only the data table itself may grow wider than the viewport for horizontal scrolling. */ html body.ff-app .ff-standard-grid-page .ff-standard-grid, html body.ff-app .ff-standard-grid-page .ff-standard-grid > .dx-datagrid, html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid, html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-gridbase-container, html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table), html body.ff-app .ff-standard-grid-page .ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; } /* View Invoices final filter action and selector alignment. Keep the invoice-only filter controls left-aligned while the persistent action group stays pinned to the far right. Centre the visible row selector widget in the generated command column with a stronger left correction. */ html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions-row { display: block !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions-row > .ff-finance-filter-actions { align-items: center !important; box-sizing: border-box !important; column-gap: 8px !important; display: grid !important; grid-template-columns: auto auto auto auto auto minmax(0, 1fr) auto auto minmax(190px, 230px) !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; min-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; row-gap: 2px !important; width: 100% !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions :is(.btn, .valuesonly, .checkbox, .clip-radio) { float: none !important; margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-unsettled { grid-column: 2 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-fewer-cols { grid-column: 3 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-save-history { grid-column: 4 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-show-dormant { grid-column: 5 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-keep-filter { grid-column: 7 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-close-filter, html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-close-filter:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; grid-column: 8 !important; justify-content: center !important; justify-self: end !important; margin-left: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: initial !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-search { grid-column: 9 !important; justify-self: stretch !important; margin-left: 0 !important; min-width: 190px !important; order: initial !important; width: 100% !important; } html body.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) { overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; } html body.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox) { left: 50% !important; margin-left: 0 !important; margin-right: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(calc(-50% - 5px), -50%) !important; } @media (max-width: 900px) { html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions-row > .ff-finance-filter-actions { display: flex !important; flex-wrap: wrap !important; } html body.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-keep-filter { margin-left: auto !important; } } html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid, html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid > .dx-datagrid, html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-datagrid, html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-gridbase-container, html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table), html body.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; } /* Final standard view filter action-set alignment. The persistent filter action set is always Keep Open, close X, then SEARCH, and that set must sit on the far right of the filter box. Keep any clear, dormant, mode, preview, undo, or page-specific options to the left. */ html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-finance-payment-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner), html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-footer-actions-inner, .ff-debtors-actions-field .ff-filter-actions, .ff-manifest-filter-submit, .ff-route-filter-actions, .ff-cons-actions) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: wrap !important; gap: 2px 8px !important; justify-content: flex-start !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-finance-payment-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner)::before, html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-finance-payment-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner)::after, html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-footer-actions-inner, .ff-debtors-actions-field .ff-filter-actions, .ff-manifest-filter-submit, .ff-route-filter-actions, .ff-cons-actions)::before, html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-footer-actions-inner, .ff-debtors-actions-field .ff-filter-actions, .ff-manifest-filter-submit, .ff-route-filter-actions, .ff-cons-actions)::after { content: none !important; display: none !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-finance-payment-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner) :is(.btn, .valuesonly, .checkbox, .clip-radio), html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-footer-actions-inner, .ff-debtors-actions-field .ff-filter-actions, .ff-manifest-filter-submit, .ff-route-filter-actions, .ff-cons-actions) :is(.btn, .valuesonly, .checkbox, .clip-radio) { float: none !important; grid-column: auto !important; justify-self: auto !important; margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-clear, .ff-finance-clear, .ff-image-clear-filter, .ff-manifest-clear-filter, .ff-cons-consolidate-btn, .ff-cons-preview) { margin-left: 0 !important; order: 0 !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-show-dormant, .ff-finance-show-dormant, .ff-finance-crdr-search-type, .ff-finance-unsettled, .ff-finance-fewer-cols, .ff-finance-save-history) { margin-left: 0 !important; order: 10 !important; white-space: nowrap !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-tariff-keep-filter, .ff-manifest-keep-filter, .ff-route-keep-filter, .ff-cons-keep-filter) { margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter), html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter):is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-search, .ff-finance-search, .ff-image-search, .ff-query-generic-search, .ff-tariff-search, .ff-manifest-search, .ff-route-search, .ff-cons-search-btn) { margin-left: 0 !important; min-width: 190px !important; order: 100 !important; } /* Tariffs filter actions. Keep the Clear button where the old Keep Open control sat, but anchor the Keep Open / close / Search cluster to the filter box's right edge. */ html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { flex: 1 1 auto !important; margin-left: auto !important; max-width: none !important; min-width: 330px !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-start !important; width: 100% !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-clear-filter { margin-left: 0 !important; min-width: 120px !important; order: 0 !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: auto !important; order: 90 !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter { order: 95 !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { min-width: 190px !important; order: 100 !important; } @media (max-width: 760px) { html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { flex-wrap: wrap !important; } html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-clear-filter, html body.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 1 1 170px !important; } } html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) .ff-sr-card :is(.ff-filter-actions, .ff-finance-filter-actions, .ff-finance-crdr-actions, .ff-finance-payment-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner):not(:has(:is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-tariff-keep-filter))) :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter), html body.ff-app :is(.ff-page, .ff-waybill, .ff-filter-panel) :is(.ff-filter-footer-actions-inner, .ff-debtors-actions-field .ff-filter-actions, .ff-manifest-filter-submit, .ff-route-filter-actions, .ff-cons-actions):not(:has(:is(.ff-filter-keep-open, .ff-tariff-keep-filter, .ff-manifest-keep-filter, .ff-route-keep-filter, .ff-cons-keep-filter))) :is(.ff-filter-close, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter) { margin-left: auto !important; } @media (min-width: 992px) { html body.ff-app .ff-debtors .ff-debtors-options-row > .ff-debtors-actions-field { width: 41.66666667% !important; } } /* View Images inline filter actions. Keep the close / Keep Open / SEARCH cluster on the Webuser row while the cluster remains right-aligned inside the filter section. */ html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-actions-inline { align-self: flex-start !important; display: flex !important; flex: 0 1 330px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; min-width: 300px !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: 13px !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-filter-actions { flex-wrap: nowrap !important; justify-content: flex-end !important; margin-bottom: 0 !important; width: 100% !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-close-filter { order: 90 !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-keep-filter { margin-left: 0 !important; order: 95 !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-search { order: 100 !important; } @media (max-width: 760px) { html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-actions-inline { flex: 1 1 100% !important; min-width: 0 !important; padding-top: 0 !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-filter-actions { flex-wrap: wrap !important; } html body.ff-app .ff-imaging-list .ff-sr-card .ff-image-user-row .ff-image-search { flex: 1 1 150px !important; } } /* Final CSS-owned standard-grid native width lock. Some native-scroll grids can keep a stale DevExtreme rows viewport width after a page-level resize/layout pass. Keep the rows scroll surface at least as wide as the visible page so the body cannot collapse while headers remain full-width. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned { --ff-standard-grid-visible-width-floor: max(100%, calc(100vw - 18px)) !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer), html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: none !important; min-width: var(--ff-standard-grid-visible-width-floor) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: var(--ff-standard-grid-visible-width-floor) !important; } /* View Images final width containment. Keep the wide column surface scrollable inside the grid, but never let the grid chrome expand beyond the visible page width. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-image-grid-page-inset: 0px !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: calc(100% - var(--ff-image-grid-page-inset, 0px)) !important; min-width: 0 !important; overflow-x: hidden !important; width: calc(100% - var(--ff-image-grid-page-inset, 0px)) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-container { overflow-x: hidden !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable-content), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { box-sizing: border-box !important; max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final, 100%) !important; width: var(--ff-image-standard-horizontal-width-final, 100%) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-pager.dx-pager, .dx-pager) { overflow: visible !important; padding-right: 30px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-pager .dx-pages { overflow: visible !important; padding-right: 4px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-pager :is(.dx-next-button, .dx-navigate-button.dx-next-button) { margin-right: 8px !important; } /* Final Query width, selector and recent-query fit. Keep the grid host inside the page while column overflow scrolls internally. */ html body.ff-app .ff-query.ff-standard-grid-page { --ff-query-recent-list-max-height: 142px !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app .ff-query.ff-standard-grid-page .ff-grid-result-row, html body.ff-app .ff-query.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid :is(.dx-datagrid-pager.dx-pager, .dx-pager) { overflow: visible !important; padding-right: 28px !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-pager .dx-pages { overflow: visible !important; padding-right: 4px !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-pager :is(.dx-next-button, .dx-navigate-button.dx-next-button) { margin-right: 8px !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; height: var(--ff-standard-grid-row-height, 18px) !important; max-width: 34px !important; min-width: 34px !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 34px !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox, input[type="checkbox"]) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 14px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; right: auto !important; top: calc(50% + 1px) !important; transform: translate(-50%, -50%) !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app .ff-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-standard-grid-check-size, 14px) !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; padding: 0 !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app .ff-query .ff-query-select-row > .ff-query-recent-col { flex: 1 1 420px !important; max-width: none !important; min-width: 0 !important; } html body.ff-app .ff-query .ff-query-recent-inner { align-items: stretch !important; display: flex !important; flex-direction: column !important; gap: 4px !important; height: auto !important; max-height: var(--ff-query-recent-list-max-height, 142px) !important; min-height: 0 !important; overflow-x: hidden !important; overflow-y: auto !important; padding-right: 2px !important; width: 100% !important; } html body.ff-app .ff-query .ff-query-recent-item { align-items: center !important; display: flex !important; flex: 0 0 auto !important; gap: 5px !important; height: var(--ff-control-h, 30px) !important; justify-content: flex-start !important; line-height: normal !important; max-width: 100% !important; min-height: var(--ff-control-h, 30px) !important; min-width: 0 !important; overflow: hidden !important; text-align: left !important; width: 100% !important; } html body.ff-app .ff-query .ff-query-recent-item :is(.ff-query-recent-group, .ff-query-recent-query) { display: inline-block !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-query .ff-query-recent-item .ff-query-recent-group { flex: 0 1 40% !important; max-width: none !important; } html body.ff-app .ff-query .ff-query-recent-item .ff-query-recent-query { flex: 1 1 auto !important; max-width: none !important; } /* Final receiver filter action set. Keep Clear, Close and Search themed together, and reserve pager room so the next-page chevron cannot sit under the right scroll chrome. */ html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-clear-filter-field { align-items: center !important; display: flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 86px !important; padding-top: 0 !important; width: auto !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-filter-close-field { align-items: center !important; display: flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; padding-top: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-search-field { margin-left: 0 !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-clear-filter, html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-clear-filter:is(:hover, :focus, :active, .active), html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-search-field .btn, html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-search-field .btn:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; line-height: var(--ff-control-h, 30px) !important; min-height: var(--ff-control-h, 30px) !important; min-width: 86px !important; padding: 0 14px !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-close-filter, html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-close-filter:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; line-height: var(--ff-control-h, 30px) !important; max-height: var(--ff-control-h, 30px) !important; max-width: var(--ff-control-h, 30px) !important; min-height: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; padding: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-close-filter > .fa { line-height: 1 !important; } html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-clear-filter-field, html body.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-filter-close-field, html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-clear-filter-field, html body.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row--has-dates .ff-receivers-filter-close-field, html body.ff-app .ff-receivers.ff-receivers.ff-view-compact .ff-receivers-filter-secondary-row--has-dates .ff-receivers-clear-filter-field, html body.ff-app .ff-receivers.ff-receivers.ff-view-compact .ff-receivers-filter-secondary-row--has-dates .ff-receivers-filter-close-field { padding-top: 12px !important; } html body.ff-app .ff-receivers.ff-standard-grid-page #gridContainer.ff-standard-grid :is(.dx-datagrid-pager.dx-pager, .dx-pager) { padding-right: 30px !important; } html body.ff-app .ff-receivers.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager .dx-pages { overflow: visible !important; padding-right: 4px !important; } html body.ff-app .ff-receivers.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-navigate-button, .dx-next-button) { opacity: 1 !important; overflow: visible !important; position: relative !important; visibility: visible !important; z-index: 3 !important; } html body.ff-app .ff-receivers.ff-standard-grid-page #gridContainer.ff-standard-grid .dx-pager :is(.dx-next-button, .dx-navigate-button.dx-next-button) { margin-right: 8px !important; } /* View Payments final filter action guard. */ html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row { align-items: flex-end !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > :is(.ff-payment-group-field, .ff-payment-order-field, .ff-payment-unsettled-field, .ff-payment-show-dormant-field) { float: none !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > :is(.ff-payment-unsettled-field, .ff-payment-show-dormant-field) { align-items: center !important; align-self: flex-end !important; display: flex !important; flex: 0 0 auto !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > .ff-payment-show-dormant-field { margin-left: 4px !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > :is(.ff-payment-unsettled-field, .ff-payment-show-dormant-field) .checkbox { margin: 0 !important; white-space: nowrap !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > .ff-finance-payment-actions { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 1 1 auto !important; float: none !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 330px !important; order: 90 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-actions .ff-finance-keep-filter { margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-actions .ff-finance-close-filter { order: 95 !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-actions .ff-finance-search { flex: 0 0 auto !important; min-width: 190px !important; order: 100 !important; } @media (max-width: 900px) { html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row { flex-wrap: wrap !important; } html body.ff-app .ff-view-payments.ff-view-payments .ff-finance-payment-options-row > .ff-finance-payment-actions { flex: 1 1 100% !important; min-width: 0 !important; } } /* Final standard-grid sizing contract. CSS-owned grids should render at their final height immediately; JavaScript may still refresh columns, but row density and viewport height stay stable. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page { --ff-grid-cell-padding-y: 0px !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0px !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-row-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned { transition: none !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex-basis: var(--ff-standard-grid-effective-rows-height, var(--ff-standard-grid-rows-max-height)) !important; height: var(--ff-standard-grid-effective-rows-height, var(--ff-standard-grid-rows-max-height)) !important; max-height: var(--ff-standard-grid-effective-rows-height, var(--ff-standard-grid-rows-max-height)) !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .dx-link, a, span, img, button, .btn, .label, .badge, .ff-grid-boolean-checkbox), html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 320px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 285px), 930px) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned { --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-pager.dx-pager, .dx-pager) { box-sizing: border-box !important; padding-right: 34px !important; } /* Absolute-final View Tracking row density. This sits after the shared standard-grid EOF rules; do not change the Tracking rows viewport/page-size reserve here. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-container { overflow-x: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox) { height: 16px !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td > .ff-grid-boolean-checkbox { align-items: center !important; display: flex !important; justify-content: flex-start !important; text-align: left !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td > .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { margin-left: 0 !important; margin-right: 0 !important; } /* Absolute-final filter close button stability. The filter X closes on pointer-down in main.js, so its visual hit target must not move on hover/active/focus before the close state is applied. */ html body.ff-app.ff-app.ff-app :is( button.ff-filter-close, button.ff-finance-close-filter, button.ff-image-close-filter, button.ff-query-generic-close-filter, button.ff-tariff-close-filter, button.ff-manifest-close-filter, button.ff-route-close-filter, button.ff-debtors-close-filter, button.ff-cons-close-filter, button.ff-receivers-close-filter ), html body.ff-app.ff-app.ff-app :is( button.ff-filter-close, button.ff-finance-close-filter, button.ff-image-close-filter, button.ff-query-generic-close-filter, button.ff-tariff-close-filter, button.ff-manifest-close-filter, button.ff-route-close-filter, button.ff-debtors-close-filter, button.ff-cons-close-filter, button.ff-receivers-close-filter ):is(:hover, :focus, :active, .active) { align-items: center !important; animation: none !important; bottom: auto !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-control-h, 30px) !important; max-height: var(--ff-control-h, 30px) !important; max-width: var(--ff-control-h, 30px) !important; min-height: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; padding: 0 !important; position: relative !important; right: auto !important; top: auto !important; touch-action: manipulation !important; transform: none !important; transition: none !important; vertical-align: middle !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app :is( button.ff-filter-close, button.ff-finance-close-filter, button.ff-image-close-filter, button.ff-query-generic-close-filter, button.ff-tariff-close-filter, button.ff-manifest-close-filter, button.ff-route-close-filter, button.ff-debtors-close-filter, button.ff-cons-close-filter, button.ff-receivers-close-filter ) > :is(i, .fa, .glyphicon) { display: block !important; line-height: 1 !important; margin: 0 !important; pointer-events: none !important; position: static !important; transform: none !important; } /* Waybills filter final-row actions. Keep Show Dormant beside Geocoded and move close/search up into the same boolean-filter section instead of using the extra bottom action row. */ html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-inline-row > .ff-filter-waybill-dormant-inline { align-items: flex-end !important; align-self: flex-end !important; display: inline-flex !important; flex: 0 0 auto !important; min-height: var(--ff-control-h, 30px) !important; padding: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-inline-row > .ff-filter-waybill-dormant-inline :is(.checkbox, label) { margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-inline-row > .ff-filter-waybill-inline-actions { align-self: flex-end !important; box-sizing: border-box !important; display: block !important; flex: 1 1 320px !important; margin-left: auto !important; min-width: 250px !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-actions-row { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-actions { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-search { min-width: 150px !important; } /* Absolute-final Debriefing viewport and scrollbar recovery. This sits after the shared CSS-owned grid contract so Debriefing keeps its wider horizontal content surface while the native rows scrollbar stays inside the visible grid edge. The reserve trims 36px: two compact rows. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 340px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 334px), 900px) !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 354px), 900px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 334px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 354px) !important; } } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { flex-basis: var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; max-width: 100% !important; min-height: 0 !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { box-sizing: border-box !important; flex-basis: var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; max-width: 100% !important; min-height: 0 !important; min-width: 100% !important; overflow-x: auto !important; overflow-y: scroll !important; scrollbar-gutter: stable !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content, .dx-datagrid-content-fixed), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-content-fixed .dx-scrollable-content { max-width: none !important; min-width: var(--ff-debriefing-horizontal-width-final, max(100%, 1780px)) !important; width: var(--ff-debriefing-horizontal-width-final, max(100%, 1780px)) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: var(--ff-debriefing-horizontal-width-final, max(100%, 1780px)) !important; table-layout: fixed !important; width: var(--ff-debriefing-horizontal-width-final, max(100%, 1780px)) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-pager.dx-pager, .dx-pager) { box-sizing: border-box !important; padding-right: 34px !important; } /* Absolute-final View Invoices selector and event-checkbox guard. Keep the invoice summary row selector centered in the intended narrow command column, and never let event text cells render as boolean checkboxes. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients { --ff-invoice-summary-selector-width-final: 22px !important; --ff-invoice-summary-selector-check-size-final: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) { box-sizing: border-box !important; max-width: var(--ff-invoice-summary-selector-width-final) !important; min-width: var(--ff-invoice-summary-selector-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; width: var(--ff-invoice-summary-selector-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox, input[type="checkbox"]) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-summary-selector-check-size-final) !important; justify-content: center !important; left: calc(var(--ff-invoice-summary-selector-width-final) / 2) !important; margin: 0 !important; max-height: var(--ff-invoice-summary-selector-check-size-final) !important; max-width: var(--ff-invoice-summary-selector-check-size-final) !important; min-height: var(--ff-invoice-summary-selector-check-size-final) !important; min-width: var(--ff-invoice-summary-selector-check-size-final) !important; padding: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-invoice-summary-selector-check-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-summary-selector-check-size-final) !important; justify-content: center !important; line-height: var(--ff-invoice-summary-selector-check-size-final) !important; margin: 0 !important; max-height: var(--ff-invoice-summary-selector-check-size-final) !important; max-width: var(--ff-invoice-summary-selector-check-size-final) !important; min-height: var(--ff-invoice-summary-selector-check-size-final) !important; min-width: var(--ff-invoice-summary-selector-check-size-final) !important; padding: 0 !important; width: var(--ff-invoice-summary-selector-check-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid--invoice-waybills .dx-datagrid-rowsview td[aria-colindex] :is(.ff-grid-boolean-checkbox, .dx-checkbox.dx-state-readonly) { margin-left: auto !important; margin-right: auto !important; } /* Absolute-final View Credits/Debits filter layout. Keep the persistent search actions together at the right edge, and keep the Batch/Waybill/Ref fields compact with visible gaps between them. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-secondary-filters { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-secondary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-secondary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-row::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-secondary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card :is(.ff-finance-batch-filter, .ff-finance-waybill-filter, .ff-finance-ref-filter) { flex: 0 1 clamp(240px, 14.5vw, 300px) !important; max-width: 300px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-group { flex: 1 1 620px !important; max-width: none !important; min-width: 560px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card :is(.ff-finance-user-filter, .ff-finance-webuser-filter, .ff-finance-acc-filter) { flex: 1 1 0 !important; max-width: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { align-items: center !important; column-gap: 8px !important; display: grid !important; grid-template-columns: auto auto auto minmax(12px, 1fr) auto auto minmax(150px, 190px) !important; row-gap: 2px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-show-dormant { grid-column: 2 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-crdr-search-type { grid-column: 3 !important; justify-self: start !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { grid-column: 5 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter { grid-column: 6 !important; justify-self: end !important; margin-left: 0 !important; order: initial !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-search { grid-column: 7 !important; justify-self: stretch !important; margin-left: 0 !important; min-width: 150px !important; order: initial !important; width: 100% !important; } @media (max-width: 1300px) { html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-group { flex-basis: 100% !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-user-row { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card :is(.ff-finance-user-filter, .ff-finance-webuser-filter, .ff-finance-acc-filter) { flex: 1 1 220px !important; } } @media (max-width: 760px) { html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card :is(.ff-finance-batch-filter, .ff-finance-waybill-filter, .ff-finance-ref-filter) { flex: 1 1 100% !important; max-width: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { margin-left: auto !important; order: 90 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter { order: 95 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-search { flex: 1 1 170px !important; order: 100 !important; } } /* Absolute-final Debtors filter action alignment. Stretch the Debtors action field across the remaining filter-row space so Keep Open, close X, and SEARCH sit on the far right of the filter section. */ html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row { align-items: flex-start !important; column-gap: 14px !important; display: grid !important; grid-template-columns: minmax(430px, 506px) minmax(320px, 350px) minmax(330px, 1fr) !important; margin-left: 0 !important; margin-right: 0 !important; row-gap: 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row::before, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-field { grid-column: 1 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-trans-field { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field { align-self: start !important; display: flex !important; grid-column: 3 !important; justify-content: flex-end !important; min-width: 0 !important; padding-top: 28px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-filter-actions { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-filter-keep-open { margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-debtors-close-filter { order: 95 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-filter-search { min-width: 190px !important; order: 100 !important; } @media (max-width: 1420px) { html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row { grid-template-columns: minmax(430px, 1fr) minmax(320px, 350px) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field { grid-column: 1 / -1 !important; padding-top: 0 !important; } } @media (max-width: 760px) { html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-options-row { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card :is(.ff-debtors-options-field, .ff-debtors-trans-field, .ff-debtors-actions-field) { flex: 1 1 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-filter-actions { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-actions-field .ff-filter-search { flex: 1 1 170px !important; } } /* Final view-filter action order. Keep Open starts the right-aligned action cluster, followed by close X and SEARCH. */ html body.ff-app.ff-app.ff-app :is(.ff-view-payments.ff-view-payments, .ff-view-invoices.ff-view-invoices, .ff-view-crdr.ff-view-crdr, .ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-waybills.ff-view-waybills, .ff-view-collections.ff-view-collections, .ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-imaging-list.ff-imaging-list) .ff-sr-card :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-manifest-close-filter), html body.ff-app.ff-app.ff-app :is(.ff-view-payments.ff-view-payments, .ff-view-invoices.ff-view-invoices, .ff-view-crdr.ff-view-crdr, .ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-waybills.ff-view-waybills, .ff-view-collections.ff-view-collections, .ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-imaging-list.ff-imaging-list) .ff-sr-card :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-manifest-close-filter):is(:hover, :focus, :active, .active) { margin-left: 0 !important; order: 95 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-payments.ff-view-payments, .ff-view-invoices.ff-view-invoices, .ff-view-crdr.ff-view-crdr, .ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-waybills.ff-view-waybills, .ff-view-collections.ff-view-collections, .ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-imaging-list.ff-imaging-list) .ff-sr-card :is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-manifest-keep-filter) { margin-left: auto !important; order: 90 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter { grid-column: 5 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { grid-column: 6 !important; } /* Final Tariffs filter/grid containment. The Tariffs filter has a wide last row: keep the area fields on the left and pin Keep Open, close and SEARCH to the far right. Keep the grid shell inside the page; only the DevExtreme rows/header content should scroll sideways. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row { align-items: end !important; column-gap: 12px !important; display: grid !important; grid-template-columns: minmax(145px, 220px) minmax(145px, 220px) minmax(0, 1fr) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row::after, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row > :is(.ff-filter-area-from, .ff-filter-area-to, .ff-filter-footer-actions) { float: none !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { grid-column: 3 !important; margin-left: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-start !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-filter-actions-spacer { display: block !important; flex: 1 1 auto !important; min-width: 12px !important; order: 80 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-clear-filter { flex: 0 0 150px !important; margin-left: 0 !important; max-width: 150px !important; min-width: 120px !important; order: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: 0 !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter { flex: 0 0 var(--ff-control-h, 30px) !important; order: 95 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 240px !important; margin-left: 0 !important; max-width: 240px !important; min-width: 190px !important; order: 100 !important; } @media (max-width: 1180px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row { grid-template-columns: repeat(2, minmax(145px, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { grid-column: 1 / -1 !important; } } @media (max-width: 760px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row > :is(.ff-filter-area-from, .ff-filter-area-to, .ff-filter-footer-actions) { flex: 1 1 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-filter-actions-spacer { display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-clear-filter, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 1 1 170px !important; max-width: none !important; } } /* Absolute-final View Manifests density, viewport, and width containment. The 2026-06-22 screenshot showed rendered data rows around 39-40px and the grid shell wider than the page. Keep this after the shared/grid final rules. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 420px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(420px, calc(100dvh - 255px), 930px) !important; --ff-standard-grid-visible-width-floor: 100% !important; --ff-view-manifests-cell-height-final: 16px !important; --ff-view-manifests-fixed-row-height: 18px !important; --ff-view-manifests-fixed-row-height-final: 18px !important; --ff-view-manifests-row-height: 18px !important; --ff-view-manifests-row-height-final: 18px !important; --ff-view-manifests-row-height-normal: 18px !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 255px) !important; } } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; max-height: none !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; flex: 0 0 auto !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { box-sizing: border-box !important; flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { box-sizing: border-box !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; max-width: 100% !important; min-width: 0 !important; overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content { height: auto !important; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 100% !important; width: max-content !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) { max-width: none !important; min-width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { block-size: 18px !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 11px) !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link, .ff-manifest-row-actions, .ff-manifest-row-action), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { font-size: inherit !important; height: 16px !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox) { height: 16px !important; line-height: 16px !important; max-height: 16px !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-command-select .dx-checkbox-icon { height: 14px !important; width: 14px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-pager, .dx-pager) { overflow: visible !important; padding-right: 36px !important; } /* Absolute-last Receiver Master guard. Keep the wide Receivers grid inside the page even after all late grid blocks. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-clear-filter-field { display: none !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers .ff-receivers-filter-secondary-row .ff-receivers-keep-filter-field { align-items: center !important; display: flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 118px !important; padding-top: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-standard-grid-visible-width-floor: 100% !important; box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-receivers-results, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-receivers-results > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-pager.dx-pager, .dx-pager) { box-sizing: border-box !important; overflow: visible !important; padding-right: 44px !important; } /* Absolute-last Receiver fixed selector/action pane. The Receivers grid uses fixed template columns for row selection and row actions; keep those fixed cells visible while the rows viewport scrolls. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed { display: block !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-data-row, .dx-data-row > td, .dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col) { opacity: 1 !important; overflow: visible !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .ff-receivers-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-edit, .ff-receivers-command-col) :is(.ff-receivers-row-actions, .dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-icon, .fa) { opacity: 1 !important; visibility: visible !important; } /* Late shared boolean flag alignment. Flag fields are read-only cell values, not selector controls, so they should align with the cell content after all page-specific grid density blocks. */ html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) > .ff-grid-boolean-checkbox, html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .ff-grid-boolean-checkbox { align-items: center !important; display: flex !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 100% !important; text-align: left !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-select-checkbox, input[type="checkbox"]) { margin-left: 0 !important; margin-right: 0 !important; } /* Absolute-last View Credits/Debits action-row cleanup. Combine the final CR/DR controls into one row and keep the requested right-side order: Keep Open, close X, SEARCH. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { box-sizing: border-box !important; margin: 0 !important; max-width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row { display: block !important; padding-top: 4px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row::after, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions { align-items: center !important; column-gap: 10px !important; display: grid !important; grid-auto-rows: minmax(34px, auto) !important; grid-template-columns: auto auto minmax(12px, 1fr) auto var(--ff-control-h, 34px) minmax(150px, 240px) !important; min-height: 34px !important; row-gap: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions:has(.ff-finance-clear) { grid-template-columns: minmax(92px, 150px) auto auto minmax(12px, 1fr) auto var(--ff-control-h, 34px) minmax(150px, 240px) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions :is(.ff-finance-clear, .ff-finance-crdr-search-type, .ff-finance-show-dormant, .ff-finance-keep-filter, .ff-finance-close-filter, .ff-finance-search) { align-self: center !important; grid-row: 1 !important; margin-bottom: 0 !important; margin-left: 0 !important; margin-top: 0 !important; order: initial !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-clear { grid-column: 1 !important; justify-self: start !important; min-width: 92px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:not(:has(.ff-finance-clear)) .ff-finance-crdr-search-type { grid-column: 1 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:not(:has(.ff-finance-clear)) .ff-finance-show-dormant { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:has(.ff-finance-clear) .ff-finance-crdr-search-type { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:has(.ff-finance-clear) .ff-finance-show-dormant { grid-column: 3 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:not(:has(.ff-finance-clear)) .ff-finance-keep-filter { grid-column: 4 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:not(:has(.ff-finance-clear)) .ff-finance-close-filter { grid-column: 5 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:not(:has(.ff-finance-clear)) .ff-finance-search { grid-column: 6 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:has(.ff-finance-clear) .ff-finance-keep-filter { grid-column: 5 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:has(.ff-finance-clear) .ff-finance-close-filter { grid-column: 6 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions:has(.ff-finance-clear) .ff-finance-search { grid-column: 7 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions :is(.ff-finance-crdr-search-type, .ff-finance-show-dormant, .ff-finance-keep-filter) { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; justify-self: start !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { justify-self: end !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 34px) !important; justify-content: center !important; justify-self: end !important; margin-left: 0 !important; min-width: var(--ff-control-h, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-search { justify-self: stretch !important; min-width: 150px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions :is(.clip-radio, .checkbox, .valuesonly, .check-inline) { margin-bottom: 0 !important; margin-top: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions :is(label, .btn, .fa) { margin-bottom: 0 !important; } @media (max-width: 760px) { html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions-row > .ff-finance-crdr-actions:has(.ff-finance-clear) { display: flex !important; flex-wrap: wrap !important; row-gap: 4px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-keep-filter { margin-left: auto !important; order: 90 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-close-filter { order: 95 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-crdr-actions .ff-finance-search { flex: 1 1 170px !important; order: 100 !important; } } /* Absolute-last Tariffs filter and grid width guard. Keep the filter action cluster on the right, and keep the wide tariff grid inside the page so the vertical scrollbar and pager stay visible. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { justify-content: flex-end !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-filter-actions-spacer, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-clear-filter { display: none !important; } /* Tariff inline editing uses DevExtreme's modified-cell/revert affordances. Normal rows stay compact; only the active edit row gets enough room to type. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row > td, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row > td { box-sizing: border-box !important; height: 30px !important; line-height: 26px !important; max-height: 30px !important; min-height: 30px !important; overflow: visible !important; padding-bottom: 2px !important; padding-top: 2px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row > td.dx-editor-cell, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row > td.dx-editor-cell { padding: 2px 4px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row > td.dx-editor-cell::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row > td.dx-editor-cell::before { height: 24px !important; line-height: 24px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row td.dx-editor-cell :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor-input-wrapper), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor-input-wrapper) { box-sizing: border-box !important; display: flex !important; height: 24px !important; line-height: 22px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-input-container { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 1 1 auto !important; height: 24px !important; line-height: 22px !important; max-height: 24px !important; min-height: 24px !important; min-width: 0 !important; overflow: hidden !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-input { box-sizing: border-box !important; height: 24px !important; line-height: 22px !important; max-height: 24px !important; min-height: 24px !important; overflow: hidden !important; padding: 0 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-buttons-container { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 auto !important; height: 24px !important; line-height: 24px !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-dropdowneditor-button { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 24px !important; height: 24px !important; justify-content: center !important; line-height: 24px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; min-width: 24px !important; overflow: visible !important; padding: 0 !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-clear-button-area { box-sizing: border-box !important; display: block !important; flex: 0 0 20px !important; height: 24px !important; line-height: 24px !important; margin: 0 !important; max-height: 24px !important; min-height: 24px !important; min-width: 20px !important; overflow: visible !important; padding: 0 !important; position: relative !important; width: 20px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-show-clear-button .dx-icon-clear { background-position: center !important; background-size: 12px 12px !important; border-radius: 50% !important; font-size: 14px !important; height: 18px !important; left: 50% !important; line-height: 18px !important; margin: 0 !important; max-height: 18px !important; max-width: 18px !important; min-height: 18px !important; min-width: 18px !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-dropdowneditor-icon { font-size: 16px !important; height: 18px !important; line-height: 18px !important; margin: 0 !important; max-height: 18px !important; max-width: 18px !important; min-height: 18px !important; min-width: 18px !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-command-edit :is(.dx-link, .dx-link-icon, .dx-icon, .dx-icon-save, .dx-icon-edit, .dx-icon-revert, .dx-icon-close), html body.ff-app.ff-app.ff-app:has(.ff-tariffs.ff-standard-grid-page) .dx-datagrid-revert-tooltip .dx-revert-button { align-items: center !important; border-radius: 50% !important; display: inline-flex !important; font-size: 16px !important; height: 22px !important; justify-content: center !important; line-height: 22px !important; margin: 0 2px !important; max-height: none !important; min-height: 22px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; width: 22px !important; } html body.ff-app.ff-app.ff-app:has(.ff-tariffs.ff-standard-grid-page) .dx-datagrid-revert-tooltip, html body.ff-app.ff-app.ff-app:has(.ff-tariffs.ff-standard-grid-page) .dx-datagrid-revert-tooltip :is(.dx-overlay-content, .dx-popup-content, .dx-button-content, .dx-icon) { align-items: center !important; display: inline-flex !important; justify-content: center !important; max-height: none !important; overflow: visible !important; padding: 0 !important; } /* Tariff active edit-cell polish. The compact grid row is 18px, but DevExtreme's inline editor/revert marker needs a local 32px edit row so users get a usable input and a visible cancel. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row.dx-edit-row > td, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row > td { height: 32px !important; line-height: 28px !important; max-height: 32px !important; min-height: 32px !important; overflow: visible !important; padding-bottom: 3px !important; padding-top: 3px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row > td.dx-editor-cell { padding: 3px 6px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor-input-wrapper), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-input-container, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-input { height: 26px !important; line-height: 24px !important; max-height: 26px !important; min-height: 26px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-container { position: relative !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-buttons-container { align-items: center !important; display: inline-flex !important; gap: 1px !important; height: 26px !important; justify-content: flex-end !important; line-height: 26px !important; max-height: 26px !important; min-height: 26px !important; overflow: visible !important; position: absolute !important; right: 1px !important; top: 0 !important; width: auto !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-texteditor-input { padding-left: 10px !important; padding-right: 50px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell :is(.dx-dropdowneditor-button, .dx-clear-button-area) { align-items: center !important; display: inline-flex !important; flex: 0 0 22px !important; height: 26px !important; justify-content: center !important; line-height: 26px !important; margin: 0 !important; max-height: 26px !important; min-height: 26px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; position: relative !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-show-clear-button .dx-icon-clear, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-clear-button-area .dx-icon-clear { background-position: center !important; background-size: 12px 12px !important; display: inline-block !important; flex: 0 0 18px !important; height: 18px !important; left: auto !important; line-height: 18px !important; margin: 0 !important; max-height: 18px !important; max-width: 18px !important; min-height: 18px !important; min-width: 18px !important; position: static !important; top: auto !important; transform: none !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell .dx-dropdowneditor-icon { align-items: center !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 0 !important; position: static !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview .dx-data-row.dx-edit-row td.dx-editor-cell :is(.dx-datagrid-revert-tooltip, .dx-revert-button, .dx-link, .dx-link-icon, .dx-icon-revert, .dx-icon-close) { align-items: center !important; display: inline-flex !important; height: 20px !important; justify-content: center !important; line-height: 20px !important; max-height: 20px !important; max-width: 20px !important; min-height: 20px !important; min-width: 20px !important; overflow: visible !important; padding: 0 !important; width: 20px !important; } html body.ff-app.ff-app.ff-app:has(.ff-tariffs.ff-standard-grid-page) .dx-datagrid-revert-tooltip .dx-revert-button { position: relative !important; top: 0 !important; transform: none !important; } /* Absolute-final Query containment and selector fit. This sits after the generic CSS-owned grid rules so Query keeps the page scrollbar/pager visible and the select checkbox centred in compact rows. */ html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries { --ff-query-recent-item-width: 420px !important; --ff-query-selector-size: 16px !important; --ff-standard-grid-check-size: var(--ff-query-selector-size) !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-container { overflow-x: hidden !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-pager.dx-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; overflow: visible !important; padding-right: 36px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-pager .dx-pages { overflow: visible !important; padding-right: 6px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries .dx-pager :is(.dx-next-button, .dx-navigate-button.dx-next-button) { margin-right: 10px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; height: var(--ff-standard-grid-row-height, 18px) !important; max-height: var(--ff-standard-grid-row-height, 18px) !important; max-width: 36px !important; min-height: var(--ff-standard-grid-row-height, 18px) !important; min-width: 36px !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 36px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox, input[type="checkbox"]) { align-items: center !important; display: inline-flex !important; height: var(--ff-query-selector-size, 16px) !important; justify-content: center !important; left: 50% !important; line-height: var(--ff-query-selector-size, 16px) !important; margin: 0 !important; max-height: var(--ff-query-selector-size, 16px) !important; max-width: var(--ff-query-selector-size, 16px) !important; min-height: var(--ff-query-selector-size, 16px) !important; min-width: var(--ff-query-selector-size, 16px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; right: auto !important; top: calc(50% + 1px) !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-query-selector-size, 16px) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-query-selector-size, 16px) !important; line-height: var(--ff-query-selector-size, 16px) !important; margin: 0 !important; max-height: var(--ff-query-selector-size, 16px) !important; max-width: var(--ff-query-selector-size, 16px) !important; min-height: var(--ff-query-selector-size, 16px) !important; min-width: var(--ff-query-selector-size, 16px) !important; overflow: visible !important; padding: 0 !important; width: var(--ff-query-selector-size, 16px) !important; } /* Absolute-last Towns/Hubs sizing guard. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned { --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 300px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(320px, calc(100dvh - 325px), 880px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 325px) !important; } } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Absolute-final View Payments horizontal alignment. Later shared standard-grid rules deliberately reset generic grids to 100%. Payments has a totalled, horizontally scrollable grid, so its header, filter row, body, and totals must all keep the measured column width. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments { --ff-view-payments-horizontal-width-final: var(--ff-view-payments-horizontal-width, 100%) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-content:not(.dx-datagrid-content-fixed), .dx-scrollable-content), html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: border-box !important; max-width: none !important; min-width: var(--ff-view-payments-horizontal-width-final) !important; width: var(--ff-view-payments-horizontal-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: var(--ff-view-payments-horizontal-width-final) !important; width: var(--ff-view-payments-horizontal-width-final) !important; } /* True EOF shared CSS-owned grid page-width guard. Keep the visible DevExtreme shell inside the page. Page-specific content widths can still be wider inside the rows scroll container. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned { --ff-standard-grid-visible-width-floor: 100% !important; box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* True EOF View Manifests correction. Restore full-width rows after the previous max-content collapse, trim the rows viewport slightly, and keep the standard Keep Open, X, SEARCH order. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-min-rows-height: 360px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 305px), 880px) !important; --ff-standard-grid-visible-width-floor: 100% !important; --ff-view-manifests-row-height: 18px !important; --ff-view-manifests-row-height-final: 18px !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 305px) !important; } } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-submit { align-items: center !important; display: flex !important; gap: 8px !important; justify-content: flex-end !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-submit .ff-manifest-keep-filter { margin-left: auto !important; order: 90 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-submit .ff-manifest-close-filter, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-submit .ff-manifest-close-filter:is(:hover, :focus, :active, .active) { margin-left: 0 !important; order: 95 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-submit .ff-manifest-search { margin-left: 0 !important; order: 100 !important; } /* Hubs tab selector width guard: keep the row selector compact before Hub Name. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs { --ff-standard-grid-command-width: 32px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; flex: 0 0 32px !important; height: var(--ff-standard-grid-row-height, 18px) !important; max-width: 32px !important; min-width: 32px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: 32px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) colgroup > col:first-child { max-width: 32px !important; min-width: 32px !important; width: 32px !important; } /* Absolute-last grid checkbox glyph containment. DevExtreme paints checked/partial marks with pseudo-elements. Keep those marks inside their own checkbox icon so they cannot appear as random blue squares in data columns after late grid-density overrides. */ html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { position: relative !important; } html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) .dx-checkbox-icon { box-sizing: border-box !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) .dx-checkbox-icon:before, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) .dx-checkbox-icon::after, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-grid-boolean-checkbox, .dx-checkbox) .dx-checkbox-icon:after { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Absolute-last View Waybills stray checkbox-glyph guard. Virtual column repaint can leave a DevExtreme checkbox fragment inside a plain date/text cell. Hide any orphan checkbox glyph outside selector cells and the explicit read-only boolean-cell wrapper. */ html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon)::before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon):before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon)::after, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon):after, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-waybill-select-col):not(.ff-waybill-command-col).dx-focused::before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit):not(.ff-waybill-select-col):not(.ff-waybill-command-col).dx-focused::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; transform: none !important; visibility: hidden !important; width: 0 !important; } /* Absolute-last View Invoices filter/selector alignment. The invoice filter action row uses one visual line for Keep Open, X and SEARCH. The invoice summary selector must win after generic checkbox guards. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions { align-items: center !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-start !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions :is(.checkbox, .valuesonly, .btn) { align-self: center !important; float: none !important; margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions :is(.ff-finance-unsettled, .ff-finance-fewer-cols, .ff-finance-save-history, .ff-finance-show-dormant) { flex: 0 0 auto !important; margin-left: 0 !important; order: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-keep-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; margin-left: auto !important; min-height: var(--ff-control-h, 30px) !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-close-filter, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-close-filter:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; max-height: var(--ff-control-h, 30px) !important; max-width: var(--ff-control-h, 30px) !important; min-height: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions .ff-finance-search { align-self: center !important; flex: 0 0 190px !important; margin-left: 0 !important; min-width: 190px !important; order: 100 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients { --ff-invoice-summary-selector-width-final: 22px !important; --ff-invoice-summary-selector-check-size-final: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: var(--ff-invoice-summary-selector-width-final) !important; min-width: var(--ff-invoice-summary-selector-width-final) !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; width: var(--ff-invoice-summary-selector-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox, input[type="checkbox"]) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-summary-selector-check-size-final) !important; justify-content: center !important; left: 50% !important; margin: 0 !important; max-height: var(--ff-invoice-summary-selector-check-size-final) !important; max-width: var(--ff-invoice-summary-selector-check-size-final) !important; min-height: var(--ff-invoice-summary-selector-check-size-final) !important; min-width: var(--ff-invoice-summary-selector-check-size-final) !important; padding: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: var(--ff-invoice-summary-selector-check-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-content-fixed) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-invoice-summary-selector-check-size-final) !important; justify-content: center !important; line-height: var(--ff-invoice-summary-selector-check-size-final) !important; margin: 0 !important; max-height: var(--ff-invoice-summary-selector-check-size-final) !important; max-width: var(--ff-invoice-summary-selector-check-size-final) !important; min-height: var(--ff-invoice-summary-selector-check-size-final) !important; min-width: var(--ff-invoice-summary-selector-check-size-final) !important; padding: 0 !important; position: static !important; width: var(--ff-invoice-summary-selector-check-size-final) !important; } /* Absolute-last View Waybills inline filter action sizing. Keep the final filter action cluster pinned to the right without stretching SEARCH across the filter card. */ html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-inline-row > .ff-filter-waybill-inline-actions { align-self: flex-end !important; display: block !important; flex: 0 0 auto !important; margin-left: auto !important; max-width: none !important; min-width: 0 !important; padding: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-actions-row { margin: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-actions { align-items: center !important; display: inline-flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 0 !important; padding: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-close, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-close:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 30px) !important; height: var(--ff-control-h, 30px) !important; margin: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 95 !important; padding: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-waybill-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-waybill-column-loading-toggle:is(:hover, :focus, :active, .active) { align-items: center !important; background: var(--surface-3, #eef2f6) !important; background: color-mix(in srgb, var(--text-muted) 12%, var(--surface-2, #f8fafc)) !important; border-color: var(--border, #d7dee8) !important; border-color: color-mix(in srgb, var(--text-muted) 35%, var(--border, #d7dee8)) !important; color: var(--text-muted) !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; margin: 0 !important; margin-left: auto !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 94 !important; padding: 0 !important; white-space: nowrap !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-waybill-column-loading-toggle > .fa { flex: 0 0 auto !important; font-size: 14px !important; height: 14px !important; line-height: 1 !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-waybill-column-loading-toggle--virtual > .fa { color: var(--primary, #3478f6) !important; } html body.ff-app.ff-app.ff-app .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-column-loading-toggle:is(:hover, :focus, :active, .active) { align-items: center !important; background: var(--surface-3, #eef2f6) !important; background: color-mix(in srgb, var(--text-muted) 12%, var(--surface-2, #f8fafc)) !important; border-color: var(--border, #d7dee8) !important; border-color: color-mix(in srgb, var(--text-muted) 35%, var(--border, #d7dee8)) !important; color: var(--text-muted) !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; height: var(--ff-control-h, 30px) !important; justify-content: center !important; margin: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; padding: 0 !important; white-space: nowrap !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-column-loading-toggle > .fa { flex: 0 0 auto !important; font-size: 14px !important; height: 14px !important; line-height: 1 !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-column-loading-toggle--virtual > .fa { color: var(--primary, #3478f6) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills .ff-sr-card .ff-filter-bool-group .ff-filter-waybill-inline-actions .ff-filter-search { flex: 0 0 120px !important; margin: 0 !important; max-width: 120px !important; min-width: 120px !important; order: 100 !important; width: 120px !important; } /* Absolute-last Towns/Hubs rows-width and checkbox-glyph repair. The header/footer can keep the full grid width while the rows scroll content collapses to the first few columns, so reassert the body path too. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned { --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1).ff-standard-grid.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Absolute-last View Images rows-width repair. The header can keep the full page width while the rows viewport collapses to the first few columns. Reassert the body path after the shared EOF rules. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-image-standard-horizontal-width-final: max(100%, var(--ff-image-standard-horizontal-width, 100%)) !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: var(--ff-image-standard-horizontal-width-final) !important; width: var(--ff-image-standard-horizontal-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Absolute-last Debriefing rows-width repair. Fit the visible shell to the page, make the normal rows body match the header/footer width, and keep DevExtreme fixed panes at their natural width. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-debriefing-horizontal-width-final: 100% !important; --ff-standard-grid-visible-width-floor: 100% !important; box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; table-layout: fixed !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed .dx-scrollable-content { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: scroll !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon:before, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon::after, html body.ff-app.ff-app.ff-app .dx-datagrid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon:after { content: none !important; display: none !important; } /* Absolute-last View Tracking rows-width repair. Keep the visible grid shell at page width while forcing the normal rows body to fill the same width as the header/footer; fixed panes keep natural width. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-visible-width-floor: 100% !important; box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: border-box !important; max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content > .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed .dx-scrollable-content { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Absolute-last readonly boolean checkbox alignment. DevExtreme can render boolean cells without the shared wrapper; keep those data-cell checks aligned with cell content, while selection columns stay centered. */ html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) :is(.ff-grid-boolean-checkbox, .dx-checkbox.dx-state-readonly, .dx-checkbox.dx-state-disabled) { margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) :is(.ff-grid-boolean-checkbox, .dx-checkbox.dx-state-readonly, .dx-checkbox.dx-state-disabled), html body.ff-app.ff-app.ff-app .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) :is(.ff-grid-boolean-checkbox, .dx-checkbox.dx-state-readonly, .dx-checkbox.dx-state-disabled) :is(.dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; display: inline-flex !important; justify-content: flex-start !important; text-align: left !important; } /* Absolute-last Hubs selector width guard. DevExtreme can stretch the selection command column when the two-column Hubs grid is auto-sized, so clamp the command column and first rendered col. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs.ff-standard-grid-css-owned { --ff-townhub-hub-selector-width: 32px !important; --ff-townhub-select-column-width: 32px !important; --ff-standard-grid-command-width: 32px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) > tbody > tr > :first-child { box-sizing: border-box !important; flex: 0 0 var(--ff-townhub-hub-selector-width) !important; max-width: var(--ff-townhub-hub-selector-width) !important; min-width: var(--ff-townhub-hub-selector-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; vertical-align: middle !important; width: var(--ff-townhub-hub-selector-width) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) colgroup > col:first-child { max-width: var(--ff-townhub-hub-selector-width) !important; min-width: var(--ff-townhub-hub-selector-width) !important; width: var(--ff-townhub-hub-selector-width) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page #gridContainer1#gridContainer1.ff-standard-grid.ff-standard-grid--town-hubs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-container, .dx-checkbox-icon) { margin-left: auto !important; margin-right: auto !important; } /* Absolute-last View Payments wait spinner size. Payments uses the shared block-ui loader for searches; keep the one portal spinner visible, but make it match the larger standard wait circle. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments [block-ui].csspinner.loading.load1::after { border-bottom-width: 4px !important; border-left-width: 4px !important; border-right-width: 4px !important; border-top-width: 4px !important; display: block !important; height: 52px !important; left: 50% !important; margin: -26px 0 0 -26px !important; top: 50% !important; width: 52px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments [block-ui].csspinner.loading.load1::before { display: block !important; } /* True-EOF View Images page overflow and width lock. View Images uses the grid's own scrollbars; the page shell should not add a second vertical scrollbar or reserve extra width beside the grid. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 252px), 918px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 260px), 918px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 260px) !important; } } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { box-sizing: border-box !important; margin-bottom: 0 !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; padding-bottom: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row { margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"] { padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager, .dx-datagrid-rowsview), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* True-EOF Towns/Hubs busy/pager density and focus-artifact guard. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; --ff-townhub-select-column-width: 32px !important; --ff-townhub-selector-size: 14px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-focus-overlay, .dx-inkripple, .dx-inkripple-wave) { display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-command-select, .dx-command-select > td), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) colgroup col:first-child { flex: 0 0 var(--ff-townhub-select-column-width) !important; max-width: var(--ff-townhub-select-column-width) !important; min-width: var(--ff-townhub-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-townhub-select-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked):not(.dx-checkbox-indeterminate) .dx-checkbox-icon::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-pager.dx-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-pager :is(.dx-pages, .dx-page-indexes) { max-width: none !important; min-width: max-content !important; overflow: visible !important; white-space: nowrap !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-pager .dx-page-indexes { display: inline-flex !important; gap: 2px !important; } /* True-EOF Towns/Hubs no-pan density lock. Keep both tabs on the current Debtors/standard-grid compact row metric. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon) { height: 16px !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-scrollable-simulated, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-scrollable-content { cursor: default !important; } /* Absolute-last View Images viewport follow-up. Keep only the rows viewport scrollable, and add four compact rows of height. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(432px, calc(100dvh - 180px), 990px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: clamp(432px, calc(100dvh - 188px), 990px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager, .dx-datagrid-rowsview), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-standard-grid-page.ff-image-standard-page.ff-image-results-visible #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target) { color: inherit !important; cursor: pointer !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target)::after { animation: none !important; content: none !important; display: none !important; visibility: hidden !important; } /* Absolute-final View Images filter spacing and grid height. Keep Branch close to Date Range and add roughly 4.5 compact rows. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-sr-card { --ff-image-date-gap-final: 8px; --ff-image-date-period-width-final: 166px; --ff-image-date-range-width-final: 248px; --ff-image-branch-width-final: 360px; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px var(--ff-image-date-gap-final) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::after, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-block { --ff-filter-date-period-width-final: var(--ff-image-date-period-width-final); --ff-filter-date-range-width-final: var(--ff-image-date-range-width-final); flex: 0 0 calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; max-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; min-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row { align-items: flex-start !important; column-gap: var(--ff-image-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-period { flex: 0 0 var(--ff-image-date-period-width-final) !important; max-width: var(--ff-image-date-period-width-final) !important; min-width: var(--ff-image-date-period-width-final) !important; width: var(--ff-image-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-range { flex: 0 0 var(--ff-image-date-range-width-final) !important; max-width: var(--ff-image-date-range-width-final) !important; min-width: var(--ff-image-date-range-width-final) !important; width: var(--ff-image-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-branch-field { flex: 0 0 var(--ff-image-branch-width-final) !important; max-width: var(--ff-image-branch-width-final) !important; min-width: 240px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 252px), 850px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 272px), 850px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 272px) !important; } } /* True-EOF View Images filter spacing and grid height. Keep Date Range and Branch separated by the standard small gap, and give the results grid another 4.5 compact rows of visible height. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-sr-card { --ff-image-document-width-final: 224px; --ff-image-date-gap-final: 8px; --ff-image-date-period-width-final: 166px; --ff-image-date-range-width-final: 248px; --ff-image-branch-width-final: 360px; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px var(--ff-image-date-gap-final) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::after, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-document-field { flex: 0 0 var(--ff-image-document-width-final) !important; max-width: var(--ff-image-document-width-final) !important; min-width: 180px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-block { --ff-filter-date-period-width-final: var(--ff-image-date-period-width-final); --ff-filter-date-range-width-final: var(--ff-image-date-range-width-final); flex: 0 0 calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; max-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; min-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row { align-items: flex-start !important; column-gap: var(--ff-image-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-period { flex: 0 0 var(--ff-image-date-period-width-final) !important; max-width: var(--ff-image-date-period-width-final) !important; min-width: var(--ff-image-date-period-width-final) !important; width: var(--ff-image-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-range { flex: 0 0 var(--ff-image-date-range-width-final) !important; max-width: var(--ff-image-date-range-width-final) !important; min-width: var(--ff-image-date-range-width-final) !important; width: var(--ff-image-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-branch-field { flex: 0 0 var(--ff-image-branch-width-final) !important; max-width: var(--ff-image-branch-width-final) !important; min-width: 240px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(500px, calc(100dvh - 90px), 1080px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: clamp(500px, calc(100dvh - 98px), 1080px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 90px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images { --ff-standard-grid-rows-max-height: calc(100vh - 98px) !important; } } /* True-EOF View Manifests single grid contract. Keep this on the Debtors rows-viewport path: no fixed whole-grid height, and the final selectors clamp every rendered data pane. */ html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-manifest-action-column-width: 34px !important; --ff-manifest-eye-size: 14px !important; --ff-manifest-rows-height: max(360px, calc(100dvh - 245px)) !important; --ff-manifest-select-column-width: 24px !important; --ff-standard-grid-action-size: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-manifest-rows-height) !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: var(--ff-manifest-rows-height) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page { --ff-manifest-rows-height: calc(100vh - 245px) !important; } } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned > .dx-datagrid, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-gridbase-container { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; max-height: none !important; min-height: 0 !important; overflow-x: hidden !important; overflow-y: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content) { max-height: none !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-manifest-rows-height) !important; height: var(--ff-manifest-rows-height) !important; max-height: var(--ff-manifest-rows-height) !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview { overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content, .dx-datagrid-content-fixed, .dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { border-spacing: 0 !important; box-sizing: border-box !important; max-width: none !important; min-height: 0 !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-command-select, .dx-command-edit, .ff-manifest-command-col) { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding: var(--ff-standard-grid-cell-padding-y) var(--ff-standard-grid-cell-padding-x) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr.dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody > tr.dx-row.dx-data-row > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(.dx-command-select, .dx-command-select > td) { max-width: var(--ff-manifest-select-column-width) !important; min-width: var(--ff-manifest-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-manifest-select-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-command-edit, .ff-manifest-command-col) { max-width: var(--ff-manifest-action-column-width) !important; min-width: var(--ff-manifest-action-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-manifest-action-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content, .ff-grid-boolean-checkbox), html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-link, .dx-button, .dx-button-content) { align-items: center !important; display: inline-flex !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: var(--ff-standard-grid-action-size) !important; min-width: var(--ff-standard-grid-action-size) !important; padding: 0 !important; width: var(--ff-standard-grid-action-size) !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-manifests-debtors-model.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa) { font-size: var(--ff-manifest-eye-size) !important; height: var(--ff-standard-grid-action-size) !important; line-height: var(--ff-standard-grid-action-size) !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-standard-grid-action-size) !important; min-height: var(--ff-standard-grid-action-size) !important; min-width: var(--ff-standard-grid-action-size) !important; width: var(--ff-standard-grid-action-size) !important; } /* Absolute-last Towns/Hubs grid cleanup. DevExtreme rebuilds command columns and scrollbars after data/edit events, so this guard wins after the shared standard-grid and Manifest rules. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; --ff-townhub-select-column-width: 32px !important; --ff-townhub-selector-size: 14px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-focus-overlay, .dx-inkripple, .dx-inkripple-wave), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview td.dx-focused::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview td.dx-focused::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; outline: 0 !important; pointer-events: none !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-command-select, .dx-command-select > td), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) colgroup col:first-child { box-sizing: border-box !important; flex: 0 0 var(--ff-townhub-select-column-width) !important; max-width: var(--ff-townhub-select-column-width) !important; min-width: var(--ff-townhub-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-townhub-select-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked) .dx-checkbox-icon:before { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-color: #8f8f8f #eef2f7 !important; scrollbar-gutter: stable !important; scrollbar-width: auto !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { background: #eef2f7 !important; bottom: 0 !important; display: block !important; height: 18px !important; min-height: 18px !important; opacity: 1 !important; pointer-events: auto !important; z-index: 6 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll, .dx-scroll, .dx-scrollable-scroll-content) { background: #8f8f8f !important; border-radius: 8px !important; height: 14px !important; min-height: 14px !important; opacity: 1 !important; pointer-events: auto !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar { height: 18px !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-track { background: #eef2f7 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-thumb { background: #8f8f8f !important; border: 2px solid #eef2f7 !important; border-radius: 8px !important; } /* Absolute-last View Manifests row/viewport lock. Target the grid marker directly so Angular wrapper changes cannot miss this rule. */ html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned.dx-datagrid, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-manifest-rows-height: max(360px, calc(100dvh - 245px)) !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; } @supports not (height: max(1px, 2px)) { html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned.dx-datagrid, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid { --ff-manifest-rows-height: calc(100vh - 245px) !important; } } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned.dx-datagrid, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-gridbase-container { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-scrollable, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-scrollable-wrapper, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-scrollable-container, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-content, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { flex: 0 0 var(--ff-manifest-rows-height) !important; height: var(--ff-manifest-rows-height) !important; max-height: var(--ff-manifest-rows-height) !important; min-height: 0 !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned.ff-grid-loading:not(.ff-grid-loading-with-data) :is(.dx-datagrid-pager, .dx-pager, .dx-datagrid-total-footer) { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .ff-manifest-data-row, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .ff-manifest-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .ff-manifest-data-row > tr > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-data-row, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-row.dx-data-row > td { block-size: 18px !important; box-sizing: border-box !important; font-size: 11px !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .ff-manifest-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .ff-manifest-data-row > tr > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-data-row > td, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview tr.dx-row.dx-data-row > td { padding-left: 4px !important; padding-right: 4px !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td > *, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td .dx-template-wrapper, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td .dx-datagrid-text-content, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td .ff-grid-cell-value, html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview .dx-data-row > td .dx-link { font-size: inherit !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: 14px !important; line-height: 14px !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; width: 14px !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-icon, .fa, .fa-eye) { align-items: center !important; display: inline-flex !important; font-size: 14px !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; padding: 0 !important; width: 16px !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { cursor: default !important; touch-action: none !important; } html body.ff-app #gridContainer#gridContainer.ff-standard-grid--manifests.ff-manifest-grid-owned .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar, .dx-scrollable-scroll) { pointer-events: auto !important; touch-action: none !important; } /* True EOF Towns/Hubs row density lock. These grids are CSS-owned; data row height must not be recalculated by compact/normal view remnants. */ html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs), html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs).dx-datagrid, html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; } html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; border-spacing: 0 !important; } html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .ff-grid-boolean-checkbox) { line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app .ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid--towns, #gridContainer1#gridContainer1.ff-standard-grid--town-hubs) .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: 14px !important; line-height: 14px !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; width: 14px !important; } /* True EOF Towns/Hubs page-owned grid lock. Towns/Hubs must not use the shared standard-grid viewport observer; one local height calculation and these variables own the page. */ html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid), html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid).dx-datagrid, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; --ff-townhub-select-column-width: 32px !important; --ff-townhub-selector-size: 14px !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-focus-overlay, .dx-inkripple, .dx-inkripple-wave), html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview td.dx-focused::before, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview td.dx-focused::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; width: 0 !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) { border-collapse: collapse !important; border-spacing: 0 !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-command-select, .dx-command-select > td), html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) colgroup col:first-child { box-sizing: border-box !important; flex: 0 0 var(--ff-townhub-select-column-width) !important; max-width: var(--ff-townhub-select-column-width) !important; min-width: var(--ff-townhub-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-townhub-select-column-width) !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; font-size: 11px !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .ff-grid-boolean-checkbox) { line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: 14px !important; line-height: 14px !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; width: 14px !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked) .dx-checkbox-icon::before, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row td:not(.dx-command-select) .dx-checkbox:not(.dx-checkbox-checked) .dx-checkbox-icon:before { background: transparent !important; border: 0 !important; box-shadow: none !important; content: "" !important; height: 0 !important; opacity: 0 !important; width: 0 !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-color: #8f8f8f #eef2f7 !important; scrollbar-gutter: stable !important; scrollbar-width: auto !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { background: #eef2f7 !important; bottom: 0 !important; display: block !important; height: 18px !important; min-height: 18px !important; opacity: 1 !important; pointer-events: auto !important; z-index: 6 !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll, .dx-scroll, .dx-scrollable-scroll-content) { background: #8f8f8f !important; border-radius: 8px !important; height: 14px !important; min-height: 14px !important; opacity: 1 !important; pointer-events: auto !important; } /* True-final View Manifests grid reset. This intentionally ignores the old Manifest marker classes so the page uses one Debtors-style standard grid path instead of the previous stacked layers. */ html body.ff-app .ff-view-manifests-simple { --ff-manifest-grid-height: calc(100dvh - 250px) !important; --ff-manifest-row-height: 18px !important; --ff-manifest-cell-line-height: 16px !important; --ff-manifest-cell-padding-x: 4px !important; --ff-manifest-cell-padding-y: 0 !important; --ff-manifest-grid-font-size: 11px !important; --ff-manifest-check-size: 14px !important; --ff-manifest-action-size: 16px !important; } @supports not (height: 100dvh) { html body.ff-app .ff-view-manifests-simple { --ff-manifest-grid-height: calc(100vh - 250px) !important; } } html body.ff-app .ff-view-manifests-simple .ff-grid-toolbar-row, html body.ff-app .ff-view-manifests-simple .ff-grid-result-row, html body.ff-app .ff-view-manifests-simple .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; margin-top: 0 !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple .ff-grid-toolbar-row > .ff-grid-toolbar-inner { min-height: 24px !important; padding-right: 220px !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer.dx-datagrid { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: var(--ff-manifest-grid-height) !important; max-height: var(--ff-manifest-grid-height) !important; max-width: 100% !important; min-height: 360px !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: 100% !important; max-height: 100% !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-header-panel { background: transparent !important; border-bottom: 0 !important; flex: 0 0 24px !important; height: 24px !important; margin-bottom: 0 !important; margin-top: -24px !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; pointer-events: none !important; position: relative !important; z-index: 4 !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-header-panel :is(.dx-toolbar, .dx-toolbar-items-container) { background: transparent !important; height: 24px !important; min-height: 24px !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-header-panel .dx-toolbar-after { align-items: center !important; display: flex !important; justify-content: flex-end !important; pointer-events: auto !important; width: auto !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-header-panel :is(.dx-button, .dx-button-content) { height: 22px !important; min-height: 22px !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; flex: 0 0 auto !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; overflow-y: hidden !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content) { max-height: none !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview { box-sizing: border-box !important; flex: 1 1 auto !important; height: auto !important; max-height: none !important; min-height: 180px !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; min-width: 0 !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { cursor: default !important; touch-action: none !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar, .dx-scrollable-scroll) { pointer-events: auto !important; touch-action: none !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content, .dx-datagrid-content-fixed, .dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { border-spacing: 0 !important; box-sizing: border-box !important; max-height: none !important; max-width: none !important; min-height: 0 !important; min-width: 100% !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row > td, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-manifest-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-manifest-grid-font-size) !important; height: var(--ff-manifest-row-height) !important; line-height: var(--ff-manifest-cell-line-height) !important; max-height: var(--ff-manifest-row-height) !important; min-height: var(--ff-manifest-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-manifest-cell-padding-y) !important; padding-left: var(--ff-manifest-cell-padding-x) !important; padding-right: var(--ff-manifest-cell-padding-x) !important; padding-top: var(--ff-manifest-cell-padding-y) !important; text-overflow: ellipsis !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > td > *, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, .dx-link, a, span, i, img, button, .btn, .label, .badge, .dx-button, .dx-button-content) { box-sizing: border-box !important; font-size: inherit !important; line-height: var(--ff-manifest-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-manifest-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select, html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) .dx-command-select > td { max-width: 26px !important; min-width: 26px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 26px !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { height: var(--ff-manifest-check-size) !important; line-height: var(--ff-manifest-check-size) !important; max-height: var(--ff-manifest-check-size) !important; max-width: var(--ff-manifest-check-size) !important; min-height: var(--ff-manifest-check-size) !important; min-width: var(--ff-manifest-check-size) !important; width: var(--ff-manifest-check-size) !important; } html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle), html body.ff-app .ff-view-manifests-simple #gridContainer#gridContainer .dx-datagrid-rowsview :is(.dx-command-edit, .ff-manifest-command-col) :is(.dx-icon, .fa, .fa-eye) { align-items: center !important; display: inline-flex !important; font-size: 14px !important; height: var(--ff-manifest-action-size) !important; justify-content: center !important; line-height: var(--ff-manifest-action-size) !important; margin: 0 auto !important; max-height: var(--ff-manifest-action-size) !important; max-width: var(--ff-manifest-action-size) !important; min-height: var(--ff-manifest-action-size) !important; min-width: var(--ff-manifest-action-size) !important; padding: 0 !important; width: var(--ff-manifest-action-size) !important; } /* Absolute EOF Towns/Hubs grid stabiliser. The page owns its height in townCtrl; this locks the rendered row metric after all shared grid-density rules so the grid does not jump between 16/18px modes. */ html body.ff-app .ff-towns.ff-towns { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; --ff-townhub-select-column-width: 32px !important; --ff-townhub-selector-size: 14px !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) { box-sizing: border-box !important; max-width: 100% !important; min-height: 260px !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row > td, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { block-size: 18px !important; box-sizing: border-box !important; font-size: 11px !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td > *, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .ff-grid-boolean-checkbox, .dx-checkbox, .dx-checkbox-container, .dx-checkbox-icon) { line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } /* Absolute EOF View Manifests Debtors-parity reset. Keep this after all shared grid density layers. View Manifests now follows the normal Debtors standard-grid path instead of the older Manifest-owned viewport/pager layers. */ html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-action-size: 14px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-x: 4px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-filter-height: 24px !important; --ff-standard-grid-font-size: 11px !important; --ff-standard-grid-header-height: 24px !important; --ff-standard-grid-pager-height: 22px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: max(300px, calc(100dvh - 326px)) !important; --ff-standard-grid-total-footer-height: 24px !important; --ff-view-manifest-command-column-width: 34px !important; --ff-view-manifest-eye-width: 18px !important; --ff-view-manifest-select-column-width: 24px !important; } @supports not (height: max(1px, 2px)) { html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 326px) !important; } } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-result-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-result-row > .ff-grid-result-col, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.dx-datagrid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid > .dx-datagrid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-gridbase-container { box-sizing: border-box !important; height: auto !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: none !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; gap: 6px !important; min-height: 24px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-left, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-right { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 6px !important; min-width: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-left { flex: 1 1 auto !important; justify-content: flex-start !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-right { flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-actions-host, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-actions-host--icon-only { display: inline-flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 0 !important; order: 999 !important; overflow: visible !important; position: static !important; right: auto !important; top: auto !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-actions { display: inline-flex !important; flex: 0 0 auto !important; gap: 2px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; overflow: visible !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-gridbase-container { display: flex !important; flex-direction: column !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-header-panel { background: transparent !important; border-bottom: 0 !important; flex: 0 0 24px !important; height: 24px !important; margin-bottom: 0 !important; margin-top: -24px !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; pointer-events: none !important; position: relative !important; z-index: 4 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-header-panel .dx-toolbar-after { align-items: center !important; display: flex !important; justify-content: flex-end !important; left: auto !important; margin-left: auto !important; max-width: none !important; min-width: 0 !important; pointer-events: auto !important; right: 0 !important; top: 0 !important; width: auto !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-headers, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-pager, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-pager { flex: 0 0 auto !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; overflow-y: hidden !important; width: 100% !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-wrapper, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table-fixed, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table > tbody, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table-fixed > tbody, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content { border-spacing: 0 !important; height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-content { min-height: 100% !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-data-row > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: var(--ff-standard-grid-cell-padding-x) !important; padding-right: var(--ff-standard-grid-cell-padding-x) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; transition: none !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { height: var(--ff-standard-grid-total-footer-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-total-footer-height) !important; min-height: var(--ff-standard-grid-total-footer-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; vertical-align: middle !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td > *, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .dx-template-wrapper, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .dx-datagrid-text-content, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .ff-grid-cell-value, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .dx-link, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td a, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td i, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td button, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .dx-button, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .dx-button-content, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td .ff-grid-boolean-checkbox, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td span, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer td span, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer td div, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-total-footer td .dx-datagrid-summary-item { height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-headers .dx-command-select, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-command-select, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-command-select, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-headers .dx-command-select > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-command-select > td, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-command-select > td { max-width: var(--ff-view-manifest-select-column-width) !important; min-width: var(--ff-view-manifest-select-column-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-manifest-select-column-width) !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-command-select, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-command-edit, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .ff-manifest-command-col { box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: visible !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-headers .dx-command-edit, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-filter-row .dx-command-edit, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-command-edit, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-headers .ff-manifest-command-col, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-filter-row .ff-manifest-command-col, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col { max-width: var(--ff-view-manifest-command-column-width) !important; min-width: var(--ff-view-manifest-command-column-width) !important; width: var(--ff-view-manifest-command-column-width) !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-checkbox, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-select-checkbox, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-checkbox-wrapper, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-checkbox-container, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-checkbox-icon { height: var(--ff-standard-grid-check-size) !important; line-height: var(--ff-standard-grid-check-size) !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .dx-link, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .dx-button, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .dx-button-content, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .dx-icon, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .fa, html body.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .ff-manifest-command-col .fa-eye { align-items: center !important; display: inline-flex !important; font-size: 14px !important; height: var(--ff-standard-grid-action-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-action-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-action-size) !important; max-width: var(--ff-view-manifest-eye-width) !important; min-height: var(--ff-standard-grid-action-size) !important; min-width: var(--ff-view-manifest-eye-width) !important; overflow: visible !important; padding: 0 !important; width: var(--ff-view-manifest-eye-width) !important; } /* Absolute final Towns/Hubs viewport and density pass. Keep after shared grid rules so the tab page fills the remaining viewport without re-entering the standard-grid resize observer. */ html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable { display: flex !important; flex-direction: column !important; margin-bottom: 0 !important; min-height: calc(100dvh - 126px) !important; } html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .nav, html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .nav-tabs { flex: 0 0 auto !important; } html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; min-height: 0 !important; } html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content > .tab-pane { min-height: 0 !important; } html body.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content > .tab-pane.active { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; } html body.ff-app .ff-towns.ff-towns { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-row, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-row > td, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview tr.dx-data-row, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview tr.dx-data-row > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-row > td { padding-left: 4px !important; padding-right: 4px !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-command-select, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-command-select > td { padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td > *, html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .ff-grid-boolean-checkbox) { line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { box-sizing: border-box !important; height: 14px !important; line-height: 14px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; width: 14px !important; } /* Absolute-final Debriefing filter close button polish. Match the SEARCH button height, keep the X stable, and make the close action grey until hover/focus. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions { --ff-debrief-filter-action-height: var(--ff-control-h, 30px); } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .ff-filter-search { align-items: center !important; display: inline-flex !important; height: var(--ff-debrief-filter-action-height) !important; justify-content: center !important; line-height: var(--ff-debrief-filter-action-height) !important; max-height: var(--ff-debrief-filter-action-height) !important; min-height: var(--ff-debrief-filter-action-height) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .btn.ff-filter-close, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .btn.ff-filter-close:not(:hover):not(:focus):not(:active):not(.active) { align-items: center !important; background: color-mix(in srgb, var(--text-muted) 18%, var(--surface-3)) !important; border-color: color-mix(in srgb, var(--text-muted) 42%, var(--border)) !important; color: var(--text) !important; display: inline-flex !important; flex: 0 0 var(--ff-debrief-filter-action-height) !important; height: var(--ff-debrief-filter-action-height) !important; justify-content: center !important; line-height: var(--ff-debrief-filter-action-height) !important; max-height: var(--ff-debrief-filter-action-height) !important; max-width: var(--ff-debrief-filter-action-height) !important; min-height: var(--ff-debrief-filter-action-height) !important; min-width: var(--ff-debrief-filter-action-height) !important; padding: 0 !important; width: var(--ff-debrief-filter-action-height) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .btn.ff-filter-close:is(:hover, :focus, :active, .active) { background: var(--error) !important; border-color: var(--error) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card .ff-filter-actions .btn.ff-filter-close > .fa { font-size: 14px !important; line-height: 1 !important; } /* Absolute-final Towns/Hubs spacing and density follow-up. Keep this at EOF so old compact/standard grid rules cannot stretch the page or inflate the rendered DevExtreme data rows. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-query-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-query-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-query-grid-page > .container-fluid.container-fullw.bg-white { margin-bottom: 0 !important; min-height: 0 !important; overflow: visible !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable { display: flex !important; flex-direction: column !important; height: auto !important; margin-bottom: 0 !important; max-height: none !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .nav, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .nav-tabs { flex: 0 0 auto !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 2px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content > .tab-pane, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content > .tab-pane.active { margin-bottom: 0 !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns > .container-fullw > .tabbable > .tab-content > .tab-pane.active { display: flex !important; flex: 1 1 auto !important; flex-direction: column !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns .ff-grid-toolbar-row { margin-bottom: 1px !important; margin-top: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns .ff-grid-toolbar-inner { align-items: center !important; gap: 2px 6px !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns .ff-grid-toolbar-inner :is(.label, .btn, .checkbox, .checkbox-inline, .valuesonly) { margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-townhub-check-size: 14px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-data-row), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-data-row) > td { block-size: var(--ff-townhub-row-height) !important; box-sizing: border-box !important; height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-content-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td > *:not(input):not(textarea):not(.dx-texteditor-input), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .ff-grid-boolean-checkbox) { box-sizing: border-box !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-command-select, .dx-command-edit) > td { height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-row-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { box-sizing: border-box !important; height: var(--ff-townhub-check-size) !important; line-height: var(--ff-townhub-check-size) !important; margin: 0 auto !important; max-height: var(--ff-townhub-check-size) !important; max-width: var(--ff-townhub-check-size) !important; min-height: var(--ff-townhub-check-size) !important; min-width: var(--ff-townhub-check-size) !important; padding: 0 !important; width: var(--ff-townhub-check-size) !important; } /* True-final Towns/Hubs editable-cell density lock. The grid rows were still being inflated by editable boolean/text editor wrappers and native checkbox fallbacks, which were intentionally skipped by the generic child clamp above. Keep this last so those controls cannot push data rows above the Debtors-style 18px row contract. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview :is(td.dx-editor-cell, td.dx-command-select, td.dx-command-edit, td.dx-cell-modified, td.dx-focused, td.dx-datagrid-group-space) { block-size: var(--ff-townhub-row-height) !important; box-sizing: border-box !important; height: var(--ff-townhub-row-height) !important; line-height: var(--ff-townhub-content-height) !important; max-height: var(--ff-townhub-row-height) !important; min-height: var(--ff-townhub-row-height) !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-state-readonly) { block-size: var(--ff-townhub-content-height) !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-content-height) !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container) { align-items: center !important; block-size: var(--ff-townhub-content-height) !important; box-sizing: border-box !important; display: flex !important; height: var(--ff-townhub-content-height) !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-texteditor-input, input.dx-texteditor-input) { block-size: var(--ff-townhub-content-height) !important; box-sizing: border-box !important; display: block !important; height: var(--ff-townhub-content-height) !important; line-height: var(--ff-townhub-content-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-townhub-content-height) !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(input[type="checkbox"], input[type="radio"]) { align-items: center !important; block-size: var(--ff-townhub-check-size) !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-check-size) !important; justify-content: center !important; line-height: var(--ff-townhub-check-size) !important; margin: 0 auto !important; max-height: var(--ff-townhub-check-size) !important; max-width: var(--ff-townhub-check-size) !important; min-height: var(--ff-townhub-check-size) !important; min-width: var(--ff-townhub-check-size) !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-townhub-check-size) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td:has(> .ff-grid-boolean-checkbox), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td:has(input[type="checkbox"]), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td:has(input[type="radio"]) { text-align: center !important; } /* Absolute-final shared filter close styling. Keep the close X quiet until the user aims at it: grey by default, pale red on hover/focus. This is visual only; earlier layout/order rules still place the buttons per page. */ html body.ff-app.ff-app.ff-app .btn:is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter, .ff-receivers-close-filter):not(:hover):not(:focus):not(:active):not(.active) { background: var(--surface-3, #eef2f6) !important; background: color-mix(in srgb, var(--text-muted) 12%, var(--surface-2, #f8fafc)) !important; border-color: var(--border, #d7dee8) !important; border-color: color-mix(in srgb, var(--text-muted) 35%, var(--border, #d7dee8)) !important; color: var(--text-muted) !important; } html body.ff-app.ff-app.ff-app .btn:is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter, .ff-receivers-close-filter):is(:hover, :focus, :active, .active) { background: #fff2f2 !important; background: color-mix(in srgb, var(--error, #ff4d4f) 14%, var(--surface-2, #fff)) !important; border-color: #ffb8b8 !important; border-color: color-mix(in srgb, var(--error, #ff4d4f) 42%, var(--border, #d7dee8)) !important; color: var(--error, #ff4d4f) !important; } html body.ff-app.ff-app.ff-app .btn:is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter, .ff-route-close-filter, .ff-debtors-close-filter, .ff-cons-close-filter, .ff-receivers-close-filter) > .fa { color: inherit !important; } /* Absolute-final Date Period filter height repair. Earlier compact filter passes squeeze this control to 24px on some view pages, which clips the select text and the Ignore label. This stays outside DevExtreme grids so compact/normal cannot change grid fit calculations. */ html body.ff-app.ff-app.ff-app { --ff-filter-date-period-control-height: 28px; } html body.ff-app.ff-app.ff-app :is(.ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period) :is(.ff-date-period-group, .ff-image-date-period-group, .ff-route-date-period-group), html body.ff-app.ff-app.ff-app .input-group:has(> .input-group-addon.input-group-addon-grey.input-group-addon-less-padding + select.form-control) { align-items: stretch !important; display: flex !important; height: var(--ff-filter-date-period-control-height) !important; line-height: var(--ff-filter-date-period-control-height) !important; max-height: var(--ff-filter-date-period-control-height) !important; min-height: var(--ff-filter-date-period-control-height) !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app :is(.ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period) :is(.ff-date-period-ignore, .ff-image-date-period-ignore, .ff-route-date-period-ignore, .input-group-addon.input-group-addon-grey.input-group-addon-less-padding), html body.ff-app.ff-app.ff-app .input-group:has(> .input-group-addon.input-group-addon-grey.input-group-addon-less-padding + select.form-control) > .input-group-addon.input-group-addon-grey.input-group-addon-less-padding { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-filter-date-period-control-height) !important; line-height: var(--ff-filter-date-period-control-height) !important; max-height: var(--ff-filter-date-period-control-height) !important; min-height: var(--ff-filter-date-period-control-height) !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: top !important; } html body.ff-app.ff-app.ff-app :is(.ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period) :is(.ff-date-period-ignore-label, .ff-image-date-period-ignore-label, .ff-route-date-period-ignore-label), html body.ff-app.ff-app.ff-app .input-group:has(> .input-group-addon.input-group-addon-grey.input-group-addon-less-padding + select.form-control) > .input-group-addon.input-group-addon-grey.input-group-addon-less-padding #ignoreDate + label { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-filter-date-period-control-height) !important; line-height: var(--ff-filter-date-period-control-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-filter-date-period-control-height) !important; min-height: var(--ff-filter-date-period-control-height) !important; overflow: visible !important; transform: none !important; } html body.ff-app.ff-app.ff-app :is(.ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period) :is(select.form-control, .ff-date-period-select, .ff-image-date-period-select), html body.ff-app.ff-app.ff-app .input-group:has(> .input-group-addon.input-group-addon-grey.input-group-addon-less-padding + select.form-control) > select.form-control { box-sizing: border-box !important; height: var(--ff-filter-date-period-control-height) !important; line-height: 20px !important; max-height: var(--ff-filter-date-period-control-height) !important; min-height: var(--ff-filter-date-period-control-height) !important; overflow: visible !important; padding-bottom: 3px !important; padding-top: 3px !important; vertical-align: top !important; } /* View Waybills UI-only normal/compact density trial. This intentionally uses data-ui-density / ff-ui-density-* instead of the old grid-density hooks, and it is scoped to page chrome only: page header, filter controls, and the toolbar above the grid. Do not add #gridContainer, .dx-datagrid, .ff-standard-grid, or .ff-view-waybills-grid-row selectors here. */ html body.ff-app.ff-app.ff-app .ff-view-waybills :is(#page-title.ff-page-header, .ff-view-waybills-filter-panel, .ff-view-waybills-grid-toolbar-row) { --ff-waybill-ui-control-h: 30px; --ff-waybill-ui-font-size: 12px; --ff-waybill-ui-label-font-size: 12px; --ff-waybill-ui-label-line-height: 18px; --ff-waybill-ui-label-min-height: 20px; --ff-waybill-ui-row-gap: 4px; --ff-waybill-ui-column-gap: 10px; --ff-waybill-ui-card-pad-x: 10px; --ff-waybill-ui-card-pad-y: 6px; --ff-waybill-ui-button-pad-x: 10px; --ff-waybill-ui-action-pad-y: 4px; --ff-waybill-ui-action-h: 58px; --ff-waybill-ui-action-w: 96px; --ff-waybill-ui-action-font-size: 12px; --ff-waybill-ui-title-size: 30px; --ff-waybill-ui-view-select-w: 115px; --ff-waybill-ui-view-select-min-w: 103px; --ff-waybill-ui-view-select-max-w: 132px; --ff-waybill-ui-date-period-w: 214px; --ff-filter-date-period-control-height: var(--ff-waybill-ui-control-h); --ff-control-h: var(--ff-waybill-ui-control-h); font-size: var(--ff-waybill-ui-font-size) !important; } html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-view-waybills :is(#page-title.ff-page-header, .ff-view-waybills-filter-panel, .ff-view-waybills-grid-toolbar-row), html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-view-waybills :is(#page-title.ff-page-header, .ff-view-waybills-filter-panel, .ff-view-waybills-grid-toolbar-row) { --ff-waybill-ui-control-h: 26px; --ff-waybill-ui-font-size: 10.2px; --ff-waybill-ui-label-font-size: 10.2px; --ff-waybill-ui-label-line-height: 15.3px; --ff-waybill-ui-label-min-height: 17px; --ff-waybill-ui-row-gap: 3.4px; --ff-waybill-ui-column-gap: 8.5px; --ff-waybill-ui-card-pad-x: 8.5px; --ff-waybill-ui-card-pad-y: 5px; --ff-waybill-ui-button-pad-x: 8.5px; --ff-waybill-ui-action-pad-y: 1px; --ff-waybill-ui-action-h: 40px; --ff-waybill-ui-action-w: 94px; --ff-waybill-ui-action-font-size: 12px; --ff-waybill-ui-title-size: 25.5px; --ff-waybill-ui-view-select-w: 115px; --ff-waybill-ui-view-select-min-w: 103px; --ff-waybill-ui-view-select-max-w: 132px; --ff-waybill-ui-date-period-w: 200px; } html body.ff-app.ff-app.ff-app .ff-view-waybills #page-title.ff-page-header .ff-page-title { font-size: var(--ff-waybill-ui-title-size) !important; line-height: 1.05 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills #page-title.ff-page-header .ff-toolbar { gap: var(--ff-waybill-ui-column-gap) !important; } html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-view-waybills #page-title.ff-page-header, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-view-waybills #page-title.ff-page-header { margin-bottom: 0 !important; padding-bottom: 2px !important; padding-top: 2px !important; } html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-view-waybills #page-title.ff-page-header .ff-page-header-row, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-view-waybills #page-title.ff-page-header .ff-page-header-row { align-items: center !important; gap: var(--ff-waybill-ui-column-gap) !important; min-height: var(--ff-waybill-ui-action-h) !important; } html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-view-waybills #page-title.ff-page-header .ff-toolbar, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-view-waybills #page-title.ff-page-header .ff-toolbar { align-items: center !important; min-height: var(--ff-waybill-ui-action-h) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills #page-title.ff-page-header .ff-action { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex-direction: column !important; font-size: var(--ff-waybill-ui-action-font-size) !important; gap: 2px !important; height: var(--ff-waybill-ui-action-h) !important; justify-content: center !important; max-height: var(--ff-waybill-ui-action-h) !important; max-width: var(--ff-waybill-ui-action-w) !important; min-height: var(--ff-waybill-ui-action-h) !important; min-width: var(--ff-waybill-ui-action-w) !important; overflow: hidden !important; padding: var(--ff-waybill-ui-action-pad-y) var(--ff-waybill-ui-button-pad-x) !important; width: var(--ff-waybill-ui-action-w) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills #page-title.ff-page-header .ff-action > i { font-size: 14px !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-view-waybills #page-title.ff-page-header .ff-action > i, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-view-waybills #page-title.ff-page-header .ff-action > i { font-size: 15px !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills #page-title.ff-page-header .ff-action-label { font-size: var(--ff-waybill-ui-action-font-size) !important; line-height: 1.1 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .ff-sr-card { padding: 0 var(--ff-waybill-ui-card-pad-x) var(--ff-waybill-ui-card-pad-y) var(--ff-waybill-ui-card-pad-x) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel fieldset > legend.ff-sr-legend { margin-bottom: var(--ff-waybill-ui-row-gap) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .ff-sr-legend__text { font-size: calc(var(--ff-waybill-ui-label-font-size) + 1px) !important; line-height: var(--ff-waybill-ui-label-line-height) !important; padding: 2px 7px !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) { gap: var(--ff-waybill-ui-row-gap) var(--ff-waybill-ui-column-gap) !important; margin-bottom: var(--ff-waybill-ui-row-gap) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .ff-waybill-filter-grid { column-gap: var(--ff-waybill-ui-column-gap) !important; row-gap: var(--ff-waybill-ui-row-gap) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) label, html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.checkbox, .checkbox-inline, .valuesonly) label { font-size: var(--ff-waybill-ui-label-font-size) !important; line-height: var(--ff-waybill-ui-label-line-height) !important; margin-bottom: 1px !important; min-height: var(--ff-waybill-ui-label-min-height) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) :is(.form-control, .ff-control, .ui-select-container, .ui-select-bootstrap, .ui-select-bootstrap > .ui-select-match), html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) :is(.dx-texteditor, .dx-texteditor-container, .dx-texteditor-input) { box-sizing: border-box !important; font-size: var(--ff-waybill-ui-font-size) !important; height: var(--ff-waybill-ui-control-h) !important; line-height: 1.2 !important; max-height: var(--ff-waybill-ui-control-h) !important; min-height: var(--ff-waybill-ui-control-h) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.ff-waybill-filter-grid, .ff-filter-flow-row, .ff-filter-inline-row) textarea.form-control { overflow-y: auto !important; resize: none !important; white-space: pre-wrap !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .ff-filter-date-period { --ff-control-h: var(--ff-filter-date-period-control-height); --ff-filter-date-period-width-final: var(--ff-waybill-ui-date-period-w); flex: 0 0 var(--ff-waybill-ui-date-period-w) !important; max-width: var(--ff-waybill-ui-date-period-w) !important; min-width: var(--ff-waybill-ui-date-period-w) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .ff-filter-date-period :is(.input-group, .input-group-addon, select.form-control) { height: var(--ff-filter-date-period-control-height) !important; max-height: var(--ff-filter-date-period-control-height) !important; min-height: var(--ff-filter-date-period-control-height) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel :is(.btn, .ff-filter-close, .ff-waybill-column-loading-toggle, .ff-filter-search) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; font-size: var(--ff-waybill-ui-font-size) !important; height: var(--ff-waybill-ui-control-h) !important; justify-content: center !important; line-height: 1.1 !important; max-height: var(--ff-waybill-ui-control-h) !important; min-height: var(--ff-waybill-ui-control-h) !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row { gap: 1px var(--ff-waybill-ui-column-gap) !important; min-height: calc(var(--ff-waybill-ui-control-h) + 2px) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row :is(.label, .btn, .form-control, .ff-grid-view-select) { box-sizing: border-box !important; font-size: var(--ff-waybill-ui-font-size) !important; min-height: var(--ff-waybill-ui-control-h) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .btn { align-items: center !important; display: inline-flex !important; height: var(--ff-waybill-ui-control-h) !important; justify-content: center !important; line-height: 1.1 !important; max-height: var(--ff-waybill-ui-control-h) !important; padding: 0 var(--ff-waybill-ui-button-pad-x) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .ff-grid-view-select { flex: 0 0 var(--ff-waybill-ui-view-select-w) !important; height: var(--ff-waybill-ui-control-h) !important; line-height: 1.2 !important; max-height: var(--ff-waybill-ui-control-h) !important; max-width: var(--ff-waybill-ui-view-select-max-w) !important; min-width: var(--ff-waybill-ui-view-select-min-w) !important; padding-bottom: 2px !important; padding-top: 2px !important; width: var(--ff-waybill-ui-view-select-w) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .ff-grid-view-toolbar .ff-grid-reset-layout-btn { flex: 0 0 var(--ff-waybill-ui-control-h) !important; height: var(--ff-waybill-ui-control-h) !important; margin-left: 0 !important; max-height: var(--ff-waybill-ui-control-h) !important; max-width: var(--ff-waybill-ui-control-h) !important; min-height: var(--ff-waybill-ui-control-h) !important; min-width: var(--ff-waybill-ui-control-h) !important; padding: 0 !important; width: var(--ff-waybill-ui-control-h) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row :is(.ff-grid-view-caption, .valuesonly, .checkbox-inline, .clip-check label) { font-size: var(--ff-waybill-ui-label-font-size) !important; line-height: var(--ff-waybill-ui-control-h) !important; min-height: var(--ff-waybill-ui-control-h) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check label, html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-filter-panel .clip-check label { padding-left: 24px !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .valuesonly.is-null { opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills .ff-view-waybills-grid-toolbar-row .valuesonly.is-null .clip-check label { color: color-mix(in srgb, var(--text-muted, #6b7280) 78%, var(--surface, #ffffff)) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check label { color: var(--text-muted, #bfbfbf) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check label::before, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check label:before { background: color-mix(in srgb, var(--surface, #151821) 72%, #000000) !important; border: 2px solid color-mix(in srgb, var(--text-muted, #bfbfbf) 70%, var(--surface, #151821)) !important; box-shadow: 0 0 0 1px color-mix(in srgb, var(--surface, #151821) 45%, transparent) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check input[type="checkbox"]:checked + label::before, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check input[type="checkbox"]:checked + label:before { background: var(--primary, #6aa8ff) !important; border-color: var(--primary, #6aa8ff) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check input[type="checkbox"]:checked + label::after, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-waybills .ff-view-waybills-grid-toolbar-row .clip-check input[type="checkbox"]:checked + label:after { color: var(--on-primary, #0b1220) !important; } /* Portal UI density, grid-safe edition. The normal/compact switch now owns page chrome and form controls only. Keep DevExtreme grid internals out of these selectors so row height, pager, scrollbar and viewport sizing stay controlled by the grid-specific rules. */ html body.ff-app.ff-app.ff-app { --ff-ui-density-action-h: 52px; --ff-ui-density-action-w: 96px; --ff-ui-density-action-gap: 4px; --ff-ui-density-action-icon-size: 15px; --ff-ui-density-action-label-size: 11px; --ff-ui-density-action-pad-x: 9px; --ff-ui-density-action-pad-y: 4px; --ff-ui-density-control-h: 30px; --ff-ui-density-font-size: 12px; --ff-ui-density-label-size: 12px; --ff-ui-density-label-line-height: 18px; --ff-ui-density-page-pad-y: 6px; --ff-ui-density-section-pad-x: 10px; --ff-ui-density-section-pad-y: 6px; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) { --ff-ui-density-action-h: 40px; --ff-ui-density-action-w: 94px; --ff-ui-density-action-gap: 3px; --ff-ui-density-action-icon-size: 13.5px; --ff-ui-density-action-label-size: 12px; --ff-ui-density-action-pad-x: 5px; --ff-ui-density-action-pad-y: 1px; --ff-ui-density-control-h: 26px; --ff-ui-density-font-size: 10.2px; --ff-ui-density-label-size: 10.2px; --ff-ui-density-label-line-height: 15px; --ff-ui-density-page-pad-y: 2px; --ff-ui-density-section-pad-x: 8px; --ff-ui-density-section-pad-y: 5px; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header { margin-bottom: calc(var(--ff-ui-density-page-pad-y) + 2px) !important; padding-bottom: var(--ff-ui-density-page-pad-y) !important; padding-top: var(--ff-ui-density-page-pad-y) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title.ff-page-header { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-page-header-row { align-items: center !important; min-height: var(--ff-ui-density-action-h) !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar { align-items: center !important; gap: var(--ff-ui-density-action-gap) !important; min-height: var(--ff-ui-density-action-h) !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar :is(.ff-action, .btn-group > .dropdown-toggle, button.dropdown-toggle, a.dropdown-toggle) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex-direction: column !important; gap: var(--ff-ui-density-action-gap) !important; height: var(--ff-ui-density-action-h) !important; justify-content: center !important; line-height: 1 !important; max-height: var(--ff-ui-density-action-h) !important; max-width: var(--ff-ui-density-action-w) !important; min-height: var(--ff-ui-density-action-h) !important; min-width: var(--ff-ui-density-action-w) !important; overflow: hidden !important; padding: var(--ff-ui-density-action-pad-y) var(--ff-ui-density-action-pad-x) !important; text-align: center !important; width: var(--ff-ui-density-action-w) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title.ff-page-header .ff-toolbar :is(.ff-action, .btn-group > .dropdown-toggle, button.dropdown-toggle, a.dropdown-toggle) { flex-direction: row !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar :is(.ff-action, .btn-group > .dropdown-toggle, button.dropdown-toggle, a.dropdown-toggle) :is(i, .fa, .text30) { font-size: var(--ff-ui-density-action-icon-size) !important; line-height: 1 !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar :is(.ff-action-label, .values p) { display: block !important; font-size: var(--ff-ui-density-action-label-size) !important; line-height: 1 !important; margin: 0 !important; max-width: 100% !important; overflow: hidden !important; text-align: center !important; text-overflow: ellipsis !important; text-transform: uppercase !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar .sparkline, html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar .values { align-items: center !important; display: inline-flex !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar .caret { margin-left: 2px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(.ff-sr-card, .panel, fieldset):not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { padding-left: var(--ff-ui-density-section-pad-x) !important; padding-right: var(--ff-ui-density-section-pad-x) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(.ff-sr-card):not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { padding-bottom: var(--ff-ui-density-section-pad-y) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(.form-group, .dx-field, .checkbox, .checkbox-inline, .radio, .radio-inline, .valuesonly):not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { font-size: var(--ff-ui-density-font-size) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(label, .control-label, .ff-sr-legend__text, .caption, .checkbox label, .radio label):not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { font-size: var(--ff-ui-density-label-size) !important; line-height: var(--ff-ui-density-label-line-height) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(.form-control, .ff-control, .ui-select-container, .ui-select-bootstrap, .ui-select-bootstrap > .ui-select-match, .ui-select-bootstrap > .ui-select-match > .btn, .input-group-addon, .btn, .ff-btn):not(.dx-datagrid *):not(.dx-datagrid):not(.dx-pager *):not(.dx-toolbar *):not(.ff-standard-grid *) { box-sizing: border-box !important; font-size: var(--ff-ui-density-font-size) !important; min-height: var(--ff-ui-density-control-h) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page :is(input.form-control, select.form-control, .ff-control, .ui-select-container, .ui-select-bootstrap, .ui-select-bootstrap > .ui-select-match, .ui-select-bootstrap > .ui-select-match > .btn, .input-group-addon):not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { height: var(--ff-ui-density-control-h) !important; max-height: var(--ff-ui-density-control-h) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page textarea.form-control:not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { max-height: var(--ff-ui-density-control-h) !important; min-height: var(--ff-ui-density-control-h) !important; overflow-y: auto !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) .ff-page .clip-check label:not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { line-height: var(--ff-ui-density-control-h) !important; } /* Toolbar dropdowns must stay above overlay filter panels. Filter panels use z-index 1050, so lift the page toolbar stack without touching grid dropdowns or DevExtreme overlays. */ html body.ff-app.ff-app.ff-app #page-title { overflow: visible !important; position: relative !important; z-index: 1300 !important; } html body.ff-app.ff-app.ff-app #page-title .ff-toolbar, html body.ff-app.ff-app.ff-app #page-title .ff-toolbar .btn-group, html body.ff-app.ff-app.ff-app #page-title .ff-toolbar .dropdown, html body.ff-app.ff-app.ff-app #page-title .ff-toolbar .uib-dropdown, html body.ff-app.ff-app.ff-app #page-title > .btn-group, html body.ff-app.ff-app.ff-app #page-title > .dropdown, html body.ff-app.ff-app.ff-app #page-title > .uib-dropdown, html body.ff-app.ff-app.ff-app #page-title :is(.ff-page-header-row, .page-title-row, .row) > :is(.btn-group, .dropdown, .uib-dropdown) { overflow: visible !important; position: relative !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title .ff-toolbar :is(.btn-group, .dropdown, .uib-dropdown), html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title > :is(.btn-group, .dropdown, .uib-dropdown), html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title :is(.ff-page-header-row, .page-title-row, .row) > :is(.btn-group, .dropdown, .uib-dropdown) { align-items: center !important; display: inline-flex !important; height: var(--ff-ui-density-action-h) !important; line-height: 1 !important; max-height: var(--ff-ui-density-action-h) !important; min-height: var(--ff-ui-density-action-h) !important; } html body.ff-app.ff-app.ff-app #page-title .ff-toolbar :is(.btn-group.open, .dropdown.open, .uib-dropdown.open), html body.ff-app.ff-app.ff-app #page-title .ff-toolbar :is(.btn-group.uib-dropdown-open, .dropdown.uib-dropdown-open, .uib-dropdown.uib-dropdown-open), html body.ff-app.ff-app.ff-app #page-title > :is(.btn-group.open, .dropdown.open, .uib-dropdown.open, .btn-group.uib-dropdown-open, .dropdown.uib-dropdown-open, .uib-dropdown.uib-dropdown-open), html body.ff-app.ff-app.ff-app #page-title :is(.ff-page-header-row, .page-title-row, .row) > :is(.btn-group.open, .dropdown.open, .uib-dropdown.open, .btn-group.uib-dropdown-open, .dropdown.uib-dropdown-open, .uib-dropdown.uib-dropdown-open) { z-index: 32000 !important; } html body.ff-app.ff-app.ff-app #page-title :is(.dropdown-menu, .generate-menu, .dropdown-light) { z-index: 32000 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title :is(.btn-group, .dropdown, .uib-dropdown) > :is(.dropdown-menu, .generate-menu, .dropdown-light) { margin-top: 0 !important; top: 100% !important; } html body.ff-app.ff-app.ff-app .ff-capture-page #page-title .ff-toolbar .ff-stage-options-menu { left: 50% !important; right: auto !important; min-width: 220px !important; text-align: left !important; transform: translateX(-50%) !important; } html body.ff-app.ff-app.ff-app .ff-capture-page #page-title .ff-toolbar .ff-stage-options-menu > li > a { display: block !important; padding-left: 32px !important; padding-right: 32px !important; text-align: left !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-imaging #page-title .ff-toolbar .ff-imaging-options-menu { left: 50% !important; right: auto !important; min-width: 240px !important; transform: translateX(-50%) !important; } html body.ff-app.ff-app.ff-app .ff-imaging #page-title .ff-toolbar .ff-imaging-options-menu > li > .dropdownBtn { display: block !important; padding-left: 32px !important; padding-right: 32px !important; text-align: center !important; white-space: nowrap !important; } /* Top navbar dropdowns must sit above page toolbars while open. Keep the fixed topbar in its normal position; only lift its layer. */ html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav.navbar:has(.navbar-right > li.dropdown.open), html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav.navbar:has(.navbar-right > li.uib-dropdown-open) { overflow: visible !important; z-index: 33050 !important; } html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .ff-topnav-bg:has(.navbar-right > li.dropdown.open), html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .ff-topnav-bg:has(.navbar-right > li.uib-dropdown-open) { overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right:has(> li.dropdown.open), html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right:has(> li.uib-dropdown-open) { overflow: visible !important; position: relative !important; z-index: 33051 !important; } html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right > li.dropdown.open, html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right > li.uib-dropdown-open { position: relative !important; z-index: 33060 !important; } html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right > li.dropdown.open > .dropdown-menu, html body.ff-app.ff-app.ff-app .ff-shell .ff-topnav .navbar-right > li.uib-dropdown-open > .dropdown-menu { z-index: 33060 !important; } /* Final Receiver selector/action visibility guard. This must sit after shared density rules so fixed command cells do not blank while the rows viewport is scrolled. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-data-row, .dx-data-row > td, .dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .ff-receivers-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-edit, .ff-receivers-command-col) :is(.ff-receivers-row-actions, .dx-dropdownbutton, .dx-button, .dx-button-content, .dx-dropdownbutton-action, .dx-icon, .fa) { opacity: 1 !important; overflow: visible !important; visibility: visible !important; } /* Final Receiver fixed/scrollable row alignment lock. DevExtreme renders the fixed selector/actions and normal data cells as separate tables, so both panes must share one exact row height. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers { --ff-receivers-row-height-final: var(--ff-standard-grid-row-height, var(--ff-grid-row-height, 18px)) !important; --ff-receivers-cell-line-height-final: var(--ff-standard-grid-cell-line-height, calc(var(--ff-receivers-row-height-final) - 2px)) !important; --ff-receivers-cell-padding-y-final: var(--ff-standard-grid-cell-padding-y, var(--ff-grid-cell-padding-y, 0px)) !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { block-size: var(--ff-receivers-row-height-final) !important; box-sizing: border-box !important; height: var(--ff-receivers-row-height-final) !important; line-height: var(--ff-receivers-cell-line-height-final) !important; max-height: var(--ff-receivers-row-height-final) !important; min-height: var(--ff-receivers-row-height-final) !important; padding-bottom: var(--ff-receivers-cell-padding-y-final) !important; padding-top: var(--ff-receivers-cell-padding-y-final) !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-data-row > td { overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-data-row > td :is(.dx-template-wrapper, .dx-datagrid-text-content, a, .dx-link, .btn, button, .label) { line-height: var(--ff-receivers-cell-line-height-final) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-receivers-cell-line-height-final) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-command-select, .ff-receivers-select-col, .dx-command-edit, .ff-receivers-command-col), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview :is(.dx-command-select, .ff-receivers-select-col, .dx-command-edit, .ff-receivers-command-col) > td { overflow: visible !important; } /* Final Debtors/Receivers scrollbar hit-zone repair. Keep the track clickable right next to the painted thumb by clipping DevExtreme's wider reserved thumb wrapper back to the visible slider. */ html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar) { box-sizing: border-box !important; overflow: hidden !important; pointer-events: auto !important; z-index: 8 !important; } html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { max-width: 15px !important; min-width: 15px !important; right: 0 !important; width: 15px !important; } html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: 15px !important; max-height: 15px !important; min-height: 15px !important; } html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) :is(.dx-scrollable-scroll, .dx-scroll) { box-sizing: border-box !important; float: right !important; margin-right: 2px !important; max-width: 11px !important; min-width: 11px !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; width: 11px !important; } html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll, .dx-scroll) { box-sizing: border-box !important; height: 11px !important; margin-top: 2px !important; max-height: 11px !important; min-height: 11px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-debtors.ff-standard-grid-page.ff-debtors-standard-page, .ff-receivers.ff-standard-grid-page) #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll-content) { border-radius: 8px !important; box-sizing: border-box !important; height: 100% !important; pointer-events: none !important; width: 100% !important; } /* Absolute-final Debtors scrollbar no-reserve hit area. The painted slider and the clickable DevExtreme thumb must occupy the same space so track clicks work immediately next to the visible scrollbar. */ html body.ff-app.ff-app.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-scrollable-container { scrollbar-gutter: auto !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { max-width: 11px !important; min-width: 11px !important; width: 11px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { height: 11px !important; max-height: 11px !important; min-height: 11px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) :is(.dx-scrollable-scroll, .dx-scroll) { float: none !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-standard-grid-page.ff-debtors-standard-page #gridContainer#gridContainer.ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll, .dx-scroll) { margin-top: 0 !important; } /* Absolute-final View Manifests filter and scrollbar recovery. The live page uses the standard-grid-css-owned path, so target those classes directly instead of the older manifest-owned grid hooks. */ html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser) { align-items: flex-end !important; display: flex !important; flex-wrap: nowrap !important; gap: 8px 12px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser)::before, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser)::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser) > [class*="col-"] { float: none !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser) > .col-md-2 { flex: 0 1 310px !important; max-width: 340px !important; min-width: 230px !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-options-under-webuser { align-items: center !important; align-self: flex-end !important; display: flex !important; flex: 1 1 520px !important; flex-wrap: nowrap !important; gap: 8px 14px !important; margin-bottom: 0 !important; max-width: none !important; min-height: var(--ff-control-h, 30px) !important; min-width: 470px !important; padding-top: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-options-under-webuser :is(.checkbox, .checkbox-inline, .valuesonly, .check-inline) { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-actions { align-self: flex-end !important; display: flex !important; flex: 0 0 470px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 470px !important; min-width: 450px !important; padding-top: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit { align-items: center !important; display: flex !important; flex: 1 1 auto !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; min-height: var(--ff-control-h, 30px) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit .ff-manifest-keep-filter { flex: 0 0 auto !important; margin-left: auto !important; order: 90 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit .ff-column-loading-toggle { flex: 0 0 var(--ff-control-h, 30px) !important; margin: 0 !important; order: 92 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit .ff-manifest-close-filter, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit .ff-manifest-close-filter:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 30px) !important; margin: 0 !important; order: 95 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-submit .ff-manifest-search { flex: 0 0 190px !important; margin: 0 !important; min-width: 190px !important; order: 100 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-grid-result-row > .ff-grid-result-col, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { max-width: 100% !important; overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar) { background: transparent !important; box-sizing: border-box !important; overflow: hidden !important; pointer-events: auto !important; z-index: 8 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar.dx-state-hover, .dx-scrollbar.dx-scrollbar-hoverable, .dx-scrollable-scrollbar.dx-state-hover, .dx-scrollable-scrollbar.dx-scrollbar-hoverable, .dx-scrollable-scrollbar.dx-scrollable-scrollbar-active) { background: transparent !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { left: auto !important; max-width: 15px !important; min-width: 15px !important; right: 0 !important; width: 15px !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { bottom: 0 !important; height: 15px !important; max-height: 15px !important; min-height: 15px !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) :is(.dx-scrollable-scroll, .dx-scroll) { box-sizing: border-box !important; float: right !important; margin-right: 2px !important; max-width: 11px !important; min-width: 11px !important; overflow: hidden !important; padding-left: 0 !important; padding-right: 0 !important; width: 11px !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll, .dx-scroll) { box-sizing: border-box !important; height: 11px !important; margin-top: 2px !important; max-height: 11px !important; min-height: 11px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical, .dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) :is(.dx-scrollable-scroll-content) { border-radius: 8px !important; box-sizing: border-box !important; height: 100% !important; pointer-events: none !important; width: 100% !important; } @media (max-width: 1360px) { html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card > .row:has(.ff-manifest-filter-options-under-webuser) { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-options-under-webuser, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page .ff-sr-card .ff-manifest-filter-actions { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; } } /* Absolute-final View Manifests page-fill and Receiver fixed-pane sync. Keep this last: both pages have older recovery blocks above that are still useful, but these two values must win after the corruption-recovery passes. */ html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(360px, calc(100dvh - 270px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 270px) !important; } } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed { box-sizing: border-box !important; display: block !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; opacity: 1 !important; overflow: hidden !important; visibility: visible !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody) { max-height: none !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-data-row, .dx-data-row > td, .dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col) { opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .ff-receivers-select-col, .dx-command-edit, .ff-receivers-command-col), html body.ff-app.ff-app.ff-app .ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .ff-receivers-select-col, .dx-command-edit, .ff-receivers-command-col) > td { overflow: visible !important; } /* Absolute-final View Waybills stray checkbox glyph cleanup. The controller marks plain/date cells after rendering; those cells must never display a leftover DevExtreme checkbox tick from virtual column reuse. */ html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon)::before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon):before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon)::after, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox-icon):after, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell::before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell::after, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-date-data-cell::before, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-view-waybills #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--waybills .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-date-data-cell::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* Absolute-final View Quotes scroll containment. Keep the page and grid shell fixed to the viewport; only the rows viewport should own vertical/horizontal scrolling. */ html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 350px)) !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 402px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 350px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 402px) !important; } } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; flex: 0 0 auto !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; overflow-y: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; overflow-y: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } /* Absolute-final View Tracking stray checkbox glyph cleanup. Virtual column repaint can leave a selected checkbox tick inside plain cells such as Reference #; those cells are marked by the Tracking controller. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell :is(.dx-checkbox-icon)::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell :is(.dx-checkbox-icon):before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell :is(.dx-checkbox-icon)::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell :is(.dx-checkbox-icon):after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .dx-select-checkbox, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .dx-select-checkbox .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select):not(.dx-command-edit) .dx-select-checkbox .dx-checkbox-icon::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-date-data-cell::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-date-data-cell::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* Absolute-final View Tracking header/footer scrollbar cleanup. Only the rows viewport should own vertical scrolling; header/filter/total panes may scroll horizontally with the body but must not show vertical bars. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-total-footer) { overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content, .dx-datagrid-content, .dx-datagrid-content-fixed) { overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-total-footer) :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } /* Absolute-final filter action order and targeted pager wait feedback. Keep Open comes first, the virtual-column toggle sits immediately left of the close X. Waybills uses separate page/page-size loading classes above; this targeted path is for grids that mark one pager item directly. */ html body.ff-app.ff-app.ff-app :is( .ff-filter-actions, .ff-finance-filter-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner, .ff-manifest-filter-submit ) :is(.ff-column-loading-toggle, .ff-waybill-column-loading-toggle) { margin-left: 0 !important; order: 94 !important; } @keyframes ff-waybill-pager-busy-pulse { 0% { box-shadow: inset 0 0 0 1px rgba(59, 117, 247, 0.35), 0 0 0 0 rgba(59, 117, 247, 0.22); } 70% { box-shadow: inset 0 0 0 1px rgba(59, 117, 247, 0.5), 0 0 0 6px rgba(59, 117, 247, 0); } 100% { box-shadow: inset 0 0 0 1px rgba(59, 117, 247, 0.35), 0 0 0 0 rgba(59, 117, 247, 0); } } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target { animation: ff-waybill-pager-busy-pulse 0.9s ease-out infinite !important; background-color: rgba(59, 117, 247, 0.16) !important; color: #1f4eb8 !important; cursor: progress !important; outline: 1px solid rgba(59, 117, 247, 0.42) !important; outline-offset: -1px !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target::after { animation: none !important; content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager .dx-selection.ff-standard-grid-pager-loading-target { background-color: #2f73f6 !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager .dx-selection { color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer2, #clientGridContainer, #waybillGridContainer).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager .dx-selection::after { animation: none !important; content: none !important; display: none !important; } /* Absolute-final View Images far-right scroll alignment. The rows viewport loses a few pixels to the native vertical scrollbar. Give header/footer the same trailing scroll range without changing column sizes. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-content { box-sizing: content-box !important; padding-right: var(--ff-image-standard-scrollbar-reserve, 0px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: content-box !important; padding-right: var(--ff-image-standard-scrollbar-reserve, 0px) !important; } /* Absolute-final Receiver Master first-paint and fixed-pane lock. Size the native-scroll grid before data binds, and keep the fixed selector and action cells painted for every visible row while the body scrolls. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 257px)) !important; --ff-standard-grid-total-footer-height: 0px !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 277px)) !important; } /* Absolute-final Receiver action-column width lock. The row action cell has two 22px icon buttons plus a small gap, so 54px is the compact width that lets both buttons render without stealing data space. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-receivers-command-column-width: 54px !important; --ff-v26-sticky-action-width: var(--ff-receivers-command-column-width) !important; } html body.ff-app.ff-app.ff-app[data-grid-font-size="large"] .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app[data-grid-font-size="large"] .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-receivers-command-column-width: 58px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-receivers-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { max-width: var(--ff-receivers-command-column-width) !important; min-width: var(--ff-receivers-command-column-width) !important; overflow: visible !important; width: var(--ff-receivers-command-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td, th):is(.ff-receivers-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.dx-template-wrapper, .ff-grid-row-action-buttons, .ff-receivers-row-action-buttons) { max-width: var(--ff-receivers-command-column-width) !important; width: var(--ff-receivers-command-column-width) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 257px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 277px) !important; } } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow-x: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: auto !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview { overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { box-sizing: border-box !important; display: block !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; z-index: 3 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-data-row, .dx-data-row > td, .dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col) { opacity: 1 !important; overflow: visible !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td.dx-command-select, td.ff-receivers-select-col, td.dx-command-edit, td.ff-receivers-command-col) { padding-bottom: 0 !important; padding-top: 0 !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td.dx-command-select, td.ff-receivers-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-receivers-command-col) :is(.ff-receivers-row-actions, .dx-dropdownbutton, .dx-button, .dx-dropdownbutton-action) { align-items: center !important; display: inline-flex !important; justify-content: center !important; margin: 0 auto !important; opacity: 1 !important; position: relative !important; top: 0 !important; transform: none !important; vertical-align: middle !important; visibility: visible !important; } /* Absolute-final Receiver Master custom-scroll restoration. Fixed selector/action columns must be moved by DevExtreme's custom scroll engine; using native browser scrolling lets the fixed pane drift out of sync. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 257px)) !important; --ff-standard-grid-total-footer-height: 0px !important; --ff-standard-grid-visible-width-floor: 100% !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 277px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 257px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 277px) !important; } } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; display: block !important; flex-direction: initial !important; height: auto !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview { display: block !important; flex: none !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper) { display: block !important; flex: none !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { box-sizing: border-box !important; flex: none !important; height: 100% !important; max-height: 100% !important; max-width: 100% !important; min-height: 0 !important; min-width: 0 !important; overflow: hidden !important; scrollbar-gutter: auto !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content { max-width: none !important; min-height: 0 !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { box-sizing: border-box !important; display: block !important; height: auto !important; max-height: none !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; z-index: 4 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table, tbody, tr, td), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .dx-command-edit, .ff-receivers-select-col, .ff-receivers-command-col) { opacity: 1 !important; overflow: visible !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollbar, .dx-scrollable-scrollbar) { display: block !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } /* Absolute-final Receiver fixed-pane DevExtreme restore. Keep the fixed selector/action table inside DevExtreme's rowsview overlay so its vertical transform stays tied to the normal scrollable rows. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-content { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { bottom: 0 !important; box-sizing: border-box !important; display: block !important; height: auto !important; left: 0 !important; max-height: none !important; min-height: 0 !important; opacity: 1 !important; overflow: hidden !important; pointer-events: none !important; position: absolute !important; right: 0 !important; top: 0 !important; visibility: visible !important; width: auto !important; z-index: 4 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table td { pointer-events: auto !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table .dx-row td.dx-pointer-events-none, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed .dx-datagrid-table .dx-row > td.dx-pointer-events-none { background-color: transparent !important; border-bottom-color: transparent !important; border-top-color: transparent !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed :is(.dx-command-select, .ff-receivers-select-col, .dx-command-edit, .ff-receivers-command-col) { opacity: 1 !important; visibility: visible !important; } /* Absolute-final Receiver single-table mode. Receivers deliberately avoids fixed columns because DevExtreme paints them in a delayed second table; hide any stale fixed overlay left by saved settings. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content-fixed { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) { min-height: 100% !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) td.ff-receivers-select-col { box-sizing: border-box !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.ff-receivers-select-box, .ff-receivers-select-box--header, .ff-receivers-select-box--row) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 100% !important; justify-content: center !important; margin: 0 !important; min-height: var(--ff-receivers-row-height-final, var(--ff-standard-grid-row-height, 18px)) !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.ff-receivers-select-all-input, .ff-receivers-row-select-input) { appearance: auto !important; -webkit-appearance: checkbox !important; accent-color: var(--accent, #3478f6) !important; cursor: pointer !important; display: block !important; height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; opacity: 1 !important; position: static !important; visibility: visible !important; width: 14px !important; } /* Absolute-final Receiver page-fit cleanup. Keep the grid, pager, and footer inside the viewport without pulling the footer over the pager. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-pager-height: 22px !important; --ff-standard-grid-rows-max-height: max(338px, calc(100dvh - 223px)) !important; --ff-standard-grid-total-footer-height: 0px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(338px, calc(100dvh - 243px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 223px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 243px) !important; } } html:has(body.ff-app .ff-receivers.ff-standard-grid-page), html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) { height: 100dvh !important; max-height: 100dvh !important; min-height: 0 !important; overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app, html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > .ff-shell, html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > .ff-shell.ng-scope, html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) .app-content, html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) .main-content { max-height: 100dvh !important; min-height: 0 !important; overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app { display: flex !important; flex-direction: column !important; height: 100dvh !important; min-height: 100dvh !important; } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > footer { bottom: 0 !important; left: 0 !important; margin-left: 0 !important; min-height: 32px !important; position: fixed !important; right: 0 !important; width: 100% !important; z-index: 10 !important; } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > footer .footer-inner.ff-footer { min-height: 32px !important; padding-bottom: 3px !important; padding-top: 3px !important; } @media (min-width: 992px) { html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app:not(.app-sidebar-hidden):not(.app-sidebar-closed) > footer { left: 260px !important; width: calc(100% - 260px) !important; } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app.app-sidebar-closed:not(.app-sidebar-hidden) > footer { left: 70px !important; width: calc(100% - 70px) !important; } } html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > .ff-shell, html body.ff-app.ff-app.ff-app:has(.ff-receivers.ff-standard-grid-page) #app > .ff-shell.ng-scope { flex: 1 1 auto !important; } html body.ff-app.ff-app.ff-app .main-content > .container:has(.ff-receivers.ff-standard-grid-page), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page { max-height: 100% !important; min-height: 0 !important; overflow: hidden !important; overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-receivers-results, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-receivers-results > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 22px !important; justify-content: flex-end !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding: 0 4px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid-pager, .dx-pager) :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: inline-flex !important; height: 22px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned :is(.dx-datagrid-focus-overlay, .dx-inkripple, .dx-inkripple-wave), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview td.dx-focused::before, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview td.dx-focused::after, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row :is(.dx-cell-modified, .dx-highlight-outline, .dx-datagrid-invalid)::before, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row :is(.dx-cell-modified, .dx-highlight-outline, .dx-datagrid-invalid)::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; outline: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td.dx-focused, .dx-cell-modified, .dx-highlight-outline, .dx-datagrid-invalid), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-row-focused.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-row-focused.dx-data-row > tr > td { border-bottom: 0 !important; border-top: 0 !important; box-shadow: none !important; outline: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-row-lines, .dx-column-lines, .dx-data-row, .dx-row-focused, .dx-state-hover) { border: 0 !important; box-shadow: none !important; outline: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > tr > td { background-clip: padding-box !important; border-bottom: 0 !important; border-top: 0 !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td::before, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td::after, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > tr > td::before, html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > tr > td::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; outline: 0 !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > td { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; padding: 0 !important; } /* Final Tariffs filter action order. Keep Open stays left of the action buttons; the virtual-column toggle is a compact square button immediately before the close X. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; gap: 8px !important; justify-content: flex-end !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin-left: auto !important; margin-right: 0 !important; order: 90 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 34px) !important; height: var(--ff-control-h, 34px) !important; justify-content: center !important; margin: 0 !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; order: 94 !important; padding: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle > .fa { flex: 0 0 auto !important; font-size: 14px !important; height: 14px !important; line-height: 14px !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 34px) !important; margin: 0 !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; order: 95 !important; width: var(--ff-control-h, 34px) !important; } /* Absolute-last virtual-column filter action order. Keep the on-demand-columns toggle immediately to the left of the close X, with SEARCH remaining the last button in the cluster. */ html body.ff-app.ff-app.ff-app :is( .ff-filter-actions, .ff-finance-filter-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner, .ff-manifest-filter-submit ) :is(.ff-filter-keep-open, .ff-finance-keep-filter, .ff-image-keep-filter, .ff-query-generic-keep-filter, .ff-tariff-keep-filter, .ff-manifest-keep-filter) { order: 90 !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-actions, .ff-finance-filter-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner, .ff-manifest-filter-submit ) :is(.ff-column-loading-toggle, .ff-waybill-column-loading-toggle) { order: 94 !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-actions, .ff-finance-filter-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner, .ff-manifest-filter-submit ) :is(.ff-filter-close, .ff-finance-close-filter, .ff-image-close-filter, .ff-query-generic-close-filter, .ff-tariff-close-filter, .ff-manifest-close-filter) { order: 95 !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-actions, .ff-finance-filter-actions, .ff-image-filter-actions, .ff-query-generic-actions, .ff-filter-footer-actions-inner, .ff-manifest-filter-submit ) :is(.ff-filter-search, .ff-finance-search, .ff-image-search, .ff-query-generic-search, .ff-tariff-search, .ff-manifest-search) { order: 100 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 240px !important; margin: 0 !important; max-width: 240px !important; min-width: 180px !important; order: 100 !important; } /* Absolute-last Towns/Hubs row-density guard. This page still inherits older view-compact/grid-density rules, and the final DevExtreme editable pass can rebuild rows with taller editor widgets. Keep this at EOF with plain selectors so the actual Town/Hubs data rows always finish on the Debtors-style compact row contract. */ html body.ff-app.ff-app.ff-app .ff-towns #gridContainer, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer.dx-datagrid, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1.dx-datagrid, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; --ff-townhub-check-size: 14px !important; --ff-townhub-content-height: 16px !important; --ff-townhub-row-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-row:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row):not(.dx-freespace-row):not(.dx-virtual-row) > td { block-size: 18px !important; box-sizing: border-box !important; font-size: 12px !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td > *, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td > *, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-row.dx-data-row > td > *, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-row.dx-data-row > td > *, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td .dx-template-wrapper, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td .dx-template-wrapper, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td .dx-datagrid-text-content, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td .dx-datagrid-text-content, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td .ff-grid-cell-value, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td .ff-grid-cell-value, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td span, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td span, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row > td a, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row > td a { box-sizing: border-box !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-editor-cell, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-editor-cell, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-editor-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-editor-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-input-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-input-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-input, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-texteditor-input { block-size: 16px !important; box-sizing: border-box !important; height: 16px !important; line-height: 16px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 16px !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-select-checkbox, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-select-checkbox, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-wrapper, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-wrapper, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-container, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row input[type="checkbox"], html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row input[type="checkbox"] { align-items: center !important; block-size: 14px !important; box-sizing: border-box !important; display: inline-flex !important; height: 14px !important; justify-content: center !important; line-height: 14px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; vertical-align: middle !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-towns #gridContainer .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns #gridContainer1 .dx-datagrid-rowsview tr.dx-data-row .dx-checkbox-icon::before { font-size: 12px !important; line-height: 14px !important; margin: 0 !important; } /* Absolute-last Generate Invoice wait guard. Searches use the large page wait; hide the legacy 30px block-ui/load1 ring so fetching results does not show two spinners at once. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice > [block-ui].csspinner::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice > [block-ui].loading::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice > [block-ui].load1::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice [block-ui].csspinner::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice [block-ui].loading::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice [block-ui].load1::after { animation: none !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Absolute-last Generate Invoice drill action guard. Keep the client eye command interactive after late command-cell density rules. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer .dx-datagrid-rowsview :is(td.ff-invoice-generate-command-col, td.dx-command-edit), html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer .dx-datagrid-rowsview :is(td.ff-invoice-generate-command-col, td.dx-command-edit) :is(.ff-invoice-generate-drill-btn, .dx-link, .dx-button, .dx-button-content, button, a, .dx-icon, .fa-eye, .fa) { pointer-events: auto !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice :is(#clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid-short-result { --ff-standard-grid-short-result-min-rows-height: 0px; --ff-standard-grid-short-result-padding: 8px; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid-short-result :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #clientGridContainer#clientGridContainer .dx-datagrid-rowsview td.ff-invoice-generate-drill-cell { cursor: pointer !important; touch-action: manipulation !important; user-select: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid-short-result { --ff-standard-grid-short-result-padding: 16px; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid-short-result .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer.ff-standard-grid.ff-standard-grid-short-result :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon), html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell :is(.dx-checkbox-icon)::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell :is(.dx-checkbox-icon):before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell :is(.dx-checkbox-icon)::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell :is(.dx-checkbox-icon):after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-plain-data-cell::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-date-data-cell::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice #waybillGridContainer#waybillGridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-invoice-generate-date-data-cell::after { background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* Absolute-last toolbar lock button correction. The injected toolbar lock is an icon-only utility button, not a full page action. When locked, keep the action header available while the page scrolls. */ html body.ff-app.ff-app.ff-app.ff-toolbar-locked #page-title.ff-page-header, html body.ff-app.ff-app.ff-app.ff-toolbar-locked #page-title.ff-page-header.ff-page-header { box-sizing: border-box !important; left: var(--ff-toolbar-lock-left, 0px) !important; margin: 0 !important; max-width: none !important; position: fixed !important; right: auto !important; top: var(--ff-toolbar-lock-top, 44px) !important; width: var(--ff-toolbar-lock-width, 100vw) !important; z-index: 2600 !important; } html body.ff-app.ff-app.ff-app .ff-toolbar-lock-spacer { display: block !important; height: var(--ff-toolbar-lock-height, 0px) !important; min-height: var(--ff-toolbar-lock-height, 0px) !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app:not(.ff-toolbar-locked) .ff-toolbar-lock-spacer { display: none !important; height: 0 !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar > .ff-toolbar-lock-toggle[data-ff-toolbar-lock-toggle="true"], html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, [data-ui-density="compact"]) #page-title.ff-page-header .ff-toolbar > .ff-toolbar-lock-toggle[data-ff-toolbar-lock-toggle="true"] { align-items: center !important; align-self: center !important; background: color-mix(in srgb, transparent 92%, var(--primary)) !important; border: 1px solid color-mix(in srgb, var(--border) 62%, var(--primary)) !important; border-radius: 4px !important; box-shadow: none !important; box-sizing: border-box !important; color: var(--primary) !important; cursor: pointer !important; display: inline-flex !important; flex: 0 0 20px !important; flex-direction: row !important; height: 20px !important; justify-content: center !important; line-height: 1 !important; margin: 0 6px 0 0 !important; max-height: 20px !important; max-width: 20px !important; min-height: 20px !important; min-width: 20px !important; opacity: 1 !important; overflow: hidden !important; padding: 0 !important; text-align: center !important; width: 20px !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar > .ff-toolbar-lock-toggle[data-ff-toolbar-lock-toggle="true"].ff-toolbar-lock-toggle--locked { background: var(--primary) !important; border-color: var(--primary) !important; color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app #page-title.ff-page-header .ff-toolbar > .ff-toolbar-lock-toggle[data-ff-toolbar-lock-toggle="true"] :is(i, .fa) { font-size: 11px !important; line-height: 1 !important; margin: 0 !important; pointer-events: none !important; } /* Absolute-last standard view-grid stability pass. View pages should keep the title in normal flow, keep grid chrome visible while data loads, and own scrolling inside the grid rather than the page. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header, html body.ff-app.ff-app.ff-app.ff-toolbar-locked .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header, html body.ff-app.ff-app.ff-app.ff-toolbar-locked .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header.ff-page-header { box-sizing: border-box !important; flex: 0 0 auto !important; left: auto !important; margin-bottom: 0 !important; margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; position: relative !important; right: auto !important; top: auto !important; transform: none !important; width: 100% !important; z-index: auto !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header .ff-page-header-row { align-items: center !important; display: flex !important; gap: 8px 12px !important; justify-content: space-between !important; min-height: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header .ff-toolbar { flex: 1 1 auto !important; justify-content: flex-end !important; margin-left: auto !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) > .ff-toolbar-lock-spacer, html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header + .ff-toolbar-lock-spacer { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header + .container-fullw, html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header + .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header + .ff-toolbar-lock-spacer + .container-fullw, html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-view-waybills):not(.ff-debriefing) #page-title.ff-page-header + .ff-toolbar-lock-spacer + .container-fluid.container-fullw { margin-top: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app :is( .ff-view-quotes, .ff-view-invoices, .ff-view-payments, .ff-imaging-list, .ff-view-tracking, .ff-view-manifests, .ff-view-manifests-simple ).ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid { --ff-standard-grid-effective-rows-height: max(120px, calc(var(--ff-standard-grid-rows-max-height, 320px) - 9px)) !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-debriefing) .ff-standard-grid.ff-grid-loading :is(.dx-loadpanel, .dx-loadpanel-wrapper, .dx-loadpanel-content, .dx-loadpanel-content-wrapper, .dx-loadpanel-indicator, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-datagrid-bottom-load-panel, .dx-datagrid-bottom-load-panel *) { animation: none !important; display: none !important; height: 0 !important; max-height: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page:not(.ff-debriefing) .ff-standard-grid.ff-grid-loading .dx-datagrid-rowsview { opacity: 1 !important; pointer-events: auto !important; } /* Absolute-last Debriefing isolation. Debriefing recreates an editable capture grid after search; keep it out of view-grid loading/title rescue rules and keep its rows viewport explicit. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 354px), 900px) !important; --ff-standard-grid-select-width: 24px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(360px, calc(100dvh - 374px), 900px) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; height: auto !important; max-height: none !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; opacity: 1 !important; overflow: hidden !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: scroll !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable-content) { height: auto !important; max-height: none !important; min-height: 100% !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select) { box-sizing: border-box !important; max-width: var(--ff-standard-grid-select-width) !important; min-width: var(--ff-standard-grid-select-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-standard-grid-select-width) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox.dx-widget, .dx-select-checkbox) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; margin: 0 auto !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select) :is(.dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { align-items: center !important; border-radius: 2px !important; box-sizing: border-box !important; display: inline-flex !important; height: 14px !important; justify-content: center !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; width: 14px !important; } /* Absolute-last Waybills orphan-check guard. DevExtreme can leave a checkbox/check glyph in a recycled plain cell after scroll or repaint. Plain Waybill cells must not render those fragments. */ html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon, .dx-checkbox-checked, .dx-checkbox-indeterminate, .dx-icon-check, .fa-check), html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon, .dx-checkbox-checked, .dx-checkbox-indeterminate, .dx-icon-check, .fa-check)::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon, .dx-checkbox-checked, .dx-checkbox-indeterminate, .dx-icon-check, .fa-check)::after { background: transparent !important; border: 0 !important; box-shadow: none !important; color: transparent !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; text-shadow: none !important; visibility: hidden !important; width: 0 !important; } /* Waybills plain cells must also reject DevExtreme loading fragments. These can look like a random blue tick/arc when a loading indicator is recycled into a normal text cell while the grid repaints. */ html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-loadpanel-indicator), html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell:is(.dx-icon-check, .fa-check, .dx-checkbox-icon, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, .dx-loadpanel-indicator)::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell:is(.dx-icon-check, .fa-check, .dx-checkbox-icon, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, .dx-loadpanel-indicator)::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-loadpanel-indicator)::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell :is(.dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, .dx-loadindicator-content, .dx-loadindicator-segment, [class*="dx-loadindicator-segment"], .dx-loadpanel-indicator)::after { animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: transparent !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; text-shadow: none !important; transform: none !important; visibility: hidden !important; width: 0 !important; } /* Same guard without modern selector helpers. Some stray glyphs are applied as classes/pseudo elements on the plain td itself after column recycling. */ html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-select-checkbox, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-wrapper, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-container, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-checked, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-indeterminate, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon-check, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.fa-check { background-image: none !important; color: var(--text, #333) !important; } html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-select-checkbox::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-wrapper::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-container::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-checked::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-indeterminate::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon-check::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.fa-check::before, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-select-checkbox::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-wrapper::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-container::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-icon::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-checked::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-checkbox-indeterminate::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.dx-icon-check::after, html body.ff-app.ff-app.ff-app .ff-view-waybills #gridContainer .dx-datagrid-rowsview .dx-data-row > td.ff-waybill-plain-data-cell.fa-check::after { content: none !important; display: none !important; } /* Absolute-last editable grid list placeholder removal. Compact editable rows do not have enough vertical room for DevExtreme's "Select" placeholder, so hide it in data-row dropdown/list editors only. */ html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row td.dx-editor-cell :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder, html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row td.dx-editor-cell :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder::before, html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row td.dx-editor-cell :is(.dx-selectbox, .dx-dropdowneditor) .dx-placeholder::after { color: transparent !important; content: none !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; text-shadow: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row td.dx-editor-cell :is(.dx-selectbox, .dx-dropdowneditor) input::placeholder { color: transparent !important; opacity: 0 !important; } /* Full capture compact-mode completion. These controls are plain Bootstrap/uib elements, not DevExtreme grid controls, so keep them in the UI-density path and away from grid sizing. */ html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture { --ff-full-capture-compact-control-h: var(--ff-ui-density-control-h, 26px); --ff-full-capture-compact-font-size: var(--ff-ui-density-font-size, 10.2px); --ff-full-capture-compact-label-size: var(--ff-ui-density-label-size, 10.2px); --ff-full-capture-compact-label-line-height: var(--ff-ui-density-label-line-height, 15px); --ff-full-capture-compact-action-offset: calc(var(--ff-full-capture-compact-label-line-height) + 5px); } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture :is(.ff-full-courier-action, .ff-linked-menu-action) { box-sizing: border-box !important; flex: 0 0 var(--ff-full-capture-compact-control-h) !important; max-width: var(--ff-full-capture-compact-control-h) !important; min-width: var(--ff-full-capture-compact-control-h) !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: var(--ff-full-capture-compact-action-offset) !important; width: var(--ff-full-capture-compact-control-h) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-additional-details .ff-linked-menu-action { padding-top: calc(var(--ff-full-capture-compact-label-line-height) + 3px) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture :is(.ff-full-courier-action, .ff-linked-menu-action) :is(.btn-group, .dropdown-toggle) { box-sizing: border-box !important; height: var(--ff-full-capture-compact-control-h) !important; line-height: var(--ff-full-capture-compact-control-h) !important; max-height: var(--ff-full-capture-compact-control-h) !important; max-width: var(--ff-full-capture-compact-control-h) !important; min-height: var(--ff-full-capture-compact-control-h) !important; min-width: var(--ff-full-capture-compact-control-h) !important; padding: 0 !important; width: var(--ff-full-capture-compact-control-h) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture :is(.ff-full-courier-action, .ff-linked-menu-action) .btn-group { display: block !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture :is(.ff-full-courier-action, .ff-linked-menu-action) .dropdown-toggle { align-items: center !important; display: inline-flex !important; justify-content: center !important; vertical-align: top !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture :is(.ff-full-courier-action, .ff-linked-menu-action) .caret { border-left-width: 3px !important; border-right-width: 3px !important; border-top-width: 3px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-legend--main :is(.ff-rating-charges-col, .ff-rating-vars-section, .ff-rating-fcalc-section, .ff-rating-mass-section) { font-size: var(--ff-full-capture-compact-font-size) !important; line-height: 1.12 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-legend--main :is(.ff-rating-charges-col, .ff-rating-vars-section, .ff-rating-fcalc-section, .ff-rating-mass-section) :is(legend, table, tbody, tr, td, span, div, label, input, .form-control, .text-bold, .ff-subsection__title, .freight-calc) { font-size: inherit !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-legend--main :is(.ff-rating-charges-col, .ff-rating-vars-section, .ff-rating-fcalc-section, .ff-rating-mass-section) :is(table, tbody, tr, td, span, div, label, .freight-calc) { line-height: 1.12 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-legend--main :is(.ff-rating-charges-col, .ff-rating-vars-section, .ff-rating-fcalc-section, .ff-rating-mass-section) :is(i, .fa, .ff-icon-tooltip) { font-size: var(--ff-full-capture-compact-font-size) !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture fieldset.ff-legend--main .freight-calc { max-width: 100% !important; overflow-wrap: anywhere !important; white-space: pre-wrap !important; } /* Compact quote/collection conversion buttons. Keep their existing top offsets; only reduce the oversized button box. */ html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action > .btn, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action > .btn, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action > .btn, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action > .btn, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action > .btn, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-waybill.ff-full-capture.ff-full-capture--collection fieldset.ff-additional-details .ff-col-additional-actions .btn, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-waybill.ff-full-capture.ff-full-capture--collection fieldset.ff-additional-details .ff-col-additional-actions .btn, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-waybill.ff-full-capture.ff-full-capture--collection fieldset.ff-additional-details .ff-col-additional-actions .btn, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-waybill.ff-full-capture.ff-full-capture--collection fieldset.ff-additional-details .ff-col-additional-actions .btn, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture.ff-full-capture--collection fieldset.ff-additional-details .ff-col-additional-actions .btn { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 32px !important; justify-content: center !important; line-height: 32px !important; max-height: 32px !important; min-height: 32px !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: top !important; } /* Capture key value emphasis. Keep this after compact-mode rules so record numbers remain visibly larger than neighboring field values without becoming header-sized. */ html body.ff-app.ff-app.ff-app .ff-page { --ff-key-field-font-size: 15.6px; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-page { --ff-key-field-font-size: 14.3px; } html body.ff-app.ff-app.ff-app .ff-page :is(input, textarea, .form-control, .ff-input).ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-page .ff-key-field-value { font-size: var(--ff-key-field-font-size) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.1 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-page input.form-control.ff-key-field-value.ff-key-field-value:not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *), html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-page input.ff-input.ff-key-field-value.ff-key-field-value:not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *), html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-page textarea.form-control.ff-key-field-value.ff-key-field-value:not(.dx-datagrid *):not(.dx-datagrid):not(.ff-standard-grid *) { font-size: var(--ff-key-field-font-size) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.1 !important; } /* Syntax-safe final fallback for compact capture key fields. This avoids :is()/complex :not() so older selector parsing cannot drop the key emphasis, and it outranks the compact form-control rules. */ html body.ff-app.ff-app.ff-app .ff-page.ff-page input.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-page.ff-page textarea.form-control.ff-input.ff-key-field-value.ff-key-field-value { font-size: var(--ff-key-field-font-size, 15.6px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.1 !important; } html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page input.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page input.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page input.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page input.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page textarea.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page textarea.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page textarea.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page textarea.form-control.ff-input.ff-key-field-value.ff-key-field-value { font-size: var(--ff-key-field-font-size, 14px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value { font-size: var(--ff-key-field-font-size, 14px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Payment capture account row alignment. */ @media (min-width: 761px) { html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset > .ff-payment-main-row { column-gap: 12px !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-id-group { flex: 0 0 470px !important; max-width: 470px !important; min-width: 470px !important; width: 470px !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-id-row { column-gap: 10px !important; display: grid !important; grid-template-columns: 135px 170px 145px !important; margin-left: 0 !important; margin-right: 0 !important; row-gap: 0 !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-id-row > .ff-payment-id-field { box-sizing: border-box !important; flex: none !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-date-field .input-icon, html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-id-row .form-control { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-client-field { flex: 1 1 320px !important; margin-left: 0 !important; min-width: 260px !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset .ff-payment-amount-field { flex: 0 0 134px !important; max-width: 134px !important; min-width: 134px !important; width: 134px !important; } } @media (min-width: 1280px) { html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset > .ff-payment-main-row { display: flex !important; flex-wrap: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset > .ff-payment-main-row > .ff-payment-client-field { flex: 1 1 auto !important; max-width: none !important; min-width: 260px !important; width: auto !important; } } html body.ff-app.ff-app.ff-app .ff-payment-capture .ff-payment-details-fieldset input.form-control.ff-key-field-value { font-size: var(--ff-key-field-font-size, 15.6px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1.1 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-payment-capture .ff-payment-details-fieldset input.form-control.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-payment-capture .ff-payment-details-fieldset input.form-control.ff-key-field-value { font-size: var(--ff-key-field-font-size, 14px) !important; font-weight: 600 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-page input[placeholder*="Enquiry Only"]::placeholder, html body.ff-app.ff-app.ff-app .ff-page textarea[placeholder*="Enquiry Only"]::placeholder, html body.ff-app.ff-app.ff-app .ff-page ui-select-match[placeholder*="Enquiry Only"] .ui-select-placeholder, html body.ff-app.ff-app.ff-app .ff-page .ui-select-match[placeholder*="Enquiry Only"] .ui-select-placeholder { color: var(--text-muted, #8e98a8) !important; font-weight: 400 !important; opacity: .46 !important; } /* Final full-capture action density locks. These exact controls sit in old full-capture layout rules that use --ff-control-h and no longer share the removed grid-density compact hook. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action .btn.btn-primary, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--collection .ff-additional-details .ff-col-convert-btn.btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--collection .ff-additional-details .ff-col-reschedule-btn.btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--collection .ff-additional-details .ff-col-debrief-btn.btn { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 30px !important; justify-content: center !important; line-height: 30px !important; margin-bottom: 0 !important; max-height: 30px !important; min-height: 30px !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: top !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-quote-convert-action, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--collection .ff-additional-details .ff-col-additional-actions, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--collection .ff-additional-details .ff-col-debrief-action { --ff-full-capture-action-height: 30px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture { --ff-full-capture-key-field-font-size: 15.6px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs > .row > .ff-full-waybill-no-field { flex: 1 1 204px !important; max-width: 288px !important; } /* Full Capture waybill mode: shrink Clone and return useful width to Waybill #. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-full-basic-docs > .row > .ff-full-waybill-no-field { flex: 0 1 260px !important; max-width: 350px !important; min-width: 238px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-full-basic-docs > .row > .ff-full-clone-action { align-self: flex-start !important; flex: 0 0 78px !important; margin-top: -4px !important; max-width: 78px !important; min-width: 72px !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: 0 !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-full-basic-docs > .row > .ff-full-clone-action .btn { box-sizing: border-box !important; min-width: 0 !important; padding-left: 6px !important; padding-right: 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture { --ff-full-capture-key-field-font-size: 14.3px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture input.form-control.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture input.ff-input.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture textarea.form-control.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture textarea.ff-input.ff-key-field-value { font-size: var(--ff-full-capture-key-field-font-size, var(--ff-key-field-font-size, 16px)) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Final capture key-field emphasis for older capture layouts. Full capture uses inline sizing, but payment, credit/debit, quick capture, and stages often do not have .ff-input, so keep this syntax-safe lock last. */ html body.ff-app.ff-app.ff-app .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value { font-size: var(--ff-key-field-font-size, 16px) !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-page.ff-page input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-page.ff-page textarea.form-control.ff-key-field-value.ff-key-field-value { font-size: 14.3px !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Full Capture document number: keep waybill/collection/quote numbers visibly larger while matching the Waybill Stages key-field weight. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value { font-size: 17px !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#waybillNo.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#collectionId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-full-basic-docs input#quoteId.form-control.ff-input.ff-key-field-value.ff-key-field-value { font-size: 16px !important; font-weight: 600 !important; } /* Full Capture quote mode: keep Quote # top-aligned with Quote Date. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-basic-row .ff-full-quote-id-field { align-self: flex-start !important; margin-top: -6px !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-basic-row .ff-full-quote-id-field .form-group { margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--quote .ff-full-basic-row .ff-full-quote-links { margin-top: -4px !important; } html body.ff-app.ff-app.ff-app .ff-finance .ff-finance-key-number { --ff-finance-key-number-font-size: var(--ff-key-field-font-size, 15.6px); } /* Compact finance capture key numbers. Normal mode keeps the shared key-field size; these exact transaction-number fields use an inline variable-based font lock so late compact form rules cannot snap them back to ordinary input size. */ html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-finance .ff-finance-key-number, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-finance .ff-finance-key-number, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-finance .ff-finance-key-number, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-finance .ff-finance-key-number, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-finance .ff-finance-key-number, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-finance.ff-capture-page .ff-crdr-trans-no input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-finance.ff-capture-page .ff-crdr-trans-no input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-finance.ff-capture-page .ff-crdr-trans-no input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-finance.ff-capture-page .ff-crdr-trans-no input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-finance.ff-capture-page .ff-crdr-trans-no input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-density="compact"] .ff-payment-capture .ff-payment-trans-id-field input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-grid-density-compact .ff-payment-capture .ff-payment-trans-id-field input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-ui-density="compact"] .ff-payment-capture .ff-payment-trans-id-field input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app.ff-ui-density-compact .ff-payment-capture .ff-payment-trans-id-field input.form-control.ff-key-field-value.ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-payment-capture .ff-payment-trans-id-field input.form-control.ff-key-field-value.ff-key-field-value { --ff-finance-key-number-font-size: 16px; font-size: 16px !important; font-weight: 600 !important; letter-spacing: 0 !important; line-height: 1 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Rating Variables: keep dividers on calculation rows, but not on document/Tariff ID rows. */ html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-row, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-divider, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-tariff-row, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-row > td, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-divider > td, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-tariff-row > td, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-row > td:last-child, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-document-divider > td:last-child, html body.ff-app.ff-app.ff-app .ff-rating-vars-section table.table-condensed > tbody > tr.ff-rating-tariff-row > td:last-child { border-bottom: 0 !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-rating-vars-section .ff-rating-tariff-row .ff-icon-tooltip { margin-left: 0 !important; margin-right: 6px !important; } /* Freight Calculation: the legend is visually lifted, so reclaim its layout gap. */ html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section { --ff-rating-fcalc-content-lift: 16px; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section legend.ff-fcalc-legend { align-items: center !important; display: flex !important; gap: 8px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section .ff-fcalc-agent-btn { background: transparent !important; border: 1px solid var(--ff-field-border, #8a95a8) !important; border-radius: 4px !important; color: inherit !important; font-size: 11px !important; font-weight: 700 !important; line-height: 1.25 !important; padding: 1px 7px !important; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section .ff-fcalc-agent-btn:hover, html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section .ff-fcalc-agent-btn:focus { background: color-mix(in srgb, var(--ff-theme-accent, #337ab7) 12%, transparent) !important; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section > fieldset > table.table-condensed { margin-top: calc(var(--ff-rating-fcalc-content-lift, 16px) * -1) !important; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section > fieldset > table.table-condensed > tbody > tr:first-child > td.freight-calc { padding-top: 0 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section { --ff-rating-fcalc-content-lift: 12px; } /* Full Capture rating panel: reclaim left padding from Charges/Variables and give Freight Calculation more room. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-charges-col { flex: 0 0 418px !important; max-width: 418px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-charges-section { flex: 0 0 218px !important; max-width: 218px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-vars-section { box-sizing: border-box !important; flex: 0 0 192px !important; min-width: 192px !important; max-width: 192px !important; padding-left: 0 !important; padding-right: 0 !important; width: 192px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-fcalc-section { flex: 1 1 390px !important; max-width: 520px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section > fieldset { padding-left: 6px !important; padding-right: 10px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { margin-left: auto !important; margin-right: 0 !important; table-layout: fixed !important; width: 200px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child { box-sizing: border-box !important; min-width: 86px !important; padding-left: 2px !important; padding-right: 2px !important; width: 86px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child { box-sizing: border-box !important; min-width: 108px !important; padding-left: 2px !important; padding-right: 0 !important; width: 108px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed { margin-left: 0 !important; table-layout: fixed !important; width: 174px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:first-child { box-sizing: border-box !important; min-width: 106px !important; padding-left: 1px !important; padding-right: 3px !important; white-space: nowrap !important; width: 106px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:last-child { box-sizing: border-box !important; min-width: 66px !important; padding-left: 3px !important; padding-right: 2px !important; width: 66px !important; } html body.ff-app.ff-app.ff-app .ff-waybill fieldset.ff-legend--main .ff-rating-fcalc-section .freight-calc { max-width: 100% !important; overflow-wrap: anywhere !important; white-space: pre-line !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed { margin-top: -4px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed > tbody > tr > td:last-child { padding-left: 2px !important; padding-right: 2px !important; } /* Final Tariff cell-editor fit. DevExtreme cell editing does not reliably add dx-edit-row, so target the active editor cell itself. Keep normal tariff rows compact, but give the cell being edited enough height for the input, clear icon, and dropdown. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row:has(> td.dx-editor-cell), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview tr.dx-data-row:has(> td.dx-editor-cell) > td { box-sizing: border-box !important; height: 34px !important; line-height: 28px !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding-bottom: 3px !important; padding-top: 3px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell { box-sizing: border-box !important; height: 34px !important; line-height: 28px !important; max-height: none !important; min-height: 34px !important; overflow: visible !important; padding: 3px 5px !important; position: relative !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell > *, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell :is(.dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor-input-wrapper) { box-sizing: border-box !important; display: flex !important; height: 28px !important; line-height: 26px !important; margin: 0 !important; max-height: none !important; min-height: 28px !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-container, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-dropdowneditor-input-wrapper { align-items: center !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-input-container { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 1 1 auto !important; height: 28px !important; line-height: 26px !important; max-height: none !important; min-height: 28px !important; min-width: 0 !important; overflow: hidden !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-input { box-sizing: border-box !important; height: 28px !important; line-height: 26px !important; max-height: none !important; min-height: 28px !important; overflow: hidden !important; padding: 0 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-texteditor-buttons-container { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 auto !important; height: 28px !important; justify-content: flex-end !important; line-height: 28px !important; margin: 0 !important; max-height: none !important; min-height: 28px !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell :is(.dx-clear-button-area, .dx-dropdowneditor-button) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 24px !important; height: 28px !important; justify-content: center !important; line-height: 28px !important; margin: 0 !important; max-height: none !important; min-height: 28px !important; min-width: 24px !important; overflow: visible !important; padding: 0 !important; position: relative !important; transform: none !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-clear-button-area .dx-icon-clear, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-show-clear-button .dx-icon-clear, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-rowsview td.dx-editor-cell .dx-dropdowneditor-icon { align-items: center !important; background-position: center !important; background-size: 12px 12px !important; box-sizing: border-box !important; display: inline-flex !important; font-size: 16px !important; height: 18px !important; justify-content: center !important; left: auto !important; line-height: 18px !important; margin: 0 !important; max-height: 18px !important; max-width: 18px !important; min-height: 18px !important; min-width: 18px !important; overflow: visible !important; padding: 0 !important; position: static !important; right: auto !important; top: auto !important; transform: none !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-imported-numbers-section { margin-bottom: 10px !important; padding: 10px 12px 12px !important; position: relative; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-imported-numbers-section.is-locked { box-shadow: 0 4px 14px rgba(15, 23, 42, .14); position: sticky; top: 4px; z-index: 1250; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-imported-numbers-section > legend { align-items: center; display: inline-flex; gap: 6px; padding-right: 6px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-numbers-lock { align-items: center; background: #fff; border: 1px solid rgba(47, 115, 183, .55); border-radius: 50%; color: #2572aa; display: inline-flex; height: 20px; justify-content: center; line-height: 1; padding: 0; width: 20px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-numbers-lock:hover, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-numbers-lock:focus { border-color: #1e5f93; color: #1e5f93; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-imported-numbers-section.is-locked .ff-imported-numbers-lock { background: #2572aa; color: #fff; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-numbers-list { align-items: flex-start; display: flex; flex-wrap: wrap; gap: 4px 6px; max-height: 150px; overflow-y: auto; padding: 2px 0; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-number-chip { background: #2572aa; border: 1px solid #1e5f93; border-radius: 999px; color: #fff !important; cursor: pointer; display: inline-flex; font-size: 12px; font-weight: 600; line-height: 1.15; min-height: 20px; padding: 3px 10px; white-space: nowrap; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-number-chip:hover, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-number-chip:focus { background: #1e5f93; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-imported-number-chip.is-active { background: #f0ad4e; border-color: #d98d1f; color: #1f2933 !important; } /* Capture stages header render guard. Keep the title/action row stable while the stage view reloads and page type settles, otherwise the toolbar briefly measures against a partial title. */ html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-page-header-row { box-sizing: border-box !important; display: flex !important; flex-wrap: nowrap !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-page-title-wrap { box-sizing: border-box !important; flex: 1 1 auto !important; min-width: 260px !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-page-title { min-width: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-stage-capture-type { display: inline-block !important; } html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-toolbar { flex: 0 0 auto !important; flex-wrap: nowrap !important; justify-content: flex-end !important; margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-capture-page.ff-wizard #page-title.ff-page-header .ff-toolbar > :is(.btn-group, .dropdown, .uib-dropdown, .ff-action, button) { flex: 0 0 auto !important; } /* Full capture options menu selected mode. The dropdown can render against a child scope while opening, so mirror the current mode with an explicit class instead of relying only on :checked. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture #page-title .dropdown-menu .clip-radio.is-selected label:before { background: var(--primary); border-color: var(--primary); border-width: 6px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture #page-title .dropdown-menu .clip-radio.is-selected label:after { border-color: var(--primary); } html body.ff-app.ff-app.ff-app .ff-waybill .ff-stages-capture .ff-stages-shipment-radio.clip-radio { --ff-stages-shipment-radio-color: var(--ff-portal-theme-grid-head-bg, var(--primary, var(--primary-seed, #1677ff))); } html body.ff-app.ff-app.ff-app .ff-waybill .ff-stages-capture .ff-stages-shipment-radio.clip-radio input[type="radio"]:checked + label:before { background: var(--ff-stages-shipment-radio-color) !important; border-color: var(--surface, #fff) !important; border-width: 5px !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--ff-stages-shipment-radio-color) 24%, transparent) !important; } html body.ff-app.ff-app.ff-app .ff-waybill .ff-stages-capture .ff-stages-shipment-radio.clip-radio input[type="radio"]:checked + label:after { border-color: var(--ff-stages-shipment-radio-color) !important; } html body.ff-app.ff-app.ff-app #wizard.ff-wizard.ff-stages-capture.swMain > ul.ff-stages-rail-synced::before { left: var(--ff-stages-rail-left, 34px) !important; right: auto !important; width: var(--ff-stages-rail-width, calc(100% - 68px)) !important; } html body.ff-app.ff-app.ff-app #wizard.ff-wizard.ff-stages-capture.swMain > ul.ff-stages-rail-synced::after { left: var(--ff-stages-progress-left, var(--ff-stages-rail-left, 34px)) !important; right: auto !important; transform: none !important; transform-origin: left center !important; width: var(--ff-stages-progress-width, 0px) !important; } html body.ff-app.ff-app.ff-app #wizard.ff-wizard.ff-stages-capture.ff-edit.swMain > ul.ff-stages-rail-synced::after { left: var(--ff-stages-rail-left, 34px) !important; width: var(--ff-stages-rail-width, calc(100% - 68px)) !important; } /* Waybill stages service-rate step: keep the rate grid readable and the action buttons aligned to the service/charges section. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-table > thead > tr > th { background: var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) !important; border-color: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) 72%, #000) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 700 !important; text-align: center !important; text-shadow: none !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > th, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > th * { background: var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) !important; border-color: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) 72%, #000) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; opacity: 1 !important; text-align: center !important; text-shadow: none !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-waybill #wizard.ff-stages-capture .ff-service-rate-table > thead > tr > th, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-waybill #wizard.ff-stages-capture .ff-service-rate-table > thead > tr > th * { background: #171c26 !important; border-color: #566070 !important; color: #eef3fb !important; text-shadow: none !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > th, html body.ff-app.ff-app.ff-app[data-theme="dark"] #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > th * { background: #171c26 !important; border-color: #566070 !important; color: #eef3fb !important; opacity: 1 !important; text-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav { --ff-stages-rate-btn-width: 136px; align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 6px 0 4px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav { --ff-stages-rate-btn-width: 136px; align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 6px 0 4px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav--next { margin: 6px 15px 4px !important; width: calc(100% - 30px) !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav--next { margin: 6px 15px 4px !important; width: calc(100% - 30px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-stages-rate-btn-width) !important; float: none !important; justify-content: center !important; margin: 0 !important; max-width: var(--ff-stages-rate-btn-width) !important; min-width: var(--ff-stages-rate-btn-width) !important; width: var(--ff-stages-rate-btn-width) !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav > .btn, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 var(--ff-stages-rate-btn-width) !important; float: none !important; justify-content: center !important; margin: 0 !important; max-width: var(--ff-stages-rate-btn-width) !important; min-width: var(--ff-stages-rate-btn-width) !important; width: var(--ff-stages-rate-btn-width) !important; } html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav { --ff-service-rate-action-accent: var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)); --ff-service-rate-action-bg: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--surface, #fff)) 12%, var(--surface, #fff)); --ff-service-rate-action-bg-hover: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--surface, #fff)) 18%, var(--surface, #fff)); --ff-service-rate-action-bg-active: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--surface, #fff)) 24%, var(--surface, #fff)); --ff-service-rate-action-border: color-mix(in srgb, var(--ff-service-rate-action-accent) 64%, var(--surface, #fff)); --ff-service-rate-action-fg: color-mix(in srgb, var(--ff-service-rate-action-accent) 82%, var(--text, #1f1f1f)); } html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .btn, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action { background: var(--ff-service-rate-action-bg) !important; background-color: var(--ff-service-rate-action-bg) !important; border: 1px solid var(--ff-service-rate-action-border) !important; box-shadow: none !important; color: var(--ff-service-rate-action-fg) !important; -webkit-text-fill-color: var(--ff-service-rate-action-fg) !important; } html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn:hover, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:hover, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .btn:hover, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:hover { background: var(--ff-service-rate-action-bg-hover) !important; background-color: var(--ff-service-rate-action-bg-hover) !important; border-color: var(--ff-service-rate-action-accent) !important; color: var(--ff-service-rate-action-fg) !important; -webkit-text-fill-color: var(--ff-service-rate-action-fg) !important; } html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn:active, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:active, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn:focus, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:focus, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .btn:active, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:active, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .btn:focus, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .ff-service-rate-action:focus { background: var(--ff-service-rate-action-bg-active) !important; background-color: var(--ff-service-rate-action-bg-active) !important; border-color: var(--ff-service-rate-action-accent) !important; color: var(--ff-service-rate-action-fg) !important; -webkit-text-fill-color: var(--ff-service-rate-action-fg) !important; } html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn .fa, html body.ff-app.ff-app.ff-app:not([data-theme="dark"]) #wizard.ff-stages-capture .ff-service-rate-nav > .btn .fa { color: inherit !important; -webkit-text-fill-color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav--actions > .back-step { margin-right: auto !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav--actions > .back-step { margin-right: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav--next > #nextToRating { margin-left: auto !important; } html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-service-rate-nav--next > #nextToRating { margin-left: auto !important; } @media (max-width: 720px) { html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-service-rate-nav > .btn { flex: 1 1 calc(50% - 4px) !important; max-width: none !important; min-width: 120px !important; width: auto !important; } } /* Full capture rating: keep Charges compact but right-aligned so it has the same visual right gutter as Rating Variables. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-charges-col { flex-basis: 436px !important; max-width: 436px !important; width: 436px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-charges-section { flex-basis: 186px !important; max-width: 186px !important; width: 186px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { margin-left: auto !important; margin-right: 0 !important; width: 184px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child { width: 86px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child { width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-rating-vars-section { flex-basis: 242px !important; max-width: 242px !important; min-width: 242px !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed { width: 224px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:first-child { width: 108px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:last-child { width: 114px !important; } /* Waybill Stages direct rating: mirror the Full Capture rating layout. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col { flex-basis: 436px !important; max-width: 436px !important; width: 436px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section { flex-basis: 186px !important; max-width: 186px !important; width: 186px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { margin-left: auto !important; margin-right: 0 !important; width: 184px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child { width: 86px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child { width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section { flex-basis: 242px !important; max-width: 242px !important; min-width: 242px !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed { width: 224px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:first-child { width: 108px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-rating-vars-section table.table-condensed > tbody > tr > td:last-child { width: 114px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section { flex: 1 1 390px !important; max-width: 520px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section { flex: 0.72 1 155px !important; max-width: 184px !important; } /* Standard filter populated fields: match the tariff filter's subtle active cue across the shared view filters without changing layout density. */ html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) :is(.form-group, .dx-field, .checkbox, .clip-radio).ff-filter-field-populated > label, html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ff-filter-field-populated > .checkbox label, html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ff-filter-field-populated > .clip-radio label { color: color-mix(in srgb, var(--primary) 78%, var(--text)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) :is(.form-group, .dx-field).ff-filter-field-populated :is(.form-control, .ff-control, .ff-ui, .ui-select-container, .ui-select-match, .ui-select-toggle, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor) { background: color-mix(in srgb, var(--primary) 5%, var(--surface)) !important; border-color: color-mix(in srgb, var(--primary) 38%, var(--border)) !important; box-shadow: inset 3px 0 0 color-mix(in srgb, var(--primary) 48%, transparent) !important; } html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) :is(.checkbox, .clip-radio).ff-filter-field-populated label:before { border-color: color-mix(in srgb, var(--primary) 48%, var(--border)) !important; } /* Filter list fields: keep the clear icon beside the dropdown arrow so selected values, especially client names, get more usable text width. */ html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ui-select-bootstrap .ui-select-match .ui-select-toggle { padding-right: 40px !important; position: relative !important; } html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ui-select-bootstrap .ui-select-match .ui-select-match-text.ui-select-allow-clear { max-width: calc(100% - 34px) !important; } html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ui-select-bootstrap .ui-select-match .ui-select-toggle > .caret { right: 7px !important; } html body.ff-app.ff-app.ff-app :is(.ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-tariff-filter-panel, .ff-sr-card) .ui-select-bootstrap .ui-select-match .ui-select-toggle > :is(a.btn.btn-xs.btn-link, .close, .ui-select-match-close) { height: 20px !important; line-height: 20px !important; margin: 0 !important; padding: 0 !important; position: absolute !important; right: 18px !important; text-align: center !important; top: 50% !important; transform: translateY(-50%) !important; width: 18px !important; z-index: 3 !important; } /* View filter ui-select lists need to escape the compact filter panel. The panel normally uses paint containment/overflow control for grid speed, but those rules clip Client/User/Web User result lists on View Invoices and the same shared filter pattern on other view pages. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):focus-within, html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):has(:is(.ui-select-container, .ui-select-bootstrap, ui-select)) { contain: none !important; overflow: visible !important; z-index: 1800 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):focus-within :is(.ff-standard-filter-overlay-panel, .accordion-no-display, .ff-waybill, .ff-sr-card, .ff-filter-flow-row, .ff-finance-primary-filters, .ff-waybill-filter-grid, .row, [class*="col-"], .form-group), html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):has(:is(.ui-select-container, .ui-select-bootstrap, ui-select)) :is(.ff-standard-filter-overlay-panel, .accordion-no-display, .ff-waybill, .ff-sr-card, .ff-filter-flow-row, .ff-finance-primary-filters, .ff-waybill-filter-grid, .row, [class*="col-"], .form-group) { contain: none !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):focus-within :is(.ui-select-container, .ui-select-bootstrap, ui-select), html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row) :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) { z-index: 1850 !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row):focus-within .ui-select-choices, html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(.ff-standard-filter-overlay-row--open, .ff-standard-filter-overlay-row--persistent, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row) :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) .ui-select-choices { max-height: min(320px, calc(100dvh - 180px)) !important; overflow-x: hidden !important; overflow-y: auto !important; z-index: 1900 !important; } /* Waybill capture parcel grid: match the approved clear-icon spacing in the parcel description list field. */ html body.ff-app.ff-app.ff-app .ff-waybill table.custom-dx-table.ff-parcel-grid td.ff-col-desc .ui-select-bootstrap .ui-select-match .ui-select-toggle { padding-right: 40px !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-waybill table.custom-dx-table.ff-parcel-grid td.ff-col-desc .ui-select-bootstrap .ui-select-match .ui-select-match-text.ui-select-allow-clear { max-width: calc(100% - 34px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill table.custom-dx-table.ff-parcel-grid td.ff-col-desc .ui-select-bootstrap .ui-select-match .ui-select-toggle > .caret { right: 7px !important; } html body.ff-app.ff-app.ff-app .ff-waybill table.custom-dx-table.ff-parcel-grid td.ff-col-desc .ui-select-bootstrap .ui-select-match .ui-select-toggle > :is(a.btn.btn-xs.btn-link, .close, .ui-select-match-close) { height: 20px !important; line-height: 20px !important; margin: 0 !important; padding: 0 !important; position: absolute !important; right: 18px !important; text-align: center !important; top: 50% !important; transform: translateY(-50%) !important; width: 18px !important; z-index: 3 !important; } /* Standard grid checkbox guard: DevExtreme positions the check glyph inside .dx-checkbox-icon, so the icon itself must remain a positioning container. */ html body.ff-app.ff-app.ff-app .ff-standard-grid .dx-datagrid :is(.dx-checkbox-icon, .dx-select-checkbox .dx-checkbox-icon) { position: relative !important; } /* Absolute-final View Tracking checkbox glyph containment. Tracking has its own high-specificity grid-density rules, so keep real DevExtreme checkbox ticks anchored inside their icon box and hide only orphan icon fragments that are direct children of normal text cells. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon { box-sizing: border-box !important; overflow: hidden !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon:before { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell > .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell > .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > td.ff-tracking-plain-data-cell > .dx-checkbox-icon:before { content: none !important; display: none !important; visibility: hidden !important; } /* Absolute-final standard view-grid checkbox glyph containment. Several view grids have page-specific checkbox sizing rules. This final guard keeps real DevExtreme ticks inside their own icon box across all standard view grids without hiding row selectors or read-only boolean checkboxes. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon { box-sizing: border-box !important; overflow: hidden !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid :is(.dx-checkbox, .dx-select-checkbox, .ff-grid-boolean-checkbox) .dx-checkbox-icon:before { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td[class*="-plain-data-cell"] > .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td[class*="-plain-data-cell"] > .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #gridContainer3#gridContainer3, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #errorContainer#errorContainer, #integrationContainer#integrationContainer).ff-standard-grid.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > td[class*="-plain-data-cell"] > .dx-checkbox-icon:before { content: none !important; display: none !important; visibility: hidden !important; } /* Absolute-final shared Date Period width and pairing gap. Keep Date Period beside Date Range with a small consistent gap, while keeping nested finance/image/route date blocks compact enough to wrap cleanly. */ html body.ff-app.ff-app.ff-app :is(.ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-filter-inline-row, .ff-waybill-filter-grid, .ff-manifest-filter-row) { --ff-filter-date-gap-final: 10px; --ff-filter-date-period-width-final: 214px; --ff-filter-date-period-ignore-width-final: 66px; --ff-filter-date-range-width-final: 360px; } html body.ff-app.ff-app.ff-app :is(.ff-finance-date-block, .ff-image-date-block, .ff-route-date-filters, .ff-debtors-date-block, .ff-cons-filter-grid) { --ff-filter-date-period-width-final: 166px; --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: 248px; } html body.ff-app.ff-app.ff-app .ff-consolidation .ff-cons-filter-grid { --ff-filter-date-period-width-final: 164px; --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: 248px; } html body.ff-app.ff-app.ff-app .ff-view-crdr .ff-finance-date-block { --ff-filter-date-period-width-final: 154px; --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: 248px; } html body.ff-app.ff-app.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact) .ff-view-crdr .ff-finance-date-block { --ff-filter-date-period-width-final: 142px; --ff-filter-date-range-width-final: 232px; } html body.ff-app.ff-app.ff-app :is(.ff-waybill-filter-grid, .ff-manifest-filter-row, .ff-cons-filter-grid, .ff-image-date-row, .ff-route-date-row) { column-gap: var(--ff-filter-date-gap-final, 10px) !important; } html body.ff-app.ff-app.ff-app .ff-finance-date-block > .row { column-gap: var(--ff-filter-date-gap-final, 10px) !important; } html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row) { display: flex !important; flex-wrap: wrap !important; gap: 4px var(--ff-filter-date-gap-final, 10px) !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row)::before, html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row)::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row) > [class*="col-"] { float: none !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row) > [class*="col-"]:has(> .form-group [ng-model="filtermodel.QuickDate"]) { flex: 0 0 var(--ff-filter-date-period-width-final, 214px) !important; max-width: var(--ff-filter-date-period-width-final, 214px) !important; min-width: var(--ff-filter-date-period-width-final, 214px) !important; width: var(--ff-filter-date-period-width-final, 214px) !important; } html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row) > [class*="col-"]:has(> .form-group [ng-model="filtermodel.FromDate"]), html body.ff-app.ff-app.ff-app .ff-sr-card .row:has(> [class*="col-"] > .form-group [ng-model="filtermodel.QuickDate"]):not(.ff-waybill-filter-grid):not(.ff-manifest-filter-row):not(.ff-cons-filter-grid):not(.ff-image-date-row):not(.ff-route-date-row) > [class*="col-"]:has(> .form-group [ng-model="filtermodel.ToDate"]) { flex: 0 0 var(--ff-filter-date-range-width-final, 360px) !important; max-width: var(--ff-filter-date-range-width-final, 360px) !important; min-width: min(100%, var(--ff-filter-date-range-width-final, 360px)) !important; width: var(--ff-filter-date-range-width-final, 360px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-range, .ff-finance-date-range, .ff-image-date-range, .ff-manifest-date-range, .ff-route-date-range, .ff-cons-date-range, .ff-debtors-date-range ) { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 var(--ff-filter-date-range-width-final, 360px) !important; max-width: var(--ff-filter-date-range-width-final, 360px) !important; min-width: min(100%, var(--ff-filter-date-range-width-final, 360px)) !important; width: var(--ff-filter-date-range-width-final, 360px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-range, .ff-finance-date-range, .ff-image-date-range, .ff-manifest-date-range, .ff-route-date-range, .ff-cons-date-range, .ff-debtors-date-range ) > .form-group, html body.ff-app.ff-app.ff-app :is( .ff-filter-date-range, .ff-finance-date-range, .ff-image-date-range, .ff-manifest-date-range, .ff-route-date-range, .ff-cons-date-range, .ff-debtors-date-range ) .range-picker { box-sizing: border-box !important; max-width: var(--ff-filter-date-range-width-final, 360px) !important; min-width: min(100%, var(--ff-filter-date-range-width-final, 360px)) !important; width: var(--ff-filter-date-range-width-final, 360px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-range, .ff-finance-date-range, .ff-image-date-range, .ff-manifest-date-range, .ff-route-date-range, .ff-cons-date-range, .ff-debtors-date-range ) .range-picker :is(.start-date, .end-date) { flex: 1 1 0 !important; max-width: none !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-range, .ff-finance-date-range, .ff-image-date-range, .ff-manifest-date-range, .ff-route-date-range, .ff-cons-date-range, .ff-debtors-date-range ) .range-picker > .input-group-addon { flex: 0 0 42px !important; max-width: 42px !important; min-width: 42px !important; width: 42px !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 var(--ff-filter-date-period-width-final, 214px) !important; max-width: var(--ff-filter-date-period-width-final, 214px) !important; min-width: var(--ff-filter-date-period-width-final, 214px) !important; width: var(--ff-filter-date-period-width-final, 214px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) > .form-group { box-sizing: border-box !important; max-width: var(--ff-filter-date-period-width-final, 214px) !important; min-width: var(--ff-filter-date-period-width-final, 214px) !important; width: var(--ff-filter-date-period-width-final, 214px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) :is(.ff-date-period-group, .ff-image-date-period-group, .ff-route-date-period-group) { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-filter-date-period-width-final, 214px) !important; min-width: var(--ff-filter-date-period-width-final, 214px) !important; width: var(--ff-filter-date-period-width-final, 214px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) :is(.ff-date-period-ignore, .ff-image-date-period-ignore, .ff-route-date-period-ignore, .input-group-addon.input-group-addon-grey.input-group-addon-less-padding) { flex: 0 0 var(--ff-filter-date-period-ignore-width-final, 66px) !important; max-width: var(--ff-filter-date-period-ignore-width-final, 66px) !important; min-width: var(--ff-filter-date-period-ignore-width-final, 66px) !important; padding-left: 4px !important; padding-right: 3px !important; width: var(--ff-filter-date-period-ignore-width-final, 66px) !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) :is(.ff-date-period-ignore-label, .ff-image-date-period-ignore-label, .ff-route-date-period-ignore-label) { font-size: 11px !important; } html body.ff-app.ff-app.ff-app :is( .ff-filter-date-period, .ff-finance-date-period, .ff-image-date-period, .ff-manifest-date-period, .ff-route-date-period, .ff-cons-date-period ) :is(select.form-control, .ff-date-period-select, .ff-image-date-period-select) { flex: 1 1 calc(var(--ff-filter-date-period-width-final, 214px) - var(--ff-filter-date-period-ignore-width-final, 66px)) !important; max-width: calc(var(--ff-filter-date-period-width-final, 214px) - var(--ff-filter-date-period-ignore-width-final, 66px)) !important; min-width: 0 !important; padding-left: 5px !important; padding-right: 16px !important; width: calc(var(--ff-filter-date-period-width-final, 214px) - var(--ff-filter-date-period-ignore-width-final, 66px)) !important; } /* Absolute-final Debriefing row viewport repair. Debriefing is an editable capture grid, so keep it out of the shared measured-height loop and give DevExtreme a real widget height up front. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page { --ff-debrief-grid-height-final: clamp(390px, calc(100dvh - 354px), 860px); --ff-debrief-grid-chrome-final: 142px; --ff-debrief-rows-height-final: max(calc(var(--ff-grid-row-height, 26px) * 8), calc(var(--ff-debrief-grid-height-final) - var(--ff-debrief-grid-chrome-final))); --ff-debrief-total-footer-height-final: 0px; --ff-debrief-pager-height-final: 32px; --ff-debrief-select-width-final: 28px; --ff-debrief-select-size-final: 15px; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-debriefing.ff-debriefing.ff-standard-grid-page { --ff-debrief-grid-height-final: clamp(390px, calc(100dvh - 374px), 840px); --ff-debrief-grid-chrome-final: 150px; } /* Debriefing toolbar counters: keep neutral counts quiet and colour only the states users need to notice. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill { background: color-mix(in srgb, var(--text-muted, #6b7280) 14%, var(--surface, #fff)) !important; border: 1px solid color-mix(in srgb, var(--text-muted, #6b7280) 30%, var(--border, #d7dee8)) !important; color: var(--text-muted, #6b7280) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill--selected-active { background: var(--primary, #3478f6) !important; border-color: var(--primary, #3478f6) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill--with-pod-active { background: color-mix(in srgb, var(--success, #52c41a) 24%, var(--surface, #fff)) !important; border-color: color-mix(in srgb, var(--success, #52c41a) 52%, var(--border, #d7dee8)) !important; color: color-mix(in srgb, var(--success, #52c41a) 58%, var(--text, #1f2933)) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill--no-pod-active { background: color-mix(in srgb, var(--error, #ff4d4f) 20%, var(--surface, #fff)) !important; border-color: color-mix(in srgb, var(--error, #ff4d4f) 48%, var(--border, #d7dee8)) !important; color: color-mix(in srgb, var(--error, #ff4d4f) 62%, var(--text, #1f2933)) !important; } html body.ff-app[data-theme="dark"].ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill--with-pod-active { background: color-mix(in srgb, var(--success, #52c41a) 28%, var(--surface-2, #1b2030)) !important; color: color-mix(in srgb, var(--success, #52c41a) 72%, #fff) !important; } html body.ff-app[data-theme="dark"].ff-app.ff-app .ff-debriefing.ff-debriefing .ff-debrief-summary-pill--no-pod-active { background: color-mix(in srgb, var(--error, #ff4d4f) 24%, var(--surface-2, #1b2030)) !important; color: color-mix(in srgb, var(--error, #ff4d4f) 68%, #fff) !important; } /* Debriefing uses the shared operation filter, but its date sizing should match the accepted view-filter standard: Date Type 136px, Date Period 172px, Date Range 216px, with a narrow gap. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::after, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) > :is([class*="col-"], .ff-filter-field), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) > :is([class*="col-"], .ff-filter-field) { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid { column-gap: 8px !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 8px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-date-type { flex: 0 0 136px !important; max-width: 136px !important; min-width: 136px !important; width: 136px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-type > .form-group, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 136px !important; min-width: 0 !important; width: 136px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::before { border-radius: 4px !important; height: 16px !important; left: 5px !important; top: 50% !important; transform: translateY(-50%) !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::after { height: 4px !important; left: 9px !important; top: 50% !important; transform: translateY(-70%) rotate(-45deg) !important; width: 8px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-period .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-date-range { flex: 0 0 216px !important; margin-left: 0 !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-date-range .range-picker :is(.input-icon, .form-control) { box-sizing: border-box !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-client-row > .ff-filter-client { flex: 0 0 456px !important; max-width: 456px !important; min-width: 456px !important; width: 456px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-client-row > .ff-filter-client > .form-group, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-client-row > .ff-filter-client :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { height: auto !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned.dx-datagrid, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-gridbase-container { box-sizing: border-box !important; display: flex !important; flex-direction: column !important; height: var(--ff-debrief-grid-height-final) !important; max-height: var(--ff-debrief-grid-height-final) !important; min-height: var(--ff-debrief-grid-height-final) !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-headers, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-header-panel, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-total-footer, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-total-footer { display: none !important; flex-basis: var(--ff-debrief-total-footer-height-final) !important; height: var(--ff-debrief-total-footer-height-final) !important; max-height: var(--ff-debrief-total-footer-height-final) !important; min-height: var(--ff-debrief-total-footer-height-final) !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 var(--ff-debrief-pager-height-final) !important; height: var(--ff-debrief-pager-height-final) !important; justify-content: flex-end !important; max-height: var(--ff-debrief-pager-height-final) !important; min-height: var(--ff-debrief-pager-height-final) !important; opacity: 1 !important; overflow: visible !important; pointer-events: auto !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-pager :is(.dx-page-sizes, .dx-pages) { align-items: center !important; display: flex !important; flex: 0 0 auto !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-debrief-rows-height-final) !important; height: var(--ff-debrief-rows-height-final) !important; max-height: var(--ff-debrief-rows-height-final) !important; min-height: var(--ff-debrief-rows-height-final) !important; opacity: 1 !important; overflow: hidden !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: scroll !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable-content) { height: auto !important; max-height: none !important; min-height: 100% !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row { display: table-row !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td { display: table-cell !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: var(--ff-debrief-select-width-final) !important; min-width: var(--ff-debrief-select-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-debrief-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-wrapper) { align-items: center !important; background: transparent !important; border-radius: 2px !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-debrief-select-size-final) !important; justify-content: center !important; line-height: var(--ff-debrief-select-size-final) !important; margin: 0 auto !important; max-height: var(--ff-debrief-select-size-final) !important; max-width: var(--ff-debrief-select-size-final) !important; min-height: var(--ff-debrief-select-size-final) !important; min-width: var(--ff-debrief-select-size-final) !important; padding: 0 !important; width: var(--ff-debrief-select-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-icon { background-color: var(--surface) !important; border: 1px solid var(--border-strong, var(--border)) !important; border-radius: 2px !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-debrief-select-size-final) !important; line-height: var(--ff-debrief-select-size-final) !important; max-height: var(--ff-debrief-select-size-final) !important; max-width: var(--ff-debrief-select-size-final) !important; min-height: var(--ff-debrief-select-size-final) !important; min-width: var(--ff-debrief-select-size-final) !important; overflow: hidden !important; position: relative !important; width: var(--ff-debrief-select-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-checked .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox-indeterminate .dx-checkbox-icon { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > td { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > td { background-color: var(--surface-2) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):hover > td { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 9px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background: #fff !important; border: 0 !important; content: "" !important; display: block !important; height: 2px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } /* Absolute-final View Invoices eye action alignment. The invoice summary grid uses a very narrow command column, so center the whole action hit target instead of relying on inherited line-height offsets. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col) { box-sizing: border-box !important; overflow: visible !important; padding: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col) :is(.dx-button, .dx-link, a) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-view-invoices-action-hit-size, 22px) !important; justify-content: center !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-view-invoices-action-hit-size, 22px) !important; max-width: 100% !important; min-height: var(--ff-view-invoices-action-hit-size, 22px) !important; min-width: var(--ff-view-invoices-action-hit-size, 22px) !important; overflow: visible !important; padding: 0 !important; position: absolute !important; right: auto !important; text-align: center !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: middle !important; width: var(--ff-view-invoices-action-hit-size, 22px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col) .dx-button-content { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 100% !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: none !important; min-height: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid.ff-standard-grid--invoice-clients .dx-datagrid-rowsview :is(td.dx-command-edit, td.ff-invoice-view-command-col) :is(.fa-eye, .dx-icon.fa-eye, .dx-icon.fa, .fa)::before { display: inline-block !important; font-size: var(--ff-view-invoices-action-size, 16px) !important; height: var(--ff-view-invoices-action-size, 16px) !important; left: auto !important; line-height: var(--ff-view-invoices-action-size, 16px) !important; margin: 0 !important; max-height: var(--ff-view-invoices-action-size, 16px) !important; max-width: var(--ff-view-invoices-action-size, 16px) !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; position: static !important; right: auto !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-view-invoices-action-size, 16px) !important; } /* Absolute-final View Tracking grid polish. View Tracking uses the shared external grid tools, so hide DevExtreme's internal export toolbar, keep the selection checkboxes square, and let the grid own vertical scrolling once results are visible. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(300px, calc(100dvh - 299px), 780px) !important; --ff-tracking-selector-size-final: 14px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(300px, calc(100dvh - 319px), 780px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 299px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 319px) !important; } } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fullw > [block-ui], html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw > [block-ui] { box-sizing: border-box !important; max-height: calc(100dvh - 82px) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-header-panel, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-header-panel :is(.dx-toolbar, .dx-toolbar-items-container, .dx-toolbar-before, .dx-toolbar-center, .dx-toolbar-after), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button, .dx-button) { display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) { box-sizing: border-box !important; max-width: 30px !important; min-width: 30px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; background: transparent !important; border-radius: 2px !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tracking-selector-size-final, 14px) !important; justify-content: center !important; line-height: var(--ff-tracking-selector-size-final, 14px) !important; margin: 0 auto !important; max-height: var(--ff-tracking-selector-size-final, 14px) !important; max-width: var(--ff-tracking-selector-size-final, 14px) !important; min-height: var(--ff-tracking-selector-size-final, 14px) !important; min-width: var(--ff-tracking-selector-size-final, 14px) !important; padding: 0 !important; width: var(--ff-tracking-selector-size-final, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) .dx-checkbox-icon { background-color: var(--surface) !important; border: 1px solid var(--border-strong, var(--border)) !important; border-radius: 2px !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-tracking-selector-size-final, 14px) !important; line-height: var(--ff-tracking-selector-size-final, 14px) !important; max-height: var(--ff-tracking-selector-size-final, 14px) !important; max-width: var(--ff-tracking-selector-size-final, 14px) !important; min-height: var(--ff-tracking-selector-size-final, 14px) !important; min-width: var(--ff-tracking-selector-size-final, 14px) !important; overflow: hidden !important; position: relative !important; width: var(--ff-tracking-selector-size-final, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-tracking-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { color: transparent !important; cursor: progress !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection)::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(255, 255, 255, 0.58) !important; border-radius: 50% !important; border-top-color: #fff !important; content: "" !important; display: block !important; height: 12px !important; left: 50% !important; margin-left: -6px !important; margin-top: -6px !important; opacity: 1 !important; position: absolute !important; top: 50% !important; visibility: visible !important; width: 12px !important; } /* Absolute-final View Images grid polish. Match the shared grid tools behavior, keep selectors square, and let the image grid own vertical scrolling after results load. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-image-selector-size-final: 14px !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(280px, calc(100dvh - 342px), 760px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(280px, calc(100dvh - 362px), 760px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 342px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 362px) !important; } } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page > .container-fullw > [block-ui], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page > .container-fluid.container-fullw > [block-ui] { box-sizing: border-box !important; max-height: calc(100dvh - 82px) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-header-panel, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-header-panel :is(.dx-toolbar, .dx-toolbar-items-container, .dx-toolbar-before, .dx-toolbar-center, .dx-toolbar-after), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-header-panel :is(.dx-datagrid-export-button, .dx-datagrid-column-chooser-button, .dx-button) { display: none !important; height: 0 !important; line-height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) { box-sizing: border-box !important; max-width: 30px !important; min-width: 30px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; background: transparent !important; border-radius: 2px !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-image-selector-size-final, 14px) !important; justify-content: center !important; line-height: var(--ff-image-selector-size-final, 14px) !important; margin: 0 auto !important; max-height: var(--ff-image-selector-size-final, 14px) !important; max-width: var(--ff-image-selector-size-final, 14px) !important; min-height: var(--ff-image-selector-size-final, 14px) !important; min-width: var(--ff-image-selector-size-final, 14px) !important; padding: 0 !important; width: var(--ff-image-selector-size-final, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox-icon { background-color: var(--surface) !important; border: 1px solid var(--border-strong, var(--border)) !important; border-radius: 2px !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-image-selector-size-final, 14px) !important; line-height: var(--ff-image-selector-size-final, 14px) !important; max-height: var(--ff-image-selector-size-final, 14px) !important; max-width: var(--ff-image-selector-size-final, 14px) !important; min-height: var(--ff-image-selector-size-final, 14px) !important; min-width: var(--ff-image-selector-size-final, 14px) !important; overflow: hidden !important; position: relative !important; width: var(--ff-image-selector-size-final, 14px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { color: transparent !important; cursor: progress !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target::after, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection)::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(255, 255, 255, 0.58) !important; border-radius: 50% !important; border-top-color: #fff !important; content: "" !important; display: block !important; height: 12px !important; left: 50% !important; margin-left: -6px !important; margin-top: -6px !important; opacity: 1 !important; position: absolute !important; top: 50% !important; visibility: visible !important; width: 12px !important; } /* Absolute-final Towns/Hubs grid polish. Match View Waybills checkbox geometry and show a real pager wait state on both the Town and Hub grids. */ html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) { --ff-townhub-check-radius-final: 2px !important; --ff-townhub-check-size-final: 14px !important; --ff-townhub-select-width-final: 32px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-townhub-selector-column) { box-sizing: border-box !important; max-width: var(--ff-townhub-select-width-final) !important; min-width: var(--ff-townhub-select-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-townhub-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-townhub-selector-column, .ff-grid-boolean-checkbox) :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; background: transparent !important; border-radius: var(--ff-townhub-check-radius-final) !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-townhub-check-size-final) !important; justify-content: center !important; line-height: var(--ff-townhub-check-size-final) !important; margin: 0 auto !important; max-height: var(--ff-townhub-check-size-final) !important; max-width: var(--ff-townhub-check-size-final) !important; min-height: var(--ff-townhub-check-size-final) !important; min-width: var(--ff-townhub-check-size-final) !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-townhub-check-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select, .ff-townhub-selector-column, .ff-grid-boolean-checkbox) :is(.dx-checkbox-icon, input[type="checkbox"]), html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox .dx-checkbox-icon, .dx-checkbox-icon, input[type="checkbox"]) { accent-color: var(--primary) !important; background-color: var(--surface, #fff) !important; border: 1px solid var(--border-strong, var(--border, #b8c1ce)) !important; border-radius: var(--ff-townhub-check-radius-final) !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-townhub-check-size-final) !important; line-height: var(--ff-townhub-check-size-final) !important; margin: 0 !important; max-height: var(--ff-townhub-check-size-final) !important; max-width: var(--ff-townhub-check-size-final) !important; min-height: var(--ff-townhub-check-size-final) !important; min-width: var(--ff-townhub-check-size-final) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; vertical-align: middle !important; width: var(--ff-townhub-check-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td input[type="checkbox"]:checked { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) .dx-datagrid-rowsview .dx-data-row > td input[type="checkbox"]:checked::before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid) :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background: #fff !important; border: 0 !important; content: "" !important; display: block !important; height: 2px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { animation: none !important; color: transparent !important; cursor: progress !important; outline: 0 !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target::after, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-townhub-grid, #gridContainer1#gridContainer1.ff-townhub-grid).ff-standard-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection)::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid rgba(255, 255, 255, 0.58) !important; border-radius: 50% !important; border-top-color: #fff !important; content: "" !important; display: block !important; height: 12px !important; left: 50% !important; margin-left: -6px !important; margin-top: -6px !important; opacity: 1 !important; position: absolute !important; top: 50% !important; visibility: visible !important; width: 12px !important; } /* Absolute-final Query grid polish. Keep Query on the same square checkbox treatment as View Waybills and make the grid own vertical scrolling once result rows are visible. */ html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-query-selector-radius-final: 2px !important; --ff-query-selector-size-final: 14px !important; --ff-query-extra-rows-height-final: calc(var(--ff-grid-row-height, 18px) * 2) !important; --ff-standard-grid-check-size: var(--ff-query-selector-size-final) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(240px, calc(100dvh - 371px + var(--ff-query-extra-rows-height-final)), calc(745px + var(--ff-query-extra-rows-height-final))) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(240px, calc(100dvh - 391px + var(--ff-query-extra-rows-height-final)), calc(745px + var(--ff-query-extra-rows-height-final))) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 371px + var(--ff-query-extra-rows-height-final)) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 391px + var(--ff-query-extra-rows-height-final)) !important; } } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page > .container-fullw > [block-ui], html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw > [block-ui] { box-sizing: border-box !important; max-height: calc(100dvh - 82px) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned.dx-datagrid, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; height: auto !important; max-height: none !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview { box-sizing: border-box !important; display: block !important; flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; max-width: 100% !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; min-width: 0 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; display: block !important; flex: 1 1 auto !important; flex-basis: auto !important; height: 100% !important; max-height: 100% !important; max-width: 100% !important; min-height: 0 !important; min-width: 100% !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: 30px !important; min-width: 30px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container), html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; background: transparent !important; border-radius: var(--ff-query-selector-radius-final) !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-query-selector-size-final) !important; justify-content: center !important; line-height: var(--ff-query-selector-size-final) !important; margin: 0 auto !important; max-height: var(--ff-query-selector-size-final) !important; max-width: var(--ff-query-selector-size-final) !important; min-height: var(--ff-query-selector-size-final) !important; min-width: var(--ff-query-selector-size-final) !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-query-selector-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox) { top: calc(50% + 1px) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox), html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox) { position: relative !important; top: 1px !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox .dx-checkbox-icon, .dx-checkbox-icon, input[type="checkbox"]) { accent-color: var(--primary) !important; background-color: var(--surface, #fff) !important; border: 1px solid var(--border-strong, var(--border, #b8c1ce)) !important; border-radius: var(--ff-query-selector-radius-final) !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-query-selector-size-final) !important; line-height: var(--ff-query-selector-size-final) !important; margin: 0 !important; max-height: var(--ff-query-selector-size-final) !important; max-width: var(--ff-query-selector-size-final) !important; min-height: var(--ff-query-selector-size-final) !important; min-width: var(--ff-query-selector-size-final) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; vertical-align: middle !important; width: var(--ff-query-selector-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td input[type="checkbox"]:checked { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background: #fff !important; border: 0 !important; content: "" !important; display: block !important; height: 2px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } /* Absolute-final Tariffs page polish. Keep the filter compact, use the shared grid-tools export buttons, and make Tariffs own its vertical scrolling instead of growing the whole page. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-check-size: var(--ff-tariffs-selector-size-final) !important; --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(240px, calc(100dvh - 452px), 760px) !important; --ff-tariffs-selector-radius-final: 2px !important; --ff-tariffs-selector-size-final: 14px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(240px, calc(100dvh - 468px), 760px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 452px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 468px) !important; } } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend { padding-bottom: 8px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row { align-items: end !important; display: grid !important; gap: 6px 10px !important; grid-template-columns: repeat(24, minmax(0, 1fr)) !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"] { box-sizing: border-box !important; float: none !important; grid-column: span 4 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(.form-group, .ff-control, .ui-select-container, .ff-ms) { min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(label, .control-label) { margin-bottom: 2px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(.form-control, .ui-select-container, .ui-select-match, .btn-group, .multiselect-parent) { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-id-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-category-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-account-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.FromPC"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.ToPC"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.FromKgs"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.ToKgs"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.OutlyingCode"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.Zone"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(select[ng-model="filtermodel.NonDoc"]) { grid-column: span 2 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-type-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-effective-date, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-service-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(#topRecs) { grid-column: span 3 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-client-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-agent-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-sender-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-receiver-field { grid-column: span 8 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(ui-select[ng-model="filtermodel.RateCode"]) { grid-column: span 4 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-from, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-to { grid-column: span 3 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-footer-actions { align-self: end !important; grid-column: 7 / -1 !important; justify-self: stretch !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin-left: auto !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle:is(:hover, :focus, :active, .active), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 34px) !important; height: var(--ff-control-h, 34px) !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle > .fa { font-size: 14px !important; height: 14px !important; line-height: 14px !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 150px !important; margin: 0 !important; max-width: 160px !important; min-width: 140px !important; width: 150px !important; } /* Tariffs final-row action alignment follow-up. Put a flexible spacer between To Area and the action cluster so Keep Open, the column-mode toggle, close, and SEARCH sit against the right edge. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row { align-items: end !important; display: grid !important; grid-template-columns: minmax(180px, 320px) minmax(180px, 320px) minmax(16px, 1fr) max-content !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-from { grid-column: 1 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-to { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-footer-actions { display: flex !important; grid-column: 4 !important; justify-content: flex-end !important; justify-self: end !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: 0 !important; } @media (max-width: 1180px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row { grid-template-columns: repeat(2, minmax(145px, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-footer-actions { grid-column: 1 / -1 !important; justify-self: stretch !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { margin-left: auto !important; } } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 10px !important; min-height: 28px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner .ff-grid-actions-host { margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-add-row-btn { display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner :is(.btn, .ff-grid-action-btn), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-header-panel :is(.dx-button, .ff-tariff-add-row-dx-button), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-header-panel :is(.dx-button, .ff-tariff-add-row-dx-button):is(:hover, :focus, :active, .dx-state-hover, .dx-state-focused, .dx-state-active) { border-color: transparent !important; box-shadow: none !important; outline: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-header-panel :is(.dx-datagrid-addrow-button, .dx-datagrid-export-button, .dx-datagrid-column-chooser-button) { display: none !important; pointer-events: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page > .container-fullw, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page > .container-fluid.container-fullw { box-sizing: border-box !important; max-height: calc(100dvh - 82px) !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page .ff-grid-result-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.dx-datagrid, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; height: auto !important; max-height: none !important; min-height: 0 !important; min-width: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-header-panel, .dx-datagrid-headers, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { flex: 0 0 auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow: auto !important; overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed, .dx-scrollable-content) { height: auto !important; max-height: none !important; min-height: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { box-sizing: border-box !important; max-width: 30px !important; min-width: 30px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; text-align: center !important; vertical-align: middle !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container) { align-items: center !important; background: transparent !important; border-radius: var(--ff-tariffs-selector-radius-final) !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-tariffs-selector-size-final) !important; justify-content: center !important; line-height: var(--ff-tariffs-selector-size-final) !important; margin: 0 auto !important; max-height: var(--ff-tariffs-selector-size-final) !important; max-width: var(--ff-tariffs-selector-size-final) !important; min-height: var(--ff-tariffs-selector-size-final) !important; min-width: var(--ff-tariffs-selector-size-final) !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-tariffs-selector-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) :is(.dx-checkbox, .dx-select-checkbox) { left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox .dx-checkbox-icon, .dx-checkbox-icon, input[type="checkbox"]) { accent-color: var(--primary) !important; background-color: var(--surface, #fff) !important; border: 1px solid var(--border-strong, var(--border, #b8c1ce)) !important; border-radius: var(--ff-tariffs-selector-radius-final) !important; box-shadow: none !important; box-sizing: border-box !important; height: var(--ff-tariffs-selector-size-final) !important; line-height: var(--ff-tariffs-selector-size-final) !important; margin: 0 !important; max-height: var(--ff-tariffs-selector-size-final) !important; max-width: var(--ff-tariffs-selector-size-final) !important; min-height: var(--ff-tariffs-selector-size-final) !important; min-width: var(--ff-tariffs-selector-size-final) !important; overflow: hidden !important; padding: 0 !important; position: relative !important; vertical-align: middle !important; width: var(--ff-tariffs-selector-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td input[type="checkbox"] { appearance: none !important; -webkit-appearance: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > td input[type="checkbox"]:checked { background-color: var(--primary) !important; border-color: var(--primary) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background: #fff !important; border: 0 !important; content: "" !important; display: block !important; height: 2px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } /* Absolute-final wait indicator cleanup. The angular-loading-bar spinner is the large portal wait animation. Hide the older csspinner/load1 pseudo-spinner so searches and route changes do not show two rings at once. */ html body.ff-app.ff-app.ff-app :is(.csspinner, .loading, .load1, .load2):is(.csspinner, [block-ui], .app-content)::after, html body.ff-app.ff-app.ff-app [block-ui]:is(.csspinner, .loading, .load1, .load2)::after, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2)::after { animation: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } /* Absolute-final Tariffs correction. Keep filter sizing local to the filter and leave DevExtreme grid content widths on the measured horizontal-scroll contract used by the working view pages. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend { align-items: end !important; display: grid !important; gap: 6px 10px !important; grid-template-columns: repeat(24, minmax(0, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > legend.ff-sr-legend { grid-column: 1 / -1 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row { display: contents !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::after, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"] { box-sizing: border-box !important; float: none !important; grid-column: span 3 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(.form-group, .ff-control, .ui-select-container, .ff-ms, .input-group, .input-icon) { min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(label, .control-label) { margin-bottom: 2px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel :is(.form-control, .ui-select-container, .ui-select-match, .btn-group, .multiselect-parent) { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-id-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-category-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-type-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-effective-date, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-account-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-area-from, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-area-to, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.FromPC"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.ToPC"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.FromKgs"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.ToKgs"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.OutlyingCode"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(input[ng-model="filtermodel.Zone"]), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(select[ng-model="filtermodel.NonDoc"]) { grid-column: span 2 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-client-field { grid-column: span 6 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(ui-select[ng-model="filtermodel.RateCode"]) { grid-column: span 4 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(#topRecs) { grid-column: span 3 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-date-group .input-group-addon { flex: 0 0 68px !important; max-width: 68px !important; min-width: 68px !important; padding-left: 4px !important; padding-right: 4px !important; width: 68px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-date-group .ff-tariff-date-icon { display: block !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { align-self: end !important; display: flex !important; grid-column: 5 / -1 !important; justify-content: flex-end !important; justify-self: stretch !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex: 1 1 auto !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin-left: auto !important; margin-right: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-column-loading-toggle:is(:hover, :focus, :active, .active), html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-close-filter:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 34px) !important; height: var(--ff-control-h, 34px) !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 150px !important; margin: 0 !important; max-width: 160px !important; min-width: 140px !important; width: 150px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 2px 10px !important; min-height: 28px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner .ff-tariff-add-row-btn, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner .ff-tariff-add-row-btn:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-grid-toolbar-button-size, 34px) !important; height: var(--ff-grid-toolbar-button-size, 34px) !important; justify-content: center !important; margin-left: auto !important; max-width: var(--ff-grid-toolbar-button-size, 34px) !important; min-width: var(--ff-grid-toolbar-button-size, 34px) !important; padding: 0 !important; width: var(--ff-grid-toolbar-button-size, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-grid-toolbar-inner .ff-grid-actions-host { margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs .dx-datagrid-header-panel :is(.dx-datagrid-addrow-button, .ff-tariff-add-row-dx-button, .dx-datagrid-export-button, .dx-datagrid-column-chooser-button) { display: none !important; pointer-events: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-tariff-pager-loading { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-tariff-pager-loading::after { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 4px solid rgba(47, 124, 246, 0.22) !important; border-radius: 50% !important; border-top-color: #2f7cf6 !important; content: "" !important; display: block !important; height: 48px !important; left: 50% !important; margin-left: -24px !important; margin-top: -24px !important; pointer-events: none !important; position: absolute !important; top: 50% !important; width: 48px !important; z-index: 35 !important; } @media (max-width: 1180px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { grid-column: 1 / -1 !important; } } @media (max-width: 760px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend { display: block !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"] { flex: 1 1 100% !important; width: 100% !important; } } /* True-final Tariffs filter and grid corrections. This sits after the earlier Tariffs correction so the requested field sizing, right-aligned search cluster, grid width, and pager wait behaviour win. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(336px, calc(100dvh - 272px), 1064px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]) .ff-tariffs.ff-standard-grid-page { --ff-standard-grid-rows-max-height: clamp(336px, calc(100dvh - 288px), 1064px) !important; } @supports not (height: 100dvh) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 272px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]) .ff-tariffs.ff-standard-grid-page { --ff-standard-grid-rows-max-height: calc(100vh - 288px) !important; } } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-id-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-category-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-account-field { grid-column: span 2 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-client-field { grid-column: span 7 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"]:has(#topRecs) { grid-column: span 1 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { align-self: end !important; display: flex !important; grid-column: 1 / -1 !important; justify-content: flex-end !important; justify-self: stretch !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex: 0 1 auto !important; flex-wrap: nowrap !important; gap: 6px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { margin-left: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-tariff-pager-loading::after { animation: none !important; content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-tariff-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { animation: ff-waybill-pager-busy-pulse 0.9s ease-in-out infinite !important; background-color: rgba(47, 124, 246, 0.18) !important; color: #2f7cf6 !important; cursor: progress !important; outline: 2px solid rgba(47, 124, 246, 0.3) !important; outline-offset: 1px !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-tariff-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button)::after { animation: none !important; content: none !important; display: none !important; } /* Absolute-final View Collections filter alignment. Keep the shared operations filter in one compact field flow: dates, Client/Acc #, Branch, then let the remaining fields continue after Branch. Give Date Period and Date Range an explicit narrow gap so they do not touch. */ html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; column-gap: 12px !important; gap: 5px 12px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > legend.ff-sr-legend, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > .ff-filter-actions-slot--top { flex: 0 0 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::before, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row)::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid { align-items: flex-start !important; column-gap: 12px !important; display: contents !important; flex-wrap: wrap !important; gap: 5px 12px !important; row-gap: 5px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) > .ff-filter-field { align-self: flex-start !important; float: none !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card .ff-filter-field > :is(.form-group, .dx-field) { box-sizing: border-box !important; margin-bottom: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-id { flex: 0 0 168px !important; max-width: 168px !important; min-width: 150px !important; order: 10 !important; width: 168px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-date-type { flex: 0 0 180px !important; max-width: 180px !important; min-width: 160px !important; order: 20 !important; width: 180px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; order: 30 !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-period .ff-date-period-group { box-sizing: border-box !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-period .ff-date-period-group { display: flex !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-period .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-date-range { box-sizing: border-box !important; flex: 0 0 228px !important; margin-left: 0 !important; max-width: 228px !important; min-width: 228px !important; order: 40 !important; padding-left: 12px !important; width: 228px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range .range-picker { max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range .range-picker { display: flex !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range .range-picker :is(.start-date, .end-date) { flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range .range-picker > .input-group-addon { flex: 0 0 24px !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-client { flex: 0 0 340px !important; max-width: 340px !important; min-width: 260px !important; order: 50 !important; width: 340px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-acc { flex: 0 0 180px !important; max-width: 180px !important; min-width: 150px !important; order: 60 !important; width: 180px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-waybill-filter-grid > .ff-filter-branch { flex: 0 0 300px !important; max-width: 300px !important; min-width: 240px !important; order: 70 !important; width: 300px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-collection-filter-break { display: none !important; flex: 0 0 0 !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; order: 75 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-agent { order: 80 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-driver { order: 90 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-vehicle { order: 100 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-ref { order: 110 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-order { order: 120 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-schedule { order: 130 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-user { order: 140 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-bool-wide { order: 150 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections :is(.ff-filter-agent, .ff-filter-driver, .ff-filter-vehicle, .ff-filter-ref, .ff-filter-order, .ff-filter-schedule, .ff-filter-user, .ff-filter-bool-wide) { flex: 0 1 205px !important; max-width: 280px !important; min-width: 165px !important; width: 205px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions { align-self: flex-end !important; flex: 1 1 330px !important; margin-left: auto !important; max-width: none !important; min-width: 310px !important; order: 160 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions-row { margin: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions-row > .ff-filter-actions { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px !important; justify-content: flex-end !important; margin: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions-row::before, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions-row::after, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions::before, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-keep-open { flex: 0 0 auto !important; margin-left: auto !important; margin-right: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-close, html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-close:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 34px) !important; height: var(--ff-control-h, 34px) !important; margin: 0 !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-search { flex: 0 0 150px !important; margin: 0 !important; max-width: 160px !important; min-width: 140px !important; width: 150px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-status-row > .col-md-12 { flex: 0 0 100% !important; max-width: 100% !important; min-width: 0 !important; order: 170 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } @media (max-width: 1120px) { html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card { display: block !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-standard-filter-overlay-panel .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-flow-row) { display: flex !important; flex-wrap: wrap !important; gap: 5px 12px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-collection-filter-break { display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions { flex-basis: 100% !important; margin-left: 0 !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections .ff-filter-collection-inline-actions .ff-filter-actions-row > .ff-filter-actions { justify-content: flex-end !important; } } /* Absolute-final View Manifests filter date sizing. Shared view filter date standard: Date Type: 204px for Manifest Date text. Date Period: 172px total, split as 78px Ignore + 94px period select. Date Range: 216px total, split as 96px From + 24px "to" + 96px To. Gap between Date Period and Date Range: 12px. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-row { align-items: flex-start !important; column-gap: 12px !important; display: flex !important; flex-wrap: wrap !important; gap: 3px 12px !important; row-gap: 3px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-row > [class*="col-"] { float: none !important; grid-column: auto !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-row > .ff-manifest-date-type { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 204px !important; max-width: 204px !important; min-width: 204px !important; width: 204px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-type > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 204px !important; min-width: 0 !important; width: 204px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-row > .ff-manifest-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period .ff-date-period-ignore-label { font-size: 11px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-filter-row > .ff-manifest-date-range { box-sizing: border-box !important; flex: 0 0 228px !important; margin-left: 0 !important; max-width: 228px !important; min-width: 228px !important; padding-left: 12px !important; width: 228px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range .range-picker { display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-period > .form-group > label, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range > .form-group > label { white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range .range-picker :is(.start-date, .end-date) { flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests) .ff-manifest-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } /* Absolute-final View Manifests grid width, icon, and height recovery. This mirrors the standard view-grid behavior after manifest-specific saved columns and scroll overrides have applied. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(360px, calc(100dvh - 252px)) !important; --ff-standard-grid-action-size: 16px !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: border-box !important; max-width: 100% !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) { max-width: none !important; min-width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-standard-grid-css-owned .dx-datagrid-rowsview .ff-manifest-command-col :is(.dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, .fa-eye) { align-items: center !important; display: inline-flex !important; font-size: 16px !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin: 0 auto !important; max-height: 16px !important; max-width: 18px !important; min-height: 16px !important; min-width: 18px !important; padding: 0 !important; width: 18px !important; } /* Absolute-final View Manifests native-grid polish. View Manifests now uses DevExtreme's native standard/fixed-column rendering, so keep its size and fixed panes here instead of the old CSS-owned path. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid { --ff-grid-row-height: 22px !important; --ff-standard-grid-action-size: 18px !important; --ff-standard-grid-cell-line-height: 20px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-effective-rows-height: var(--ff-view-manifests-rows-height-measured, max(420px, calc(100dvh - 252px))) !important; --ff-standard-grid-font-size: 12px !important; --ff-standard-grid-row-height: 22px !important; --ff-view-manifests-cell-height-final: 20px !important; --ff-view-manifests-fixed-row-height: 22px !important; --ff-view-manifests-fixed-row-height-final: 22px !important; --ff-view-manifests-row-height: 22px !important; --ff-view-manifests-row-height-final: 22px !important; --ff-view-manifests-row-height-normal: 22px !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid { --ff-standard-grid-effective-rows-height: var(--ff-view-manifests-rows-height-measured, calc(100vh - 252px)) !important; } } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid, .dx-gridbase-container) { min-height: var(--ff-view-manifests-grid-height-measured, auto) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-standard-grid-row-height) !important; font-size: var(--ff-standard-grid-font-size) !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, img, .dx-link, .ff-manifest-row-actions, .ff-manifest-row-action), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > div:not(.dx-checkbox):not(.dx-select-checkbox):not(.dx-dropdownbutton):not(.dx-button):not(.dx-texteditor) { font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-cell-line-height) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer .dx-datagrid-content-fixed { display: block !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr > :is(td, th) { border-color: #d9dde5 !important; border-style: solid !important; border-width: 1px 1px 1px 0 !important; box-sizing: border-box !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { border-right-width: 2px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .ff-manifest-command-col { text-align: center !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .ff-manifest-command-col :is(.dx-link, .dx-button, .dx-button-content, .dx-icon, .fa, .fa-eye) { align-items: center !important; display: inline-flex !important; font-size: 16px !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 0 auto !important; max-height: 18px !important; max-width: 20px !important; min-height: 18px !important; min-width: 20px !important; padding: 0 !important; width: 20px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .dx-command-edit) { padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .dx-command-edit) > :is(.dx-link, .dx-button, .dx-button-content, .ff-manifest-row-actions, .ff-manifest-row-action) { align-items: center !important; display: flex !important; height: 100% !important; justify-content: center !important; margin: 0 !important; padding: 0 !important; transform: translateX(-2px) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer { display: block !important; min-height: var(--ff-standard-grid-total-footer-height, 24px) !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > td { height: var(--ff-standard-grid-total-footer-height, 24px) !important; line-height: calc(var(--ff-standard-grid-total-footer-height, 24px) - 2px) !important; max-height: var(--ff-standard-grid-total-footer-height, 24px) !important; min-height: var(--ff-standard-grid-total-footer-height, 24px) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page .ff-grid-toolbar-row > .ff-grid-toolbar-inner { display: flex !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-right { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; min-width: max-content !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-view-manifests-simple, .ff-view-manifests.ff-view-manifests).ff-standard-grid-page .ff-grid-toolbar-row .ff-grid-toolbar-right :is(.ff-grid-actions-host, .ff-grid-actions, .ff-grid-export) { align-items: center !important; display: inline-flex !important; justify-content: flex-end !important; margin-left: auto !important; } /* Absolute-final View Quotes filter date sizing and rows viewport. Date Type is reduced by 40% from the old 190px quote slot, and Date Period / Date Range follow the shared view-field standard: 148px Date Period, 360px Date Range, 8px gap. */ html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid { align-items: flex-start !important; column-gap: 8px !important; display: flex !important; flex-wrap: wrap !important; gap: 3px 8px !important; row-gap: 3px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > [class*="col-"] { float: none !important; grid-column: auto !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-id { flex: 0 0 112px !important; max-width: 112px !important; min-width: 108px !important; width: 112px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-date-type { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 114px !important; max-width: 114px !important; min-width: 114px !important; width: 114px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-type > .form-group, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 114px !important; min-width: 0 !important; width: 114px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 148px !important; max-width: 148px !important; min-width: 148px !important; width: 148px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 148px !important; min-width: 148px !important; width: 148px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 62px !important; max-width: 62px !important; min-width: 62px !important; padding-left: 4px !important; padding-right: 3px !important; width: 62px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period .ff-date-period-ignore-label { font-size: 11px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period .ff-date-period-select { flex: 0 0 86px !important; max-width: 86px !important; min-width: 86px !important; padding-left: 5px !important; padding-right: 16px !important; width: 86px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-date-range { flex: 0 0 360px !important; max-width: 360px !important; min-width: 360px !important; width: 360px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range .range-picker { max-width: 360px !important; min-width: 360px !important; width: 360px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range .range-picker { display: flex !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-period > .form-group > label, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range > .form-group > label { white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range .range-picker :is(.start-date, .end-date) { flex: 1 1 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 42px !important; justify-content: center !important; max-width: 42px !important; min-width: 42px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 42px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-branch { flex: 0 0 280px !important; max-width: 280px !important; min-width: 280px !important; width: 280px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 395px)) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 455px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 395px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 455px) !important; } } html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned, #gridContainer1#gridContainer1.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned) { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(300px, calc(100dvh - 236px)) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns.ff-towns.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns.ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned, #gridContainer1#gridContainer1.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned) { --ff-standard-grid-rows-max-height: max(300px, calc(100dvh - 296px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-towns.ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned, #gridContainer1#gridContainer1.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned) { --ff-standard-grid-rows-max-height: calc(100vh - 236px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns.ff-towns.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-towns.ff-towns.ff-standard-grid-page :is(#gridContainer#gridContainer.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned, #gridContainer1#gridContainer1.ff-standard-grid.ff-townhub-grid.ff-standard-grid-css-owned) { --ff-standard-grid-rows-max-height: calc(100vh - 296px) !important; } } /* Absolute-final Generate Invoice filter alignment. Date Period / Date Range use the accepted view-filter standard with a visible gap. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card { --ff-filter-date-gap-final: 8px; --ff-filter-date-period-width-final: 172px; --ff-filter-date-period-ignore-width-final: 78px; --ff-filter-date-range-width-final: 216px; --ff-filter-date-range-slot-final: 224px; --ff-invoice-generate-bool-width-final: 108px; --ff-invoice-generate-bool-wide-width-final: 140px; --ff-invoice-generate-action-width-final: 150px; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid { align-items: flex-start !important; column-gap: var(--ff-filter-date-gap-final, 12px) !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-filter-date-gap-final, 12px) !important; grid-template-columns: none !important; row-gap: 5px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-type { flex: 0 0 136px !important; max-width: 136px !important; min-width: 136px !important; width: 136px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-type > .form-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 136px !important; min-width: 0 !important; width: 136px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-filter-date-period-width-final) !important; min-width: var(--ff-filter-date-period-width-final) !important; width: var(--ff-filter-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-filter-date-period-ignore-width-final) !important; max-width: var(--ff-filter-date-period-ignore-width-final) !important; min-width: var(--ff-filter-date-period-ignore-width-final) !important; padding-left: 4px !important; padding-right: 3px !important; width: var(--ff-filter-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: var(--ff-filter-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::before { border-radius: 4px !important; height: 16px !important; left: 5px !important; top: 50% !important; transform: translateY(-50%) !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::after { height: 4px !important; left: 9px !important; top: 50% !important; transform: translateY(-70%) rotate(-45deg) !important; width: 8px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-select { flex: 0 0 calc(var(--ff-filter-date-period-width-final) - var(--ff-filter-date-period-ignore-width-final)) !important; max-width: calc(var(--ff-filter-date-period-width-final) - var(--ff-filter-date-period-ignore-width-final)) !important; min-width: 0 !important; padding-left: 5px !important; padding-right: 16px !important; width: calc(var(--ff-filter-date-period-width-final) - var(--ff-filter-date-period-ignore-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice :is(.ff-filter-date-period, .ff-filter-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice :is(.ff-filter-date-period, .ff-filter-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker { flex-direction: row !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-range { box-sizing: border-box !important; flex: 0 0 var(--ff-filter-date-range-slot-final) !important; margin-left: 0 !important; max-width: var(--ff-filter-date-range-slot-final) !important; min-width: var(--ff-filter-date-range-slot-final) !important; padding-left: var(--ff-filter-date-gap-final) !important; width: var(--ff-filter-date-range-slot-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-filter-date-range-width-final) !important; min-width: var(--ff-filter-date-range-width-final) !important; width: var(--ff-filter-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-invoice-generate-dormant-inline { align-self: flex-end !important; display: inline-flex !important; float: none !important; min-height: var(--ff-control-h, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; white-space: nowrap !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-invoice-generate-dormant-inline :is(.checkbox, label) { margin-bottom: 0 !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group { flex: 0 0 100% !important; max-width: 100% !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row { align-items: flex-end !important; display: flex !important; flex-wrap: nowrap !important; gap: 4px 8px !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row > :is(.ff-filter-bool, .ff-filter-bool-wide) { float: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row > .ff-filter-bool { flex: 0 0 var(--ff-invoice-generate-bool-width-final) !important; max-width: var(--ff-invoice-generate-bool-width-final) !important; min-width: var(--ff-invoice-generate-bool-width-final) !important; width: var(--ff-invoice-generate-bool-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group > .ff-filter-inline-row > .ff-filter-bool-wide { flex: 0 0 var(--ff-invoice-generate-bool-wide-width-final) !important; max-width: var(--ff-invoice-generate-bool-wide-width-final) !important; min-width: var(--ff-invoice-generate-bool-wide-width-final) !important; width: var(--ff-invoice-generate-bool-wide-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions { align-self: flex-end !important; box-sizing: border-box !important; display: block !important; flex: 1 1 360px !important; float: none !important; margin-left: auto !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions-row { margin: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions-row::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions-row::after, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-actions { align-items: center !important; display: flex !important; flex-wrap: nowrap !important; gap: 6px !important; justify-content: flex-end !important; margin: 0 !important; min-width: max-content !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-keep-open { margin-left: auto !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-close, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-close:is(:hover, :focus, :active, .active) { flex: 0 0 var(--ff-control-h, 34px) !important; height: var(--ff-control-h, 34px) !important; margin: 0 !important; max-width: var(--ff-control-h, 34px) !important; min-width: var(--ff-control-h, 34px) !important; padding: 0 !important; width: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-bool-group .ff-filter-invoice-generate-inline-actions .ff-filter-search { flex: 0 0 var(--ff-invoice-generate-action-width-final) !important; margin: 0 !important; max-width: var(--ff-invoice-generate-action-width-final) !important; min-width: var(--ff-invoice-generate-action-width-final) !important; width: var(--ff-invoice-generate-action-width-final) !important; } /* Absolute-final View Tracking filter, pager, and viewport tuning. Tracking date-field standard: Date Type: 288px, a 50% increase from the compact 192px view-field baseline. Date Period: 214px total, matching the accepted View Waybills date-period width. Date Range: 360px total, matching the accepted View Waybills date-range width. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-sr-card { --ff-tracking-filter-id-width-final: 184px; --ff-tracking-date-type-width-final: 288px; --ff-tracking-date-period-width-final: 214px; --ff-tracking-date-period-ignore-width-final: 62px; --ff-tracking-date-range-width-final: 360px; --ff-tracking-date-range-middle-width-final: 42px; --ff-tracking-top-client-width-final: 360px; --ff-tracking-branch-client-row-width-final: 488px; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 3px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row::after, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row::before, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-track-row) > [class*="col-"] { float: none !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-id { flex: 0 0 var(--ff-tracking-filter-id-width-final) !important; max-width: var(--ff-tracking-filter-id-width-final) !important; min-width: var(--ff-tracking-filter-id-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-date-type { flex: 0 0 var(--ff-tracking-date-type-width-final) !important; max-width: var(--ff-tracking-date-type-width-final) !important; min-width: var(--ff-tracking-date-type-width-final) !important; width: var(--ff-tracking-date-type-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-type :is(.form-group, .ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn) { max-width: var(--ff-tracking-date-type-width-final) !important; width: var(--ff-tracking-date-type-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 var(--ff-tracking-date-period-width-final) !important; max-width: var(--ff-tracking-date-period-width-final) !important; min-width: var(--ff-tracking-date-period-width-final) !important; width: var(--ff-tracking-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-period .ff-date-period-group { display: flex !important; max-width: var(--ff-tracking-date-period-width-final) !important; min-width: var(--ff-tracking-date-period-width-final) !important; width: var(--ff-tracking-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-tracking-date-period-ignore-width-final) !important; max-width: var(--ff-tracking-date-period-ignore-width-final) !important; min-width: var(--ff-tracking-date-period-ignore-width-final) !important; padding-left: 4px !important; padding-right: 3px !important; width: var(--ff-tracking-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-period .ff-date-period-ignore-label { font-size: 11px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-period .ff-date-period-select { flex: 0 0 calc(var(--ff-tracking-date-period-width-final) - var(--ff-tracking-date-period-ignore-width-final)) !important; max-width: calc(var(--ff-tracking-date-period-width-final) - var(--ff-tracking-date-period-ignore-width-final)) !important; min-width: 0 !important; padding-left: 5px !important; padding-right: 16px !important; width: calc(var(--ff-tracking-date-period-width-final) - var(--ff-tracking-date-period-ignore-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-date-range { flex: 0 0 var(--ff-tracking-date-range-width-final) !important; max-width: var(--ff-tracking-date-range-width-final) !important; min-width: var(--ff-tracking-date-range-width-final) !important; width: var(--ff-tracking-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-range .range-picker { display: flex !important; max-width: var(--ff-tracking-date-range-width-final) !important; min-width: var(--ff-tracking-date-range-width-final) !important; width: var(--ff-tracking-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-range .range-picker :is(.start-date, .end-date) { flex: 1 1 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-range .range-picker > .input-group-addon { flex: 0 0 var(--ff-tracking-date-range-middle-width-final) !important; max-width: var(--ff-tracking-date-range-middle-width-final) !important; min-width: var(--ff-tracking-date-range-middle-width-final) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-tracking-date-range-middle-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-branch:not(.ff-filter-branch--tracking-client-row), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row > .ff-filter-client { display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid > .ff-filter-client--tracking-top { flex: 0 0 var(--ff-tracking-top-client-width-final) !important; max-width: var(--ff-tracking-top-client-width-final) !important; min-width: var(--ff-tracking-top-client-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row > .ff-filter-branch--tracking-client-row { flex: 0 0 var(--ff-tracking-branch-client-row-width-final) !important; max-width: var(--ff-tracking-branch-client-row-width-final) !important; min-width: var(--ff-tracking-branch-client-row-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-client-row > .ff-filter-acc { flex: 0 0 244px !important; max-width: 244px !important; min-width: 244px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row > :is(.ff-filter-track-id, .ff-filter-track-activity, .ff-filter-track-webuser, .ff-filter-track-user) { flex: 0 0 244px !important; max-width: 244px !important; min-width: 244px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row .form-group > label.width100 { align-items: baseline !important; display: flex !important; gap: 4px !important; min-height: 16px !important; overflow: hidden !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-filter-track-row .form-group > label.width100 > .text-muted[json-dbl] { display: inline-block !important; float: none !important; font-size: 8.5px !important; letter-spacing: 0 !important; line-height: 10px !important; margin-left: auto !important; max-width: 82px !important; overflow: hidden !important; text-align: right !important; text-overflow: clip !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(345px, calc(100dvh - 269px), 825px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(345px, calc(100dvh - 289px), 825px) !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target) { color: inherit !important; cursor: pointer !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target)::after { animation: none !important; content: none !important; display: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; flex: 0 0 var(--ff-standard-grid-pager-height, 22px) !important; height: var(--ff-standard-grid-pager-height, 22px) !important; max-height: var(--ff-standard-grid-pager-height, 22px) !important; min-height: var(--ff-standard-grid-pager-height, 22px) !important; overflow: hidden !important; overflow-x: visible !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-pager, .dx-pager) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-scrollable-content) { max-height: var(--ff-standard-grid-pager-height, 22px) !important; min-height: 0 !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-pager, .dx-pager) :is(.dx-scrollable-scrollbar, .dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; visibility: hidden !important; } /* Absolute-final View Tracking sticky columns. Keep selector, eye, TrackID, and Waybill # on the CSS-sticky v26 path with opaque cells so horizontally scrolled text cannot show through. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint.ff-standard-grid-page { --ff-v26-sticky-action-width: 42px !important; --ff-v26-sticky-key-width: 82px !important; --ff-v26-sticky-key2-width: 120px !important; --ff-v26-sticky-select-width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #fff !important; background-clip: border-box !important; border-right: 1px solid #d9dde5 !important; box-shadow: inset -1px 0 0 #d9dde5 !important; opacity: 1 !important; overflow: hidden !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-tracking-select-col, .ff-v26-sticky-select-col, .dx-command-select) { left: var(--ff-v26-sticky-select-left, 0px) !important; max-width: var(--ff-v26-sticky-select-width, 28px) !important; min-width: var(--ff-v26-sticky-select-width, 28px) !important; width: var(--ff-v26-sticky-select-width, 28px) !important; z-index: 28 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-tracking-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { left: var(--ff-v26-sticky-action-left) !important; max-width: var(--ff-v26-sticky-action-width, 32px) !important; min-width: var(--ff-v26-sticky-action-width, 32px) !important; width: var(--ff-v26-sticky-action-width, 32px) !important; z-index: 27 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-tracking-trackid-col, .ff-v26-sticky-key-col) { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width, 82px) !important; min-width: var(--ff-v26-sticky-key-width, 82px) !important; text-align: right !important; width: var(--ff-v26-sticky-key-width, 82px) !important; z-index: 26 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-tracking-waybill-col, .ff-v26-sticky-key2-col) { left: var(--ff-v26-sticky-key2-left) !important; max-width: var(--ff-v26-sticky-key2-width, 120px) !important; min-width: var(--ff-v26-sticky-key2-width, 120px) !important; width: var(--ff-v26-sticky-key2-width, 120px) !important; z-index: 25 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #347cf5 !important; color: #fff !important; z-index: 36 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #fff !important; color: inherit !important; z-index: 30 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #fff !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #f6f6f6 !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #fff4bf !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-tracking-select-col, .ff-tracking-command-col, .ff-tracking-trackid-col, .ff-tracking-waybill-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: #fff0a6 !important; } /* Absolute-final View Payments finance filter sizing. Date Period uses the accepted View Waybills width: 214px. Keep Branch directly after Date Range, and keep Client at 2x Acc # width. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card { --ff-payments-payment-id-width-final: 166px; --ff-payments-date-period-width-final: 214px; --ff-payments-date-range-width-final: 360px; --ff-payments-date-gap-final: 8px; --ff-payments-branch-width-final: 206px; --ff-payments-acc-width-final: 244px; --ff-payments-client-width-final: calc(var(--ff-payments-acc-width-final) * 2); } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-payment-id { flex: 0 0 var(--ff-payments-payment-id-width-final) !important; max-width: var(--ff-payments-payment-id-width-final) !important; min-width: var(--ff-payments-payment-id-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block { --ff-filter-date-period-width-final: var(--ff-payments-date-period-width-final); --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: var(--ff-payments-date-range-width-final); flex: 0 0 calc(var(--ff-payments-date-period-width-final) + var(--ff-payments-date-gap-final) + var(--ff-payments-date-range-width-final)) !important; max-width: calc(var(--ff-payments-date-period-width-final) + var(--ff-payments-date-gap-final) + var(--ff-payments-date-range-width-final)) !important; min-width: calc(var(--ff-payments-date-period-width-final) + var(--ff-payments-date-gap-final) + var(--ff-payments-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row { align-items: flex-start !important; column-gap: var(--ff-payments-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-period { flex: 0 0 var(--ff-payments-date-period-width-final) !important; max-width: var(--ff-payments-date-period-width-final) !important; min-width: var(--ff-payments-date-period-width-final) !important; width: var(--ff-payments-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range { flex: 0 0 var(--ff-payments-date-range-width-final) !important; max-width: var(--ff-payments-date-range-width-final) !important; min-width: var(--ff-payments-date-range-width-final) !important; width: var(--ff-payments-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 var(--ff-payments-branch-width-final) !important; margin-left: 0 !important; max-width: var(--ff-payments-branch-width-final) !important; min-width: var(--ff-payments-branch-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 0 0 var(--ff-payments-client-width-final) !important; max-width: var(--ff-payments-client-width-final) !important; min-width: var(--ff-payments-client-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-group { flex: 1 1 auto !important; max-width: none !important; min-width: min(100%, 746px) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card :is(.ff-finance-batch-filter, .ff-finance-waybill-filter, .ff-finance-ref-filter) { flex: 0 0 var(--ff-payments-acc-width-final) !important; max-width: var(--ff-payments-acc-width-final) !important; min-width: var(--ff-payments-acc-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card :is(.ff-finance-user-filter, .ff-finance-webuser-filter) { flex: 1 1 244px !important; max-width: none !important; min-width: 220px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-acc-filter { flex: 0 0 var(--ff-payments-acc-width-final) !important; max-width: var(--ff-payments-acc-width-final) !important; min-width: var(--ff-payments-acc-width-final) !important; } @media (max-width: 1120px) { html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-group { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; } } /* Absolute-final Credit/Debit and Debtors date filter alignment. Date Period uses the accepted View Waybills width: 214px. Keep Date Period and Date Range on the same row without changing View Invoices. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card { --ff-crdr-batch-field-width-final: 244px; --ff-crdr-client-field-width-final: 488px; --ff-crdr-date-period-width-final: 214px; --ff-crdr-date-range-width-final: 360px; --ff-crdr-date-gap-final: 8px; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row::before, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > :first-child { flex: 0 0 164px !important; max-width: 164px !important; min-width: 164px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block { --ff-filter-date-period-width-final: var(--ff-crdr-date-period-width-final); --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: var(--ff-crdr-date-range-width-final); flex: 0 0 calc(var(--ff-crdr-date-period-width-final) + var(--ff-crdr-date-gap-final) + var(--ff-crdr-date-range-width-final)) !important; max-width: calc(var(--ff-crdr-date-period-width-final) + var(--ff-crdr-date-gap-final) + var(--ff-crdr-date-range-width-final)) !important; min-width: calc(var(--ff-crdr-date-period-width-final) + var(--ff-crdr-date-gap-final) + var(--ff-crdr-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row { align-items: flex-start !important; column-gap: var(--ff-crdr-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block .ff-finance-date-period { flex: 0 0 var(--ff-crdr-date-period-width-final) !important; max-width: var(--ff-crdr-date-period-width-final) !important; min-width: var(--ff-crdr-date-period-width-final) !important; width: var(--ff-crdr-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block .ff-finance-date-range { flex: 0 0 var(--ff-crdr-date-range-width-final) !important; max-width: var(--ff-crdr-date-range-width-final) !important; min-width: var(--ff-crdr-date-range-width-final) !important; width: var(--ff-crdr-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 206px !important; margin-left: 0 !important; max-width: 206px !important; min-width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 0 0 var(--ff-crdr-client-field-width-final) !important; max-width: var(--ff-crdr-client-field-width-final) !important; min-width: var(--ff-crdr-client-field-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card :is(.ff-finance-batch-filter, .ff-finance-waybill-filter, .ff-finance-ref-filter) { flex: 0 0 var(--ff-crdr-batch-field-width-final) !important; max-width: var(--ff-crdr-batch-field-width-final) !important; min-width: var(--ff-crdr-batch-field-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card { --ff-debtors-date-period-width-final: 214px; --ff-debtors-date-range-width-final: 360px; --ff-debtors-date-gap-final: 8px; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid::before, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid::after, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row::before, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block { --ff-filter-date-period-width-final: var(--ff-debtors-date-period-width-final); --ff-filter-date-period-ignore-width-final: 62px; --ff-filter-date-range-width-final: var(--ff-debtors-date-range-width-final); flex: 0 0 calc(var(--ff-debtors-date-period-width-final) + var(--ff-debtors-date-gap-final) + var(--ff-debtors-date-range-width-final)) !important; max-width: calc(var(--ff-debtors-date-period-width-final) + var(--ff-debtors-date-gap-final) + var(--ff-debtors-date-range-width-final)) !important; min-width: calc(var(--ff-debtors-date-period-width-final) + var(--ff-debtors-date-gap-final) + var(--ff-debtors-date-range-width-final)) !important; order: 1 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row { align-items: flex-start !important; column-gap: var(--ff-debtors-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-filter-date-period { flex: 0 0 var(--ff-debtors-date-period-width-final) !important; max-width: var(--ff-debtors-date-period-width-final) !important; min-width: var(--ff-debtors-date-period-width-final) !important; width: var(--ff-debtors-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range { flex: 0 0 var(--ff-debtors-date-range-width-final) !important; max-width: var(--ff-debtors-date-range-width-final) !important; min-width: var(--ff-debtors-date-range-width-final) !important; width: var(--ff-debtors-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-acc-field { flex: 0 0 150px !important; max-width: 150px !important; order: 3 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-client-field { flex: 0 0 360px !important; max-width: 360px !important; order: 4 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-branch-field { flex: 0 0 240px !important; margin-left: 0 !important; max-width: 240px !important; min-width: 240px !important; order: 2 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-list-field { flex: 1 1 360px !important; max-width: none !important; order: 10 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-show-dormant { order: 11 !important; } @media (max-width: 1120px) { html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-client-field, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-list-field { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; } } /* True-EOF View Invoices finance primary filter spacing. Keep Branch directly after Date Range with the accepted date-field standard. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card { --ff-invoices-invoice-number-width-final: 188px; --ff-invoices-date-period-width-final: 172px; --ff-invoices-date-period-ignore-width-final: 78px; --ff-invoices-date-range-width-final: 216px; --ff-invoices-date-gap-final: 12px; --ff-invoices-branch-width-final: 224px; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 12px !important; margin-left: 0 !important; margin-right: 0 !important; position: relative !important; width: 100% !important; z-index: 30 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters:has(.ui-select-container.open), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters:has(.ui-select-bootstrap.open) { z-index: 3200 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-secondary-filters, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-filter-actions-row { position: relative !important; z-index: 1 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block > .row::before, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block > .row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block > .row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-invoice-number { flex: 0 0 var(--ff-invoices-invoice-number-width-final) !important; max-width: var(--ff-invoices-invoice-number-width-final) !important; min-width: var(--ff-invoices-invoice-number-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block { --ff-filter-date-gap-final: var(--ff-invoices-date-gap-final); --ff-filter-date-period-width-final: var(--ff-invoices-date-period-width-final); --ff-filter-date-period-ignore-width-final: var(--ff-invoices-date-period-ignore-width-final); --ff-filter-date-range-width-final: var(--ff-invoices-date-range-width-final); flex: 0 0 calc(var(--ff-invoices-date-period-width-final) + var(--ff-invoices-date-gap-final) + var(--ff-invoices-date-range-width-final)) !important; max-width: calc(var(--ff-invoices-date-period-width-final) + var(--ff-invoices-date-gap-final) + var(--ff-invoices-date-range-width-final)) !important; min-width: calc(var(--ff-invoices-date-period-width-final) + var(--ff-invoices-date-gap-final) + var(--ff-invoices-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block > .row { align-items: flex-start !important; column-gap: var(--ff-invoices-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; gap: 5px var(--ff-invoices-date-gap-final) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period { flex: 0 0 var(--ff-invoices-date-period-width-final) !important; max-width: var(--ff-invoices-date-period-width-final) !important; min-width: var(--ff-invoices-date-period-width-final) !important; width: var(--ff-invoices-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-group { box-sizing: border-box !important; max-width: var(--ff-invoices-date-period-width-final) !important; min-width: var(--ff-invoices-date-period-width-final) !important; width: var(--ff-invoices-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-invoices-date-period-ignore-width-final) !important; max-width: var(--ff-invoices-date-period-ignore-width-final) !important; min-width: var(--ff-invoices-date-period-ignore-width-final) !important; padding-left: 4px !important; padding-right: 3px !important; width: var(--ff-invoices-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: var(--ff-invoices-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period #ignoreDate + label.ff-date-period-ignore-label::before { border-radius: 4px !important; height: 16px !important; left: 5px !important; top: 50% !important; transform: translateY(-50%) !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period #ignoreDate + label.ff-date-period-ignore-label::after { height: 4px !important; left: 9px !important; top: 50% !important; transform: translateY(-70%) rotate(-45deg) !important; width: 8px !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-select { flex: 0 0 calc(var(--ff-invoices-date-period-width-final) - var(--ff-invoices-date-period-ignore-width-final)) !important; max-width: calc(var(--ff-invoices-date-period-width-final) - var(--ff-invoices-date-period-ignore-width-final)) !important; min-width: 0 !important; padding-left: 5px !important; padding-right: 16px !important; width: calc(var(--ff-invoices-date-period-width-final) - var(--ff-invoices-date-period-ignore-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group > label { flex: 0 0 auto !important; line-height: 18px !important; margin-bottom: 0 !important; max-width: 100% !important; min-height: 18px !important; white-space: nowrap !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker { align-items: stretch !important; display: flex !important; flex-direction: row !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range { flex: 0 0 var(--ff-invoices-date-range-width-final) !important; max-width: var(--ff-invoices-date-range-width-final) !important; min-width: var(--ff-invoices-date-range-width-final) !important; width: var(--ff-invoices-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-invoices-date-range-width-final) !important; min-width: var(--ff-invoices-date-range-width-final) !important; width: var(--ff-invoices-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker :is(.input-icon, .form-control) { box-sizing: border-box !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 var(--ff-invoices-branch-width-final) !important; max-width: var(--ff-invoices-branch-width-final) !important; min-width: var(--ff-invoices-branch-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 1 1 360px !important; max-width: none !important; min-width: 300px !important; overflow: visible !important; position: relative !important; z-index: 31 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter:has(.ui-select-container.open), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter:has(.ui-select-bootstrap.open), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter .ui-select-container.open, html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter .ui-select-bootstrap.open { z-index: 3300 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter :is(.form-group, .ui-select-container, .ui-select-bootstrap) { overflow: visible !important; } /* True-EOF View Images pager target guard. Older image-grid pager rules also target the selected page; keep the spinner only on the clicked page/page-size option. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target) { color: inherit !important; cursor: pointer !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-pager-loading .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection):not(.ff-standard-grid-pager-loading-target)::after { animation: none !important; content: none !important; display: none !important; visibility: hidden !important; } /* Absolute-final View Images filter spacing and grid height. Keep Branch close to Date Range and add roughly 4.5 compact rows. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-sr-card { --ff-image-date-gap-final: 8px; --ff-image-date-period-width-final: 166px; --ff-image-date-range-width-final: 248px; --ff-image-branch-width-final: 360px; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 4px var(--ff-image-date-gap-final) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row::after, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::before, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-filter-top-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row > [class*="col-"] { float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-block { --ff-filter-date-period-width-final: var(--ff-image-date-period-width-final); --ff-filter-date-range-width-final: var(--ff-image-date-range-width-final); flex: 0 0 calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; max-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; min-width: calc(var(--ff-image-date-period-width-final) + var(--ff-image-date-gap-final) + var(--ff-image-date-range-width-final)) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-row { align-items: flex-start !important; column-gap: var(--ff-image-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-period { flex: 0 0 var(--ff-image-date-period-width-final) !important; max-width: var(--ff-image-date-period-width-final) !important; min-width: var(--ff-image-date-period-width-final) !important; width: var(--ff-image-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-date-range { flex: 0 0 var(--ff-image-date-range-width-final) !important; max-width: var(--ff-image-date-range-width-final) !important; min-width: var(--ff-image-date-range-width-final) !important; width: var(--ff-image-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list .ff-image-branch-field { flex: 0 0 var(--ff-image-branch-width-final) !important; max-width: var(--ff-image-branch-width-final) !important; min-width: 240px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 252px), 850px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 272px), 850px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 252px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 272px) !important; } } /* True-EOF View Images selector paint. Keep the row selector centered in compact image rows and avoid transition work when DevExtreme flips checked/unchecked state. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) { left: var(--ff-v26-sticky-select-left, 0px) !important; max-width: var(--ff-v26-sticky-select-width, 28px) !important; min-width: var(--ff-v26-sticky-select-width, 28px) !important; padding: 0 !important; position: sticky !important; vertical-align: middle !important; width: var(--ff-v26-sticky-select-width, 28px) !important; z-index: 24 !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-headers .dx-header-row :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) { z-index: 34 !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) :is(.dx-checkbox.dx-widget, .dx-select-checkbox) { bottom: auto !important; left: 50% !important; margin: 0 !important; position: absolute !important; right: auto !important; top: 50% !important; transform: translate(-50%, -50%) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, .dx-checkbox-icon) { animation: none !important; transition: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td.dx-command-select, th.dx-command-select, .ff-image-select-col) .dx-checkbox-icon::before { transition: none !important; } /* EOF Tariffs layout and fixed-pane guard. Keep the filter rows predictable and prevent fixed DevExtreme panes from stretching over the scrollable tariff data rows. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(487px, min(calc(145dvh - 394px), calc(100dvh - 120px)), 1543px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(487px, min(calc(145dvh - 418px), calc(100dvh - 140px)), 1543px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel { --ff-tariff-filter-gap-x: 10px; --ff-tariff-filter-gap-y: 4px; --ff-tariff-filter-default-width: 236px; --ff-tariff-filter-narrow-width: 118px; --ff-tariff-filter-short-width: 154px; --ff-tariff-filter-date-width: 220px; --ff-tariff-filter-client-width: 590px; --ff-tariff-filter-rate-code-width: 236px; --ff-tariff-filter-top-recs-width: 70px; --ff-tariff-filter-search-width: 150px; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page > .container-fullw > .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--closed, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page > .container-fluid.container-fullw > .ff-standard-filter-overlay-row.ff-standard-filter-overlay-row--closed { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend { display: block !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: var(--ff-tariff-filter-gap-y) var(--ff-tariff-filter-gap-x) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::before, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"] { box-sizing: border-box !important; flex: 0 0 var(--ff-tariff-filter-default-width) !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; max-width: var(--ff-tariff-filter-default-width) !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-tariff-filter-default-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-id-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-category-field { flex-basis: var(--ff-tariff-filter-narrow-width) !important; max-width: var(--ff-tariff-filter-narrow-width) !important; width: var(--ff-tariff-filter-narrow-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-effective-date { flex-basis: var(--ff-tariff-filter-date-width) !important; max-width: var(--ff-tariff-filter-date-width) !important; width: var(--ff-tariff-filter-date-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-account-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-area-from, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-area-to, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-from-pc-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-to-pc-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-from-kgs-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-to-kgs-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-ring-code-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-non-doc-field, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-zone-field { flex-basis: var(--ff-tariff-filter-short-width) !important; max-width: var(--ff-tariff-filter-short-width) !important; width: var(--ff-tariff-filter-short-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-client-field { flex-basis: var(--ff-tariff-filter-client-width) !important; max-width: var(--ff-tariff-filter-client-width) !important; width: var(--ff-tariff-filter-client-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-rate-code-field { flex-basis: var(--ff-tariff-filter-rate-code-width) !important; max-width: var(--ff-tariff-filter-rate-code-width) !important; width: var(--ff-tariff-filter-rate-code-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-top-recs-field { flex-basis: var(--ff-tariff-filter-top-recs-width) !important; max-width: var(--ff-tariff-filter-top-recs-width) !important; width: var(--ff-tariff-filter-top-recs-width) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { align-self: flex-end !important; display: flex !important; flex: 1 1 320px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 260px !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex: 0 1 auto !important; flex-wrap: nowrap !important; gap: 6px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin-left: 0 !important; margin-right: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 var(--ff-tariff-filter-search-width) !important; max-width: var(--ff-tariff-filter-search-width) !important; min-width: var(--ff-tariff-filter-search-width) !important; width: var(--ff-tariff-filter-search-width) !important; } @media (max-width: 900px) { html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel { --ff-tariff-filter-client-width: 100%; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page .ff-tariff-filter-panel .ff-filter-footer-actions { flex: 1 1 100% !important; max-width: none !important; width: 100% !important; } } /* Query recent items are a vertical history list, not a horizontal scroller. */ html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-inner { align-items: stretch !important; display: flex !important; flex-direction: column !important; gap: 4px !important; height: auto !important; max-height: var(--ff-query-recent-list-max-height, 142px) !important; min-height: 0 !important; overflow-x: hidden !important; overflow-y: auto !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-item { display: flex !important; flex: 0 0 auto !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-select, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-select .ui-select-container, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-select .ui-select-match, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query .ff-query-recent-select .ui-select-toggle { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } /* Query must stay below app chrome; the sidebar owns its flyout z-index/overflow. */ html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-query-grid-page { isolation: isolate !important; position: relative !important; z-index: 0 !important; } @media (min-width: 992px) { html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) #sidebar.app-aside, html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) .ff-shell #sidebar.app-aside, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) #sidebar.app-aside, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) .app-aside { pointer-events: auto !important; z-index: 40000 !important; } html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) #sidebar.app-aside .sidebar-container, html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) #sidebar.app-aside .main-navigation-menu, html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) #sidebar.app-aside > .item-inner, html body.ff-app.ff-app.ff-app #app:not(.app-sidebar-hidden) #sidebar.app-aside > ul.sub-menu, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) #sidebar.app-aside .sidebar-container, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) #sidebar.app-aside .main-navigation-menu, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) .app-aside > .item-inner, html body.ff-app.ff-app.ff-app:not(.app-sidebar-hidden) .app-aside > ul.sub-menu { pointer-events: auto !important; } html body.ff-app.ff-app.ff-app #app.app-sidebar-closed:not(.app-sidebar-hidden) #sidebar.app-aside > .item-inner, html body.ff-app.ff-app.ff-app #app.app-sidebar-closed:not(.app-sidebar-hidden) #sidebar.app-aside > ul.sub-menu, html body.ff-app.ff-app.ff-app.app-sidebar-closed:not(.app-sidebar-hidden) .app-aside > .item-inner, html body.ff-app.ff-app.ff-app.app-sidebar-closed:not(.app-sidebar-hidden) .app-aside > ul.sub-menu { pointer-events: auto !important; z-index: 40001 !important; } } html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-query.ff-view-query)::before, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-query.ff-view-query)::after { pointer-events: none !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query-grid-page .ff-query-select-row { position: relative !important; z-index: 20 !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-query-grid-page .ff-query-select-row .ui-select-container.open { z-index: 1200 !important; } /* Final date filter parity: View Quotes, View Credit/Debit, and View Tracking. Match the accepted View Waybills date controls exactly: Date Period 164px = 78px Ignore + 86px period select. Date Range 216px = 96px From + 24px "to" + 96px To. Keep the Date Period and Date Range beside each other with a small gap. */ html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block > .row { align-items: flex-start !important; column-gap: 8px !important; display: flex !important; flex-wrap: nowrap !important; gap: 3px 8px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-primary-filters > .ff-finance-date-block { --ff-filter-date-period-width-final: 164px; --ff-filter-date-period-ignore-width-final: 78px; --ff-filter-date-range-width-final: 216px; flex: 0 0 388px !important; max-width: 388px !important; min-width: 388px !important; width: 388px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid > .ff-filter-date-period, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 164px !important; max-width: 164px !important; min-width: 164px !important; width: 164px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 164px !important; min-width: 164px !important; width: 164px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period .ff-date-period-ignore { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::before { border-radius: 4px !important; height: 16px !important; left: 5px !important; top: 50% !important; transform: translateY(-50%) !important; width: 16px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label::after { height: 4px !important; left: 9px !important; top: 50% !important; transform: translateY(-70%) rotate(-45deg) !important; width: 8px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period .ff-date-period-select { flex: 0 0 86px !important; max-width: 86px !important; min-width: 86px !important; padding-left: 5px !important; padding-right: 16px !important; width: 86px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid > .ff-filter-date-range, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-range { align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 216px !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-range .range-picker, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) :is(.ff-filter-date-range, .ff-finance-date-range) .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) :is(.ff-filter-date-range, .ff-finance-date-range) .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) :is(.ff-filter-date-range, .ff-finance-date-range) .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } /* Final date filter spacing pass: keep View Quotes, Credits/Debits, and Tracking on the same date-control geometry. */ html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid, html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-view-tracking .ff-waybill-filter-grid, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block > .row { column-gap: 12px !important; gap: 5px 12px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-waybill-filter-grid > .ff-filter-date-type { flex: 0 0 194px !important; max-width: 194px !important; min-width: 194px !important; width: 194px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-type > .form-group, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes .ff-filter-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 194px !important; min-width: 0 !important; width: 194px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) :is(.ff-filter-date-period, .ff-filter-date-range) > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) :is(.ff-filter-date-period, .ff-filter-date-range) > .form-group > label, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-filter-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-range .range-picker, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-range .range-picker { flex-direction: row !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-primary-filters > .ff-finance-date-block { flex-basis: 392px !important; max-width: 392px !important; min-width: 392px !important; width: 392px !important; } /* Accepted date filter sizing standard. Date Type: 136px. Date Period: 172px with a 94px text/select side. Date Range: 216px from the final View Waybills/View Quotes standard. */ html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid > .ff-filter-date-type { flex-basis: 136px !important; max-width: 136px !important; min-width: 136px !important; width: 136px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-type > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { max-width: 136px !important; width: 136px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-waybill-filter-grid > .ff-filter-date-period, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period { flex-basis: 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking) .ff-filter-date-period .ff-date-period-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-date-block .ff-finance-date-period .ff-date-period-group { max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-quotes.ff-view-quotes, .ff-view-tracking.ff-view-tracking, .ff-view-crdr.ff-view-crdr) .ff-filter-date-period .ff-date-period-select { flex-basis: 94px !important; max-width: 94px !important; min-width: 94px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-finance-primary-filters > .ff-finance-date-block { flex-basis: 400px !important; max-width: 400px !important; min-width: 400px !important; width: 400px !important; } /* Credits/Debits finance date block: this nested Bootstrap row needs an explicit two-column layout so Date Range stays beside Date Period. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block { box-sizing: border-box !important; flex: 0 0 400px !important; max-width: 400px !important; min-width: 400px !important; width: 400px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row { align-items: flex-start !important; box-sizing: border-box !important; column-gap: 12px !important; display: grid !important; grid-template-columns: 172px 216px !important; margin-left: 0 !important; margin-right: 0 !important; max-width: 400px !important; min-width: 400px !important; row-gap: 0 !important; width: 400px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-period, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-range { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-period { grid-column: 1 !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-range { grid-column: 2 !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } /* Credits/Debits final layout lock. Flatten the nested finance date wrapper so Date Period and Date Range are ordinary siblings in the main filter row, matching the working invoice finance-filter pattern and preventing the Date Range from stacking below. */ body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block, body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row { display: contents !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row::before, body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row::after { content: none !important; display: none !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-range { flex: 0 0 216px !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-period, body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-date-block > .row > .ff-finance-date-range { float: none !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } /* CR/DR now renders Date Period and Date Range directly in the primary filter row; keep those direct fields on the accepted date standard. */ body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-period--crdr { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-range--crdr { flex: 0 0 216px !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-period--crdr, body.ff-app .ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-range--crdr { float: none !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } /* View Manifests date-field playbook. Use the accepted View Quotes/View Tracking standard and override the older manifest-specific compact widths that left labels and controls misaligned. Manifest Date needs the wider 204px Date Type slot to avoid truncation. */ body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-filter-row { align-items: flex-start !important; column-gap: 12px !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 12px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-filter-row > :is(.ff-manifest-date-type, .ff-manifest-date-period, .ff-manifest-date-range) { float: none !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-filter-row > .ff-manifest-date-type { flex: 0 0 204px !important; max-width: 204px !important; min-width: 204px !important; width: 204px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-type > .form-group, body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-type :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 204px !important; min-width: 0 !important; width: 204px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-filter-row > .ff-manifest-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period > .form-group, body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period .ff-date-period-group { box-sizing: border-box !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period .ff-date-period-group { align-items: stretch !important; display: flex !important; grid-template-columns: none !important; height: var(--ff-control-h) !important; max-height: var(--ff-control-h) !important; min-height: var(--ff-control-h) !important; overflow: visible !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period .ff-date-period-ignore { align-items: center !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period #ignoreDate + label.ff-date-period-ignore-label::before { border-radius: 4px !important; height: 16px !important; left: 5px !important; top: 50% !important; transform: translateY(-50%) !important; width: 16px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period #ignoreDate + label.ff-date-period-ignore-label::after { height: 4px !important; left: 9px !important; top: 50% !important; transform: translateY(-70%) rotate(-45deg) !important; width: 8px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-period .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-filter-row > .ff-manifest-date-range { box-sizing: border-box !important; flex: 0 0 228px !important; margin-left: 0 !important; max-width: 228px !important; min-width: 228px !important; padding-left: 12px !important; width: 228px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-range > .form-group, body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) :is(.ff-manifest-date-period, .ff-manifest-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) :is(.ff-manifest-date-period, .ff-manifest-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } body.ff-app :is(.ff-view-manifests.ff-view-manifests, .ff-view-manifests-simple.ff-view-manifests-simple) .ff-manifest-date-range .range-picker :is(.input-icon, .form-control) { box-sizing: border-box !important; min-width: 0 !important; width: 100% !important; } /* True-final Debtors date filter layout. Flatten the nested date row so Date Period, Date Range, Branch, Acc #, and Client flow as ordinary siblings in the main filter row. */ html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid { --ff-debtors-date-gap-final: 6px; align-items: flex-start !important; column-gap: var(--ff-debtors-date-gap-final) !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-debtors-date-gap-final) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid::before, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid::after, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row::before, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block > .ff-filter-inline-row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-filter-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; order: 10 !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range { flex: 0 0 216px !important; max-width: 216px !important; min-width: 216px !important; order: 11 !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-branch-field { flex: 0 0 240px !important; margin-left: 0 !important; max-width: 240px !important; min-width: 240px !important; order: 12 !important; width: 240px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-acc-field { flex: 0 0 150px !important; max-width: 150px !important; min-width: 150px !important; order: 13 !important; width: 150px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-client-field { flex: 1 1 360px !important; max-width: none !important; min-width: 320px !important; order: 14 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-list-field { flex: 1 1 360px !important; max-width: none !important; min-width: 260px !important; order: 30 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-show-dormant { order: 31 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block :is(.ff-filter-date-period, .ff-debtors-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block :is(.ff-filter-date-period, .ff-debtors-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-filter-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-date-period-ignore { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-date-block .ff-debtors-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } /* Absolute-last Debtors primary filter run. Date Period and Date Range are direct siblings here so the following filters can continue on the same desktop row instead of wrapping below the dates. */ html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid { --ff-debtors-acc-width-final: 150px; --ff-debtors-branch-width-final: 240px; --ff-debtors-client-width-final: 360px; --ff-debtors-date-gap-final: 6px; --ff-debtors-date-period-width-final: 172px; --ff-debtors-date-range-width-final: 216px; --ff-debtors-list-width-final: 120px; --ff-debtors-show-dormant-width-final: 132px; align-items: flex-start !important; column-gap: var(--ff-debtors-date-gap-final) !important; display: flex !important; flex-wrap: nowrap !important; gap: 5px var(--ff-debtors-date-gap-final) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; overflow-x: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period { flex: 0 0 var(--ff-debtors-date-period-width-final) !important; max-width: var(--ff-debtors-date-period-width-final) !important; min-width: var(--ff-debtors-date-period-width-final) !important; order: 10 !important; width: var(--ff-debtors-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range { flex: 0 0 var(--ff-debtors-date-range-width-final) !important; max-width: var(--ff-debtors-date-range-width-final) !important; min-width: var(--ff-debtors-date-range-width-final) !important; order: 11 !important; width: var(--ff-debtors-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-branch-field { flex: 0 0 var(--ff-debtors-branch-width-final) !important; max-width: var(--ff-debtors-branch-width-final) !important; min-width: var(--ff-debtors-branch-width-final) !important; order: 12 !important; width: var(--ff-debtors-branch-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-acc-field { flex: 0 0 var(--ff-debtors-acc-width-final) !important; max-width: var(--ff-debtors-acc-width-final) !important; min-width: var(--ff-debtors-acc-width-final) !important; order: 13 !important; width: var(--ff-debtors-acc-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-client-field { flex: 0 0 var(--ff-debtors-client-width-final) !important; max-width: var(--ff-debtors-client-width-final) !important; min-width: var(--ff-debtors-client-width-final) !important; order: 14 !important; width: var(--ff-debtors-client-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card :is(.ff-debtors-invoice-list-field, .ff-debtors-id-list-field) { flex: 0 0 var(--ff-debtors-list-width-final) !important; max-width: var(--ff-debtors-list-width-final) !important; min-width: var(--ff-debtors-list-width-final) !important; order: 15 !important; width: var(--ff-debtors-list-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-id-list-field { order: 16 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-show-dormant { align-self: flex-end !important; flex: 0 0 var(--ff-debtors-show-dormant-width-final) !important; max-width: var(--ff-debtors-show-dormant-width-final) !important; min-width: var(--ff-debtors-show-dormant-width-final) !important; order: 17 !important; padding-bottom: 5px !important; width: var(--ff-debtors-show-dormant-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > :is(.ff-debtors-date-period, .ff-debtors-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > :is(.ff-debtors-date-period, .ff-debtors-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-debtors-date-period-width-final) !important; min-width: var(--ff-debtors-date-period-width-final) !important; width: var(--ff-debtors-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period .ff-date-period-ignore { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-period .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: var(--ff-debtors-date-range-width-final) !important; min-width: var(--ff-debtors-date-range-width-final) !important; width: var(--ff-debtors-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid > .ff-debtors-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } @media (max-width: 1500px) { html body.ff-app.ff-app.ff-app .ff-debtors.ff-debtors .ff-sr-card .ff-debtors-filter-grid { flex-wrap: wrap !important; } } /* True-final View Credits primary filter compaction. CR/DR renders Date Period and Date Range as direct siblings; keep Branch and Client directly after Date Range with only the narrow date-field gap. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters { --ff-crdr-date-pair-gap-final: 6px; align-items: flex-start !important; column-gap: var(--ff-crdr-date-pair-gap-final) !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-crdr-date-pair-gap-final) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .col-md-2:first-child:not(.ff-finance-branch-filter) { flex: 0 0 188px !important; max-width: 188px !important; min-width: 188px !important; order: 10 !important; width: 188px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-period--crdr { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; order: 20 !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-range--crdr { flex: 0 0 216px !important; margin-left: 0 !important; max-width: 216px !important; min-width: 216px !important; order: 21 !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 206px !important; margin-left: 0 !important; max-width: 206px !important; min-width: 206px !important; order: 22 !important; width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 1 1 360px !important; margin-left: 0 !important; max-width: none !important; min-width: 320px !important; order: 23 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > :is(.ff-finance-date-period--crdr, .ff-finance-date-range--crdr) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-primary-filters > :is(.ff-finance-date-period--crdr, .ff-finance-date-range--crdr) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-period--crdr > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-period--crdr .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-range--crdr > .form-group, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr .ff-sr-card .ff-finance-date-range--crdr .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } /* True-final View Payments date filter layout. Same fix as Debtors: flatten the nested finance date block so Date Range sits beside Date Period and the fields after it continue in the same row. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters { --ff-payments-date-pair-gap-final: 6px; align-items: flex-start !important; column-gap: var(--ff-payments-date-pair-gap-final) !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-payments-date-pair-gap-final) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-date-block, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-payment-id { flex: 0 0 188px !important; max-width: 188px !important; min-width: 188px !important; order: 10 !important; width: 188px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-period { flex: 0 0 172px !important; max-width: 172px !important; min-width: 172px !important; order: 20 !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range { flex: 0 0 216px !important; margin-left: 0 !important; max-width: 216px !important; min-width: 216px !important; order: 21 !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 206px !important; margin-left: 0 !important; max-width: 206px !important; min-width: 206px !important; order: 22 !important; width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 1 1 360px !important; margin-left: 0 !important; max-width: none !important; min-width: 320px !important; order: 23 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group { align-items: flex-start !important; display: flex !important; flex-direction: column !important; gap: 2px !important; justify-content: flex-start !important; margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block :is(.ff-finance-date-period, .ff-finance-date-range) > .form-group > label { line-height: 18px !important; margin-bottom: 0 !important; min-height: 18px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-period .ff-date-period-group { box-sizing: border-box !important; display: flex !important; max-width: 172px !important; min-width: 172px !important; width: 172px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-date-period-ignore { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; padding-left: 4px !important; padding-right: 3px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-date-period-ignore-label { font-size: 11px !important; padding-left: 36px !important; position: relative !important; white-space: nowrap !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; padding-left: 5px !important; padding-right: 16px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker { box-sizing: border-box !important; display: flex !important; max-width: 216px !important; min-width: 216px !important; width: 216px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker :is(.start-date, .end-date) { box-sizing: border-box !important; flex: 0 0 96px !important; max-width: 96px !important; min-width: 0 !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker > .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 24px !important; justify-content: center !important; max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range .range-picker :is(.input-icon, .form-control) { min-width: 0 !important; width: 100% !important; } /* True-final Debriefing filter layout. Debriefing keeps the standard date fields, but needs the wider Branch list and the action controls on the same row as Geocoded. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-branch { flex: 0 0 330px !important; max-width: 330px !important; min-width: 330px !important; width: 330px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-branch > .form-group, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-waybill-filter-grid > .ff-filter-branch :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 330px !important; min-width: 0 !important; width: 330px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 8px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-schedule { align-self: flex-start !important; flex: 0 0 170px !important; max-width: 170px !important; min-width: 170px !important; order: 10 !important; width: 170px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-invoice { align-self: flex-start !important; flex: 0 0 188px !important; max-width: 188px !important; min-width: 188px !important; order: 11 !important; width: 188px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-schedule > label, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-invoice label { line-height: 18px !important; margin-bottom: 1px !important; min-height: 20px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-schedule :is(.ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices), html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-admin-id-row > .ff-filter-invoice textarea.form-control { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-waybill-route-row > .ff-filter-bool-group { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row { align-items: flex-end !important; display: flex !important; flex-wrap: wrap !important; gap: 5px 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row > .ff-filter-bool { flex: 0 0 118px !important; max-width: 118px !important; min-width: 118px !important; padding-left: 0 !important; padding-right: 0 !important; width: 118px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row > :is(.ff-filter-bool-wide, .ff-filter-security) { flex: 0 0 136px !important; max-width: 136px !important; min-width: 136px !important; padding-left: 0 !important; padding-right: 0 !important; width: 136px !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row > .ff-filter-debriefing-inline-actions { align-self: flex-end !important; display: flex !important; flex: 1 1 360px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 360px !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions-row { align-items: center !important; display: flex !important; justify-content: flex-end !important; margin: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions-row::before, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions { align-items: center !important; display: flex !important; flex: 1 1 auto !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 0 !important; max-width: none !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions :is(.btn, .valuesonly, .checkbox) { float: none !important; margin-bottom: 0 !important; margin-left: 0 !important; margin-right: 0 !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-show-dormant { flex: 0 0 auto !important; order: 10 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-close, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-close:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; margin-left: 0 !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; order: 20 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-search { flex: 0 0 190px !important; margin-left: 0 !important; min-width: 190px !important; order: 30 !important; width: 190px !important; } @media (max-width: 900px) { html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-bool-group > .ff-filter-inline-row > .ff-filter-debriefing-inline-actions { flex: 1 1 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing .ff-filter-debriefing-inline-actions .ff-filter-actions { flex-wrap: wrap !important; } } /* Tariffs clean-baseline filter layout. This intentionally targets the new clean page class instead of .ff-tariffs, because .ff-tariffs also has legacy grid rules that collapsed tariff data rows. */ html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel { --ff-tariff-clean-gap-x: 10px; --ff-tariff-clean-gap-y: 4px; --ff-tariff-clean-small: 104px; --ff-tariff-clean-short: 128px; --ff-tariff-clean-normal: 210px; --ff-tariff-clean-medium: 250px; --ff-tariff-clean-client: 440px; --ff-tariff-clean-date: 250px; --ff-tariff-clean-search: 190px; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { display: block !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: var(--ff-tariff-clean-gap-y) var(--ff-tariff-clean-gap-x) !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row::after, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::after, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"] { box-sizing: border-box !important; flex: 0 0 var(--ff-tariff-clean-normal) !important; float: none !important; margin: 0 !important; max-width: var(--ff-tariff-clean-normal) !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-tariff-clean-normal) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-id-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-category-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-from-pc-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-to-pc-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-from-kgs-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-to-kgs-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-ring-code-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-non-doc-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-zone-field { flex-basis: var(--ff-tariff-clean-short) !important; max-width: var(--ff-tariff-clean-short) !important; width: var(--ff-tariff-clean-short) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-effective-date { flex-basis: var(--ff-tariff-clean-date) !important; max-width: var(--ff-tariff-clean-date) !important; width: var(--ff-tariff-clean-date) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-account-field { flex-basis: var(--ff-tariff-clean-short) !important; max-width: var(--ff-tariff-clean-short) !important; width: var(--ff-tariff-clean-short) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-type-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-service-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-agent-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-sender-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-receiver-field, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-rate-code-field { flex-basis: var(--ff-tariff-clean-medium) !important; max-width: var(--ff-tariff-clean-medium) !important; width: var(--ff-tariff-clean-medium) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-client-field { flex-basis: var(--ff-tariff-clean-client) !important; max-width: var(--ff-tariff-clean-client) !important; width: var(--ff-tariff-clean-client) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-top-recs-field { flex-basis: var(--ff-tariff-clean-small) !important; max-width: var(--ff-tariff-clean-small) !important; width: var(--ff-tariff-clean-small) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-area-from, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-area-to { flex-basis: var(--ff-tariff-clean-normal) !important; max-width: var(--ff-tariff-clean-normal) !important; width: var(--ff-tariff-clean-normal) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions { align-self: flex-end !important; display: flex !important; flex: 1 1 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; min-width: 460px !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex: 0 1 auto !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; max-width: 100% !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-close-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-control-h, 30px) !important; justify-content: center !important; max-width: var(--ff-control-h, 30px) !important; min-width: var(--ff-control-h, 30px) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-control-h, 30px) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 var(--ff-tariff-clean-search) !important; max-width: var(--ff-tariff-clean-search) !important; min-width: var(--ff-tariff-clean-search) !important; width: var(--ff-tariff-clean-search) !important; } @media (max-width: 900px) { html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions { flex: 1 1 100% !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { flex-wrap: wrap !important; } } /* Final Generate Invoice date filter sizing. Keep this page on the accepted date-filter standard without changing the shared operations filter or any DevExtreme grid sizing. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid { --ff-filter-date-gap-final: 12px; --ff-filter-date-period-width-final: 172px; --ff-filter-date-period-ignore-width-final: 78px; --ff-filter-date-period-select-width-final: 94px; --ff-filter-date-range-width-final: 216px; column-gap: var(--ff-filter-date-gap-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-period { flex: 0 0 var(--ff-filter-date-period-width-final) !important; max-width: var(--ff-filter-date-period-width-final) !important; min-width: var(--ff-filter-date-period-width-final) !important; width: var(--ff-filter-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period > .form-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-group { max-width: var(--ff-filter-date-period-width-final) !important; min-width: var(--ff-filter-date-period-width-final) !important; width: var(--ff-filter-date-period-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-ignore { flex: 0 0 var(--ff-filter-date-period-ignore-width-final) !important; max-width: var(--ff-filter-date-period-ignore-width-final) !important; min-width: var(--ff-filter-date-period-ignore-width-final) !important; width: var(--ff-filter-date-period-ignore-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-period .ff-date-period-select { flex: 0 0 var(--ff-filter-date-period-select-width-final) !important; max-width: var(--ff-filter-date-period-select-width-final) !important; min-width: 0 !important; width: var(--ff-filter-date-period-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-range { flex: 0 0 var(--ff-filter-date-range-width-final) !important; max-width: var(--ff-filter-date-range-width-final) !important; min-width: var(--ff-filter-date-range-width-final) !important; padding-left: 0 !important; width: var(--ff-filter-date-range-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range > .form-group, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-date-range .range-picker { max-width: var(--ff-filter-date-range-width-final) !important; min-width: var(--ff-filter-date-range-width-final) !important; width: var(--ff-filter-date-range-width-final) !important; } /* Generate Invoice final filter flow. Keep Client directly after Date Range, then start Branch on the next run with the remaining waybill filters continuing beside it. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card { --ff-invoice-filter-gap-final: 12px; --ff-invoice-filter-id-width-final: 210px; --ff-invoice-filter-client-width-final: 304px; --ff-invoice-filter-acc-width-final: 144px; --ff-invoice-filter-agent-width-final: 268px; --ff-invoice-filter-branch-width-final: 216px; --ff-invoice-filter-short-width-final: 140px; --ff-invoice-filter-text-width-final: 150px; --ff-invoice-filter-medium-width-final: 204px; --ff-invoice-filter-select-width-final: 220px; --ff-invoice-filter-long-width-final: 268px; --ff-invoice-filter-pc-kgs-width-final: 456px; --ff-invoice-filter-ring-width-final: 132px; --ff-invoice-filter-zone-width-final: 112px; --ff-invoice-filter-dormant-width-final: 150px; align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-invoice-filter-gap-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > legend.ff-sr-legend, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > .ff-filter-actions-slot--top { flex: 0 0 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-admin-id-row, .ff-filter-waybill-route-row) { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-admin-id-row, .ff-filter-waybill-route-row)::before, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-admin-id-row, .ff-filter-waybill-route-row)::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-admin-id-row, .ff-filter-waybill-route-row) > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card > :is(.ff-waybill-filter-grid, .ff-filter-client-row, .ff-filter-admin-id-row, .ff-filter-waybill-route-row) > .ff-filter-field { align-self: flex-start !important; float: none !important; margin: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-sr-card .ff-filter-field > :is(.form-group, .dx-field) { box-sizing: border-box !important; margin-bottom: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-id { flex: 0 0 var(--ff-invoice-filter-id-width-final) !important; max-width: var(--ff-invoice-filter-id-width-final) !important; min-width: 180px !important; order: 10 !important; width: var(--ff-invoice-filter-id-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-type { order: 20 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-period { order: 30 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-date-range { order: 40 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-client { flex: 0 0 var(--ff-invoice-filter-client-width-final) !important; max-width: var(--ff-invoice-filter-client-width-final) !important; min-width: 260px !important; order: 50 !important; width: var(--ff-invoice-filter-client-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-acc { flex: 0 0 var(--ff-invoice-filter-acc-width-final) !important; max-width: var(--ff-invoice-filter-acc-width-final) !important; min-width: 128px !important; order: 60 !important; width: var(--ff-invoice-filter-acc-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-agent { flex: 0 0 var(--ff-invoice-filter-agent-width-final) !important; max-width: var(--ff-invoice-filter-agent-width-final) !important; min-width: 220px !important; order: 70 !important; width: var(--ff-invoice-filter-agent-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-bool-wide { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 72 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-invoice-generate-row-break { flex: 0 0 100% !important; height: 0 !important; max-height: 0 !important; min-height: 0 !important; order: 75 !important; overflow: hidden !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-waybill-filter-grid > .ff-filter-branch { flex: 0 0 var(--ff-invoice-filter-branch-width-final) !important; max-width: var(--ff-invoice-filter-branch-width-final) !important; min-width: 190px !important; order: 80 !important; width: var(--ff-invoice-filter-branch-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-driver { flex: 0 0 var(--ff-invoice-filter-select-width-final) !important; max-width: var(--ff-invoice-filter-select-width-final) !important; min-width: 190px !important; order: 90 !important; width: var(--ff-invoice-filter-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-vehicle { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 100 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-ref { flex: 0 0 var(--ff-invoice-filter-text-width-final) !important; max-width: var(--ff-invoice-filter-text-width-final) !important; min-width: 132px !important; order: 110 !important; width: var(--ff-invoice-filter-text-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-client-row > .ff-filter-order { flex: 0 0 var(--ff-invoice-filter-text-width-final) !important; max-width: var(--ff-invoice-filter-text-width-final) !important; min-width: 132px !important; order: 120 !important; width: var(--ff-invoice-filter-text-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-schedule { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 130 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-waybill-id { flex: 0 0 var(--ff-invoice-filter-short-width-final) !important; max-width: var(--ff-invoice-filter-short-width-final) !important; min-width: 120px !important; order: 140 !important; width: var(--ff-invoice-filter-short-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-quote-id { flex: 0 0 var(--ff-invoice-filter-short-width-final) !important; max-width: var(--ff-invoice-filter-short-width-final) !important; min-width: 120px !important; order: 150 !important; width: var(--ff-invoice-filter-short-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-manifest-no { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 160 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-courier { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 170 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-origin-hub { flex: 0 0 var(--ff-invoice-filter-select-width-final) !important; max-width: var(--ff-invoice-filter-select-width-final) !important; min-width: 190px !important; order: 180 !important; width: var(--ff-invoice-filter-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-admin-id-row > .ff-filter-destination-hub { flex: 0 0 var(--ff-invoice-filter-select-width-final) !important; max-width: var(--ff-invoice-filter-select-width-final) !important; min-width: 190px !important; order: 190 !important; width: var(--ff-invoice-filter-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-town { flex: 0 0 var(--ff-invoice-filter-long-width-final) !important; max-width: var(--ff-invoice-filter-long-width-final) !important; min-width: 220px !important; order: 200 !important; width: var(--ff-invoice-filter-long-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-route { flex: 0 0 var(--ff-invoice-filter-long-width-final) !important; max-width: var(--ff-invoice-filter-long-width-final) !important; min-width: 220px !important; order: 210 !important; width: var(--ff-invoice-filter-long-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-service { flex: 0 0 var(--ff-invoice-filter-long-width-final) !important; max-width: var(--ff-invoice-filter-long-width-final) !important; min-width: 220px !important; order: 220 !important; width: var(--ff-invoice-filter-long-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-pc-kgs-group { flex: 0 0 var(--ff-invoice-filter-pc-kgs-width-final) !important; max-width: var(--ff-invoice-filter-pc-kgs-width-final) !important; min-width: 420px !important; order: 230 !important; width: var(--ff-invoice-filter-pc-kgs-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-ring-code { flex: 0 0 var(--ff-invoice-filter-ring-width-final) !important; max-width: var(--ff-invoice-filter-ring-width-final) !important; min-width: 118px !important; order: 240 !important; width: var(--ff-invoice-filter-ring-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-area { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 250 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-zone { flex: 0 0 var(--ff-invoice-filter-zone-width-final) !important; max-width: var(--ff-invoice-filter-zone-width-final) !important; min-width: 96px !important; order: 250 !important; width: var(--ff-invoice-filter-zone-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-party { flex: 0 0 var(--ff-invoice-filter-medium-width-final) !important; max-width: var(--ff-invoice-filter-medium-width-final) !important; min-width: 176px !important; order: 250 !important; width: var(--ff-invoice-filter-medium-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-receiver-acc { flex: 0 0 var(--ff-invoice-filter-text-width-final) !important; max-width: var(--ff-invoice-filter-text-width-final) !important; min-width: 132px !important; order: 250 !important; width: var(--ff-invoice-filter-text-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-box { flex: 0 0 var(--ff-invoice-filter-long-width-final) !important; max-width: var(--ff-invoice-filter-long-width-final) !important; min-width: 220px !important; order: 250 !important; width: var(--ff-invoice-filter-long-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > :is(.ff-filter-parcel-desc, .ff-filter-capture-method, .ff-filter-user) { flex: 0 0 var(--ff-invoice-filter-long-width-final) !important; max-width: var(--ff-invoice-filter-long-width-final) !important; min-width: 220px !important; order: 250 !important; width: var(--ff-invoice-filter-long-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-invoice-generate-dormant-inline { flex: 0 0 var(--ff-invoice-filter-dormant-width-final) !important; max-width: var(--ff-invoice-filter-dormant-width-final) !important; min-width: 140px !important; order: 250 !important; width: var(--ff-invoice-filter-dormant-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > :is(.ff-filter-area, .ff-filter-zone, .ff-filter-party, .ff-filter-receiver-acc, .ff-filter-box, .ff-filter-parcel-desc, .ff-filter-capture-method, .ff-filter-user, .ff-filter-invoice-generate-dormant-inline) { order: 250 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-generate-invoice .ff-filter-waybill-route-row > .ff-filter-bool-group { flex: 0 0 100% !important; order: 900 !important; width: 100% !important; } /* View Waybills date period: keep the checkbox clear of the Ignore label. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-view-waybills .ff-filter-date-period #ignoreDate + label.ff-date-period-ignore-label { padding-left: 26px !important; } /* Towns/Hubs split masters: keep each page as one compact, single-grid surface. */ html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-body { padding: 8px 10px 10px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-filter { margin: 0 0 8px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-filter .form-group { margin-bottom: 6px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-search-actions { padding-top: 20px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-search-actions .btn + .btn { margin-top: 4px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar { align-items: center; display: flex; flex-wrap: wrap; gap: 6px 10px; margin: 0 0 4px !important; min-height: 34px; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar .btn { border-radius: 4px !important; min-height: 30px; padding: 5px 10px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar .checkbox-inline { margin: 0 !important; min-height: 24px; white-space: nowrap; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-actions { align-items: center; display: inline-flex; gap: 6px; justify-content: flex-end; margin-left: auto; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid { --ff-master-row-height: 18px; --ff-master-row-line-height: 16px; min-height: 360px; width: 100%; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-rowsview .dx-data-row, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-rowsview .dx-data-row > td { height: var(--ff-master-row-height) !important; line-height: var(--ff-master-row-line-height) !important; max-height: var(--ff-master-row-height) !important; min-height: var(--ff-master-row-height) !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-rowsview .dx-data-row > td { padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-filter-row .dx-selectbox .dx-placeholder::before, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-filter-row .dx-selectbox .dx-placeholder:before { content: "" !important; } html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-filter-row-pending, #hubMasterGrid#hubMasterGrid.ff-master-filter-row-pending) :is(.dx-filter-row, .dx-datagrid-filter-row) > td > *, html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-filter-row-pending, #hubMasterGrid#hubMasterGrid.ff-master-filter-row-pending) :is(.dx-filter-row, .dx-datagrid-filter-row) :is(.dx-editor, .dx-texteditor, .dx-texteditor-container, .dx-dropdowneditor, .dx-dropdowneditor-icon, .dx-icon, .dx-loadindicator, .dx-loadindicator-wrapper, .dx-loadindicator-icon, input) { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-header-panel { border: 0 !important; display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-toolbar, .dx-toolbar-items-container, .dx-toolbar-before, .dx-toolbar-center, .dx-toolbar-after) { height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar .btn-primary { align-items: center; background-color: #2f78f4 !important; border-color: #2f78f4 !important; color: #fff !important; display: inline-flex; gap: 4px; justify-content: center; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar .btn-primary.disabled, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-grid-commandbar .btn-primary[disabled] { background-color: rgba(47, 120, 244, 0.72) !important; border-color: rgba(47, 120, 244, 0.72) !important; color: #fff !important; opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select > td { overflow: visible !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-command-select :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-wrapper) { align-items: center !important; background: transparent !important; box-sizing: border-box !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin: 0 auto !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; padding: 0 !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid .dx-datagrid-rowsview .dx-data-row > td:not(.dx-command-select) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-wrapper) { align-items: center !important; background: transparent !important; box-sizing: border-box !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; line-height: 16px !important; margin: 0 auto !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; padding: 0 !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox-icon { background-color: var(--surface, #fff) !important; border: 1px solid var(--border-strong, #7d8790) !important; border-radius: 2px !important; box-shadow: none !important; box-sizing: border-box !important; height: 16px !important; line-height: 16px !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; overflow: hidden !important; position: relative !important; width: 16px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon { background-color: #2f78f4 !important; border-color: #2f78f4 !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon:before { background: transparent !important; border-color: #fff !important; border-style: solid !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 9px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -58%) rotate(45deg) !important; visibility: visible !important; width: 5px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon:before { background: #fff !important; border: 0 !important; content: "" !important; display: block !important; height: 2px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; visibility: visible !important; width: 8px !important; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target { position: relative; } html body.ff-app.ff-app.ff-app .ff-master-single .ff-master-single-grid.ff-standard-grid-pager-loading .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button).ff-standard-grid-pager-loading-target::after { animation: ff-standard-grid-pager-spin 0.7s linear infinite; border: 2px solid rgba(47, 120, 244, 0.25); border-top-color: #2f78f4; border-radius: 50%; content: ""; height: 16px; left: 50%; margin-left: -8px; margin-top: -8px; pointer-events: none; position: absolute; top: 50%; width: 16px; z-index: 3; } @keyframes ff-standard-grid-pager-spin { to { transform: rotate(360deg); } } /* Towns/Hubs split master loading/header guard. These pages use dedicated grid ids rather than the older #gridContainer ids, so keep their header out of toolbar-lock/loading overlays during route changes. */ html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(:is(.ff-town-master, .ff-hub-master))::before, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(:is(.ff-town-master, .ff-hub-master))::after, html body.ff-app.ff-app.ff-app.ff-master-route-switching .app-content:is(.csspinner, .loading, .load1, .load2)::before, html body.ff-app.ff-app.ff-app.ff-master-route-switching .app-content:is(.csspinner, .loading, .load1, .load2)::after, html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page .ff-master-single-body:is(.csspinner, .loading, .load1, .load2)::before, html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page .ff-master-single-body:is(.csspinner, .loading, .load1, .load2)::after, html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page [block-ui]:is(.csspinner, .loading, .load1, .load2)::before, html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page [block-ui]:is(.csspinner, .loading, .load1, .load2)::after, html body.ff-app.ff-app.ff-app .ff-town-master.ff-standard-grid-page #townMasterGrid#townMasterGrid.ff-standard-grid.ff-grid-loading::before, html body.ff-app.ff-app.ff-app .ff-town-master.ff-standard-grid-page #townMasterGrid#townMasterGrid.ff-standard-grid.ff-grid-loading::after, html body.ff-app.ff-app.ff-app .ff-hub-master.ff-standard-grid-page #hubMasterGrid#hubMasterGrid.ff-standard-grid.ff-grid-loading::before, html body.ff-app.ff-app.ff-app .ff-hub-master.ff-standard-grid-page #hubMasterGrid#hubMasterGrid.ff-standard-grid.ff-grid-loading::after { animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; max-height: 0 !important; max-width: 0 !important; min-height: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app.ff-master-route-switching .app-content:is(.csspinner, .loading, .load1, .load2) { background: transparent !important; } html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2)::before, html body.ff-app.ff-app.ff-app .main-content .app-content:is(.csspinner, .loading, .load1, .load2)::before { animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app.ff-master-route-switching :is(.csspinner, .loading, .load1, .load2)::before, html body.ff-app.ff-app.ff-app:has(:is(.ff-town-master, .ff-hub-master)) :is(.csspinner, .loading, .load1, .load2)::before { animation: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; content: none !important; display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header, html body.ff-app.ff-app.ff-app.ff-toolbar-locked :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header { box-sizing: border-box !important; display: block !important; left: auto !important; margin-bottom: 0 !important; max-width: none !important; opacity: 1 !important; overflow: visible !important; position: relative !important; right: auto !important; top: auto !important; transform: none !important; visibility: visible !important; width: 100% !important; z-index: 1400 !important; } html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header .ff-page-header-row { align-items: center !important; display: flex !important; gap: 8px 12px !important; justify-content: space-between !important; min-height: 0 !important; opacity: 1 !important; overflow: visible !important; visibility: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header :is(.ff-page-title-wrap, .ff-page-title, .ff-toolbar) { opacity: 1 !important; overflow: visible !important; transform: none !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header .ff-toolbar { flex: 1 1 auto !important; justify-content: flex-end !important; margin-left: auto !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page > .ff-toolbar-lock-spacer, html body.ff-app.ff-app.ff-app :is(.ff-town-master, .ff-hub-master).ff-standard-grid-page #page-title.ff-page-header + .ff-toolbar-lock-spacer { display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } /* Absolute-final split Towns/Hubs row density. Target the new split grid ids directly so older Town/Hub legacy selectors cannot leave Towns taller than Hubs. */ html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-master-row-height: 18px !important; --ff-master-row-line-height: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; } html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview .dx-data-row > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .dx-link, a, span, button, .btn, .label, .badge, .dx-button, .dx-button-content) { line-height: 16px !important; max-height: 16px !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container), html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-checkbox-icon, input[type="checkbox"]) { align-items: center !important; box-sizing: border-box !important; height: 14px !important; line-height: 14px !important; margin: 0 auto !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; width: 14px !important; } html body.ff-app.ff-app.ff-app :is(#townMasterGrid#townMasterGrid.ff-master-single-grid, #hubMasterGrid#hubMasterGrid.ff-master-single-grid) .dx-datagrid-rowsview .dx-data-row > td :is(.dx-editor-cell, .dx-editor-with-menu, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input-container, .dx-texteditor-input, .dx-dropdowneditor-input-wrapper, .dx-selectbox-container) { line-height: 16px !important; max-height: 16px !important; min-height: 0 !important; overflow: hidden !important; } /* Final explicit density lock for split Towns/Hubs masters. Keep this after every generic grid rule; the Town grid was being expanded after first paint by broader DevExtreme table/editor styling. */ html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid { --ff-grid-cell-padding-y: 0 !important; --ff-grid-row-height: 18px !important; --ff-master-row-height: 18px !important; --ff-master-row-line-height: 16px !important; --ff-standard-grid-cell-line-height: 16px !important; --ff-standard-grid-cell-padding-y: 0 !important; --ff-standard-grid-row-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview .dx-row.dx-data-row, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview .dx-row.dx-data-row > td { block-size: 18px !important; box-sizing: border-box !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; min-height: 18px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td *, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td * { line-height: 16px !important; max-height: 18px !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox-container, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox-icon, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox-container, html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid .dx-datagrid-rowsview tr.dx-row.dx-data-row > td .dx-checkbox-icon { height: 14px !important; line-height: 14px !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; width: 14px !important; } /* Final View Invoices v26 blueprint fix. Keep one normal DevExtreme table and use CSS sticky cells for the narrow selector/action/key area; do not reintroduce DevExtreme fixed panes here. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page { --ff-invoice-action-sticky-width: 76px; --ff-invoice-key-sticky-width: 118px; --ff-invoice-key-sticky-z: 12; --ff-invoice-select-sticky-width: 30px; --ff-invoice-sticky-alt-bg: #f8fafc; --ff-invoice-sticky-bg: #fff; --ff-invoice-sticky-border: rgba(15, 23, 42, .18); --ff-invoice-sticky-filter-bg: #f4f7fb; --ff-invoice-sticky-header-bg: #2f7df6; --ff-invoice-sticky-shadow: 1px 0 0 var(--ff-invoice-sticky-border); --ff-invoice-waybill-action-sticky-width: 98px; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-invoices.ff-view-invoices.ff-standard-grid-page { --ff-invoice-sticky-alt-bg: color-mix(in srgb, var(--surface, #111827) 93%, var(--primary, #2f7df6) 7%); --ff-invoice-sticky-bg: var(--surface, #111827); --ff-invoice-sticky-border: var(--border, rgba(148, 163, 184, .28)); --ff-invoice-sticky-filter-bg: var(--surface-2, #172033); --ff-invoice-sticky-header-bg: var(--primary, #2f7df6); } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-select, th.dx-command-select, .dx-command-select) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: 0 !important; max-width: var(--ff-invoice-select-sticky-width) !important; min-width: var(--ff-invoice-select-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-select-sticky-width) !important; z-index: 14 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-edit, th.dx-command-edit, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: var(--ff-invoice-select-sticky-width) !important; max-width: var(--ff-invoice-action-sticky-width) !important; min-width: var(--ff-invoice-action-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-action-sticky-width) !important; z-index: 13 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.dx-command-edit, th.dx-command-edit, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: var(--ff-invoice-select-sticky-width) !important; max-width: var(--ff-invoice-waybill-action-sticky-width) !important; min-width: var(--ff-invoice-waybill-action-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-invoice-waybill-action-sticky-width) !important; z-index: 13 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-shadow: var(--ff-invoice-sticky-shadow) !important; left: calc(var(--ff-invoice-select-sticky-width) + var(--ff-invoice-action-sticky-width)) !important; max-width: var(--ff-invoice-key-sticky-width) !important; min-width: var(--ff-invoice-key-sticky-width) !important; position: sticky !important; width: var(--ff-invoice-key-sticky-width) !important; z-index: var(--ff-invoice-key-sticky-z) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-shadow: var(--ff-invoice-sticky-shadow) !important; left: calc(var(--ff-invoice-select-sticky-width) + var(--ff-invoice-waybill-action-sticky-width)) !important; position: sticky !important; z-index: var(--ff-invoice-key-sticky-z) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col) { background-color: var(--ff-invoice-sticky-filter-bg) !important; color: inherit !important; z-index: 24 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: var(--ff-invoice-sticky-header-bg) !important; color: #fff !important; z-index: 23 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: var(--ff-invoice-sticky-filter-bg) !important; color: inherit !important; z-index: 22 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: var(--ff-invoice-sticky-filter-bg) !important; z-index: 18 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: var(--ff-invoice-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected):is(:hover, .dx-state-hover) > :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: color-mix(in srgb, var(--ff-invoice-sticky-bg) 86%, var(--ff-invoice-sticky-header-bg) 14%) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { background-color: var(--ff-invoice-sticky-bg) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):is(:hover, .dx-state-hover) > :is(td.dx-command-select, th.dx-command-select, .dx-command-select, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } /* DevExtreme generated command cells can miss the configured cssClass in some surfaces. The first two physical columns are always selector + action on the View Invoices grids, so keep them sticky by position as a final fallback. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-table .dx-row > :is(td, th):nth-child(1) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: 0 !important; max-width: var(--ff-invoice-select-sticky-width) !important; min-width: var(--ff-invoice-select-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; right: auto !important; text-align: center !important; transform: none !important; vertical-align: middle !important; width: var(--ff-invoice-select-sticky-width) !important; z-index: 34 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-table .dx-row > :is(td, th):nth-child(2) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: var(--ff-invoice-select-sticky-width) !important; max-width: var(--ff-invoice-action-sticky-width) !important; min-width: var(--ff-invoice-action-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; right: auto !important; text-align: center !important; transform: none !important; vertical-align: middle !important; width: var(--ff-invoice-action-sticky-width) !important; z-index: 33 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-table .dx-row > :is(td, th):nth-child(2) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: var(--ff-invoice-select-sticky-width) !important; max-width: var(--ff-invoice-waybill-action-sticky-width) !important; min-width: var(--ff-invoice-waybill-action-sticky-width) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; right: auto !important; text-align: center !important; transform: none !important; vertical-align: middle !important; width: var(--ff-invoice-waybill-action-sticky-width) !important; z-index: 33 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th):nth-child(1), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th):nth-child(2), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-filter-row > :is(td, th):nth-child(1), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-filter-row > :is(td, th):nth-child(2), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th):nth-child(1), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th):nth-child(2) { background-color: var(--ff-invoice-sticky-filter-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td, th):nth-child(1), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td, th):nth-child(2) { background-color: var(--ff-invoice-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):nth-child(1), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):nth-child(2) { background-color: var(--ff-invoice-sticky-bg) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; } /* Final native selector path for View Invoices. DevExtreme's generated selection command column paints late on v26; the page now uses a plain checkbox column that participates in normal column render. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col) { background-clip: padding-box !important; background-color: var(--ff-invoice-sticky-bg) !important; box-sizing: border-box !important; left: 0 !important; max-width: var(--ff-invoice-select-sticky-width) !important; min-width: var(--ff-invoice-select-sticky-width) !important; overflow: visible !important; padding: 0 !important; position: sticky !important; right: auto !important; text-align: center !important; transform: none !important; vertical-align: middle !important; width: var(--ff-invoice-select-sticky-width) !important; z-index: 44 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.ff-invoice-native-select-checkbox, .ff-invoice-native-select-all) { appearance: auto !important; box-sizing: border-box !important; cursor: pointer !important; display: inline-block !important; height: 14px !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; padding: 0 !important; vertical-align: middle !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col) { background-color: var(--ff-invoice-sticky-filter-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col) { background-color: var(--ff-invoice-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col) { background-color: var(--ff-invoice-sticky-bg) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { border-bottom-color: var(--ff-invoice-sticky-border) !important; border-bottom-style: solid !important; border-bottom-width: 1px !important; border-right-color: var(--ff-invoice-sticky-border) !important; border-right-style: solid !important; border-right-width: 1px !important; } /* Final View Invoices sticky shield. Overlap sticky cells by a pixel and paint an opaque backing so horizontally scrolled cells cannot show through browser sub-pixel seams. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-bg); background-clip: border-box !important; background-color: var(--ff-invoice-sticky-cell-bg) !important; box-shadow: -2px 0 0 var(--ff-invoice-sticky-cell-bg), 2px 0 0 var(--ff-invoice-sticky-cell-bg), inset -1px 0 0 var(--ff-invoice-sticky-border), inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-command-col, th.ff-invoice-view-command-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-table .dx-row > :is(td, th):nth-child(2) { left: calc(var(--ff-invoice-select-sticky-width) - 1px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) { left: calc(var(--ff-invoice-select-sticky-width) + var(--ff-invoice-action-sticky-width) - 2px) !important; max-width: var(--ff-invoice-key-sticky-width) !important; min-width: var(--ff-invoice-key-sticky-width) !important; width: var(--ff-invoice-key-sticky-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-table .dx-row > :is(td, th):nth-child(2) { left: calc(var(--ff-invoice-select-sticky-width) - 1px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { left: calc(var(--ff-invoice-select-sticky-width) + var(--ff-invoice-waybill-action-sticky-width) - 2px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-filter-bg); } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-header-bg); background-color: var(--ff-invoice-sticky-header-bg) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) :is(.dx-datagrid-text-content, span, div) { color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-alt-bg); } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-bg); box-shadow: -2px 0 0 var(--ff-invoice-sticky-cell-bg), 2px 0 0 var(--ff-invoice-sticky-cell-bg), inset 0 0 0 9999px var(--ff-dx-selection-tint), inset -1px 0 0 var(--ff-invoice-sticky-border), inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .ff-invoice-view-eye-button { align-items: center !important; background: transparent !important; border: 0 !important; color: #2f7df6 !important; cursor: pointer !important; display: inline-flex !important; height: var(--ff-view-invoices-action-hit-size, 22px) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-view-invoices-action-hit-size, 22px) !important; min-height: 0 !important; min-width: 0 !important; padding: 0 !important; width: var(--ff-view-invoices-action-hit-size, 22px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .ff-invoice-view-eye-button .fa { font-size: 15px !important; line-height: 1 !important; } /* Final View Invoices polish for the v26 single-table sticky blueprint. The first three physical columns are selector, eye action, then invoice key. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th):nth-child(3), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-header-bg); background-color: var(--ff-invoice-sticky-header-bg) !important; color: #fff !important; left: calc(var(--ff-invoice-select-sticky-width) + var(--ff-invoice-action-sticky-width) - 2px) !important; opacity: 1 !important; padding-left: 6px !important; position: sticky !important; text-align: left !important; visibility: visible !important; z-index: 42 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th):nth-child(3) :is(.dx-datagrid-text-content, .dx-column-indicators, span, div), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-header-row :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) :is(.dx-datagrid-text-content, .dx-column-indicators, span, div) { color: #fff !important; opacity: 1 !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):not(.ff-invoice-native-select-col):not(.ff-invoice-view-command-col):not(.ff-invoice-view-waybill-command-col):not(.ff-invoice-view-invoice-key-col):not(.ff-invoice-view-waybill-key-col) { background-color: var(--surface) !important; box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint) !important; color: var(--text) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):not(.ff-invoice-native-select-col):not(.ff-invoice-view-command-col):not(.ff-invoice-view-waybill-command-col):not(.ff-invoice-view-invoice-key-col):not(.ff-invoice-view-waybill-key-col) { background-color: var(--surface-2) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):is(:hover, .dx-state-hover) > :is(td, th):not(.ff-invoice-native-select-col):not(.ff-invoice-view-command-col):not(.ff-invoice-view-waybill-command-col):not(.ff-invoice-view-invoice-key-col):not(.ff-invoice-view-waybill-key-col) { box-shadow: inset 0 0 0 9999px var(--ff-dx-selection-tint-hover) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):nth-child(3), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) { --ff-invoice-sticky-cell-bg: var(--ff-invoice-sticky-bg); background-color: var(--ff-invoice-sticky-cell-bg) !important; box-shadow: -2px 0 0 var(--ff-invoice-sticky-cell-bg), 2px 0 0 var(--ff-invoice-sticky-cell-bg), inset 0 0 0 9999px var(--ff-dx-selection-tint), inset -1px 0 0 var(--ff-invoice-sticky-border), inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):is(:hover, .dx-state-hover) > :is(td, th):nth-child(3), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected):is(:hover, .dx-state-hover) > :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col) { box-shadow: -2px 0 0 var(--ff-invoice-sticky-cell-bg), 2px 0 0 var(--ff-invoice-sticky-cell-bg), inset 0 0 0 9999px var(--ff-dx-selection-tint-hover), inset -1px 0 0 var(--ff-invoice-sticky-border), inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } /* Full capture final linked-button alignment. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture { --ff-full-capture-linked-button-h: var(--ff-control-h, 34px); } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture { --ff-full-capture-linked-button-h: var(--ff-full-capture-compact-control-h, var(--ff-ui-density-control-h, 26px)); } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-courier-field input.form-control { border-bottom-right-radius: 0 !important; border-top-right-radius: 0 !important; height: var(--ff-full-capture-linked-button-h) !important; max-height: var(--ff-full-capture-linked-button-h) !important; min-height: var(--ff-full-capture-linked-button-h) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-1, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-3 { margin-top: -4px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs > .row > .ff-full-waybill-no-field, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-courier-field, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-courier-action { margin-top: -4px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-capture-date { margin-top: -4px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs button[ng-click="toggleClonePanel()"] { margin-top: 18px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs button[ng-click="toggleClonePanel()"] { margin-top: 13px !important; } /* Final waybill-mode top-row balance: widen Waybill # and align Clone with Capture Date input. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > .col-md-3.ff-full-waybill-no-field:has(#waybillNo), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > .ff-full-waybill-no-field { flex: 0 1 340px !important; max-width: 430px !important; min-width: 300px !important; width: 340px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > .ff-full-clone-action, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > div:not([class]) > .ff-full-clone-action { align-self: flex-start !important; flex: 0 0 78px !important; margin-top: -4px !important; max-width: 78px !important; min-width: 72px !important; padding-left: 0 !important; padding-right: 0 !important; padding-top: var(--ff-full-basic-label-stack-h, 20px) !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > .ff-full-clone-action button[ng-click="toggleClonePanel()"], html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > div:not([class]) > .ff-full-clone-action button[ng-click="toggleClonePanel()"] { box-sizing: border-box !important; margin-top: 0 !important; min-width: 0 !important; padding-left: 6px !important; padding-right: 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > .ff-full-clone-action, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture.ff-full-capture--waybill .ff-basic-details .ff-full-basic-docs > .row > div:not([class]) > .ff-full-clone-action { padding-top: var(--ff-full-basic-label-stack-h, 13px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs .ff-full-courier-action { margin-left: -10px !important; padding-top: 14px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-full-basic-docs .ff-full-courier-action { margin-left: -10px !important; padding-top: calc(var(--ff-full-capture-compact-label-line-height, 15px) + 1px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs .ff-full-courier-action :is(.btn-group, .dropdown-toggle), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-linked-menu-action :is(.btn-group, .dropdown-toggle) { box-sizing: border-box !important; height: var(--ff-full-capture-linked-button-h) !important; line-height: var(--ff-full-capture-linked-button-h) !important; max-height: var(--ff-full-capture-linked-button-h) !important; max-width: var(--ff-full-capture-linked-button-h) !important; min-height: var(--ff-full-capture-linked-button-h) !important; min-width: var(--ff-full-capture-linked-button-h) !important; width: var(--ff-full-capture-linked-button-h) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-full-basic-docs .ff-full-courier-action .dropdown-toggle, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-linked-menu-action .dropdown-toggle { align-items: center !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: var(--radius-sm, 6px) !important; border-left: 0 !important; border-top-left-radius: 0 !important; border-top-right-radius: var(--radius-sm, 6px) !important; display: inline-flex !important; justify-content: center !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-linked-menu-field + .ff-linked-menu-action, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-invoice-row > .ff-linked-menu-action { margin-left: -1px !important; padding-top: 17px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-additional-details .ff-linked-menu-field + .ff-linked-menu-action, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-invoice-row > .ff-linked-menu-action { padding-top: calc(var(--ff-full-capture-compact-label-line-height, 15px) + 2px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-linked-menu-field input.form-control { border-bottom-right-radius: 0 !important; border-top-right-radius: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-manifest-list .input-group { align-items: flex-start !important; display: inline-flex !important; max-width: 100% !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-manifest-list .input-group > .form-control { flex: 0 1 12rem !important; max-width: 12rem !important; min-width: 0 !important; width: 12rem !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-manifest-list .input-group > .input-group-btn { display: block !important; flex: 0 0 var(--ff-full-capture-linked-button-h) !important; margin-left: -1px !important; width: var(--ff-full-capture-linked-button-h) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-additional-details .ff-additional-manifest-list .input-group > .input-group-btn > .dropdown-toggle { align-items: center !important; border-bottom-left-radius: 0 !important; border-bottom-right-radius: var(--radius-sm, 6px) !important; border-left: 0 !important; border-top-left-radius: 0 !important; border-top-right-radius: var(--radius-sm, 6px) !important; display: inline-flex !important; height: var(--ff-full-capture-linked-button-h) !important; justify-content: center !important; max-height: var(--ff-full-capture-linked-button-h) !important; min-height: var(--ff-full-capture-linked-button-h) !important; padding: 0 !important; width: var(--ff-full-capture-linked-button-h) !important; } /* Final View Invoices spacer/footer cleanup. Keep this CSS-only so the v26 sticky grid stays on the fast path. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(tr.ff-invoice-grid-spacer-row, .dx-freespace-row, .dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(tr.ff-invoice-grid-spacer-row, .dx-freespace-row, .dx-virtual-row) > :is(td, th) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { border-bottom-color: transparent !important; border-bottom-width: 0 !important; border-right-color: transparent !important; border-right-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th) { border-left-color: transparent !important; border-left-width: 0 !important; border-right-color: transparent !important; border-right-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-total-footer :is(td.ff-invoice-native-select-col, th.ff-invoice-native-select-col, td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col, td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { box-shadow: inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page { --ff-invoice-sticky-border: #d0d7de; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-view-invoices.ff-view-invoices.ff-standard-grid-page { --ff-invoice-sticky-border: var(--border, rgba(148, 163, 184, .28)); } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row) :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row) :is(td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected) > :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-data-row:not(.dx-selection):not(.ff-dx-row-selected) > :is(td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { box-shadow: -2px 0 0 var(--ff-invoice-sticky-cell-bg), 2px 0 0 var(--ff-invoice-sticky-cell-bg), inset -1px 0 0 var(--ff-invoice-sticky-border), inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td.ff-invoice-view-invoice-key-col, th.ff-invoice-view-invoice-key-col), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-invoice-css-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td.ff-invoice-view-waybill-key-col, th.ff-invoice-view-waybill-key-col) { box-shadow: inset 0 -1px 0 var(--ff-invoice-sticky-border) !important; } /* Final View Invoices header/rowsview spacer collapse. Mirrors the TEST3 View Waybills blank-band fix without adding repaint work. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-datagrid-content { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row) > :is(td, th) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-data-row):not(.dx-group-row):not(.dx-master-detail-row):not(.dx-detail-row):not(.dx-edit-row), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-data-row):not(.dx-group-row):not(.dx-master-detail-row):not(.dx-detail-row):not(.dx-edit-row) > :is(td, th), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row, .ff-invoice-grid-spacer-row), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row, .ff-invoice-grid-spacer-row) > :is(td, th) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-invoice-css-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { height: auto !important; max-height: none !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Final View Invoices inline row-action sizing. The detail grid previously used a dropdown in this column; keep the new inline buttons visible and aligned in both summary and waybill grids. */ html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #clientGridContainer#clientGridContainer.ff-standard-grid :is(td.ff-invoice-view-command-col, th.ff-invoice-view-command-col, .ff-invoice-view-command-col) { max-width: var(--ff-invoice-action-sticky-width, 76px) !important; min-width: var(--ff-invoice-action-sticky-width, 76px) !important; overflow: visible !important; width: var(--ff-invoice-action-sticky-width, 76px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid :is(td.ff-invoice-view-waybill-command-col, th.ff-invoice-view-waybill-command-col, .ff-invoice-view-waybill-command-col) { max-width: var(--ff-invoice-waybill-action-sticky-width, 98px) !important; min-width: var(--ff-invoice-waybill-action-sticky-width, 98px) !important; overflow: visible !important; width: var(--ff-invoice-waybill-action-sticky-width, 98px) !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-invoice-view-command-col, .ff-invoice-view-waybill-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.ff-invoice-row-action-buttons, .ff-grid-row-action-buttons) { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 2px !important; height: 22px !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-standard-grid-page :is(#clientGridContainer, #waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-invoice-view-command-col, .ff-invoice-view-waybill-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-grid-row-action-button { align-items: center !important; display: inline-flex !important; flex: 0 0 22px !important; height: 22px !important; justify-content: center !important; line-height: 20px !important; max-height: 22px !important; max-width: 22px !important; min-height: 22px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; width: 22px !important; } /* V26 migrated view-grid blueprint. Opt-in only: this carries the View Invoices/Waybills compact row and spacer fixes to pages marked as converted without adding post-load DOM work. */ html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page { --ff-grid-cell-padding-y: 1px !important; --ff-grid-row-height: 22px !important; --ff-standard-grid-cell-line-height: 18px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-row-height: 22px !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-headers .dx-datagrid-content { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-headers .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-headers .dx-datagrid-table > tbody > tr:not(.dx-header-row):not(.dx-filter-row):not(.dx-datagrid-filter-row) > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-data-row):not(.dx-group-row):not(.dx-master-detail-row):not(.dx-detail-row):not(.dx-edit-row), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-datagrid-table > tbody > tr:not(.dx-data-row):not(.dx-group-row):not(.dx-master-detail-row):not(.dx-detail-row):not(.dx-edit-row) > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-freespace-row, .dx-virtual-row) > :is(td, th) { border: 0 !important; display: none !important; height: 0 !important; line-height: 0 !important; max-height: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-headers :is(.dx-datagrid-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { height: auto !important; max-height: none !important; min-height: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > :is(td, th) { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-boolean-checkbox, span, a, button, img, i, .fa, .label, .badge), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th) :is(.dx-link, .dx-button, .dx-button-content, .dx-dropdownbutton, .dx-dropdownbutton-action, .dx-dropdownbutton-toggle, .btn) { box-sizing: border-box !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th) :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, input[type="checkbox"]), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-headers :is(.dx-checkbox, .dx-select-checkbox, .dx-checkbox-wrapper, .dx-checkbox-container, input[type="checkbox"]) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size) !important; max-width: var(--ff-standard-grid-check-size) !important; min-height: var(--ff-standard-grid-check-size) !important; min-width: var(--ff-standard-grid-check-size) !important; padding: 0 !important; vertical-align: middle !important; width: var(--ff-standard-grid-check-size) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-total-footer .dx-row > :is(td, th) { border-left-color: transparent !important; border-left-width: 0 !important; border-right-color: transparent !important; border-right-width: 0 !important; box-shadow: none !important; } /* Final v26 conversion lock. Converted grids use one DevExtreme table with CSS sticky columns; DevExtreme fixed panes remain disabled to avoid the old v22 double-table sync cost. */ html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page { --ff-grid-cell-padding-y: 1px !important; --ff-grid-row-height: 22px !important; --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-left: calc(var(--ff-v26-sticky-select-width) + var(--ff-v26-sticky-action-width)) !important; --ff-v26-sticky-key-width: 112px !important; --ff-v26-sticky-key2-left: calc(var(--ff-v26-sticky-key-left) + var(--ff-v26-sticky-key-width)) !important; --ff-v26-sticky-key2-width: 120px !important; --ff-v26-sticky-id-left: calc(var(--ff-v26-sticky-key-left) + var(--ff-v26-sticky-key-width)) !important; --ff-v26-sticky-id-width: 72px !important; --ff-v26-sticky-select-left: 0px !important; --ff-v26-sticky-select-width: 30px !important; --ff-standard-grid-cell-line-height: 18px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-check-size: 14px !important; --ff-standard-grid-row-height: 22px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-v26-grid-blueprint { --ff-v26-sticky-action-left: calc(var(--ff-v26-sticky-select-width) + var(--ff-v26-sticky-key-width)) !important; --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 64px !important; } html body.ff-app.ff-app.ff-app .ff-view-query.ff-v26-grid-blueprint, html body.ff-app.ff-app.ff-app .ff-view-ops-fin-query.ff-v26-grid-blueprint { --ff-v26-sticky-select-width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master.ff-v26-grid-blueprint, html body.ff-app.ff-app.ff-app .ff-town-master.ff-v26-grid-blueprint { --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-action-width: 0px !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 170px !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint { --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-action-width: 0px !important; --ff-v26-sticky-id-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-id-width: 78px !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 112px !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-v26-grid-blueprint { --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-action-width: 0px !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 150px !important; } html body.ff-app.ff-app.ff-app .ff-debtors.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-width: 104px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-width: 116px !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-width: 92px !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-width: 72px !important; --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 433px)) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-v26-grid-blueprint { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 493px)) !important; } html body.ff-app.ff-app.ff-app .ff-view-manifests-simple.ff-v26-grid-blueprint, html body.ff-app.ff-app.ff-app .ff-view-manifests.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 20px !important; --ff-v26-sticky-key-width: 118px !important; --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 15px - var(--ff-standard-grid-page-offset, 245px))) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-width: 180px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 42px !important; --ff-v26-sticky-key-width: 82px !important; --ff-v26-sticky-key2-width: 120px !important; --ff-v26-sticky-select-width: 28px !important; --ff-standard-grid-rows-max-height: clamp(345px, calc(100dvh - 249px), 825px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-tracking.ff-v26-grid-blueprint { --ff-standard-grid-rows-max-height: clamp(345px, calc(100dvh - 269px), 825px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-width: 105px !important; --ff-v26-sticky-key2-width: 130px !important; --ff-v26-sticky-select-width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-receivers.ff-v26-grid-blueprint { --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-width: 260px !important; --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 223px)) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-receivers.ff-v26-grid-blueprint { --ff-standard-grid-rows-max-height: max(320px, calc(100dvh - 243px)) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).dx-command-select { left: var(--ff-v26-sticky-select-left) !important; max-width: var(--ff-v26-sticky-select-width) !important; min-width: var(--ff-v26-sticky-select-width) !important; position: sticky !important; width: var(--ff-v26-sticky-select-width) !important; z-index: 22 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).dx-command-edit { left: var(--ff-v26-sticky-action-left) !important; max-width: var(--ff-v26-sticky-action-width) !important; min-width: var(--ff-v26-sticky-action-width) !important; position: sticky !important; width: var(--ff-v26-sticky-action-width) !important; z-index: 21 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-key-col { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width) !important; min-width: var(--ff-v26-sticky-key-width) !important; position: sticky !important; width: var(--ff-v26-sticky-key-width) !important; z-index: 20 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-key2-col { left: var(--ff-v26-sticky-key2-left) !important; max-width: var(--ff-v26-sticky-key2-width) !important; min-width: var(--ff-v26-sticky-key2-width) !important; position: sticky !important; width: var(--ff-v26-sticky-key2-width) !important; z-index: 19 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-id-col { left: var(--ff-v26-sticky-id-left) !important; max-width: var(--ff-v26-sticky-id-width) !important; min-width: var(--ff-v26-sticky-id-width) !important; position: sticky !important; width: var(--ff-v26-sticky-id-width) !important; z-index: 18 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-id-col.ff-v26-sticky-id-after-key2-col { left: calc(var(--ff-v26-sticky-key2-left) + var(--ff-v26-sticky-key2-width)) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).dx-command-edit { background: #347cf5 !important; color: #fff !important; opacity: 1 !important; z-index: 32 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-filter-row :is(td, th).dx-command-edit, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-filter-row :is(td, th).dx-command-edit { background: #fff !important; color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th).dx-command-edit { background: #fff !important; color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .ff-v26-sticky-id-col, .dx-command-select, .dx-command-edit) { border-right: 1px solid #d9dde5 !important; box-shadow: inset -1px 0 0 #d9dde5 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row > :is(td, th).dx-command-edit { background: #fff !important; background-clip: padding-box !important; border-color: #d9dde5 !important; box-shadow: inset -1px 0 0 #d9dde5 !important; opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).ff-v26-sticky-id-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).dx-command-select, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th).dx-command-edit { background: #f6f6f6 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-id-col { background: #fff4bf !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-action-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-key-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-key2-col, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th).ff-v26-sticky-id-col { background: #fff0a6 !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .dx-command-select, .dx-command-edit), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .dx-command-select, .dx-command-edit) > :is(.dx-template-wrapper, .dx-link, .dx-button, .dx-button-content, .fa, .dx-icon, span) { justify-content: center !important; text-align: center !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > :is(td, th) { font-size: 12px !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #clientGridContainer, #waybillGridContainer, #townMasterGrid, #hubMasterGrid).ff-standard-grid .dx-datagrid-total-footer .dx-row > :is(td, th) { border-left: 0 !important; border-right: 0 !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(tr.dx-row.dx-data-row, tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(tr.dx-row.dx-data-row, tr.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > :is(td, th) { block-size: var(--ff-standard-grid-row-height) !important; box-sizing: border-box !important; font-size: 12px !important; height: var(--ff-standard-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-block-size: var(--ff-standard-grid-row-height) !important; max-height: var(--ff-standard-grid-row-height) !important; min-block-size: var(--ff-standard-grid-row-height) !important; min-height: var(--ff-standard-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-standard-grid-cell-padding-y) !important; padding-top: var(--ff-standard-grid-cell-padding-y) !important; text-overflow: ellipsis !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions { align-self: flex-end !important; display: flex !important; flex: 1 1 auto !important; justify-content: flex-end !important; margin-left: auto !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { display: flex !important; justify-content: flex-end !important; margin-left: auto !important; padding-right: 0 !important; width: auto !important; } /* Absolute-final Tariffs clean filter layout. The active rates page uses .ff-rates-tariffs, not the legacy .ff-tariffs class. Port the field-aware tariff grid contract here so Bootstrap col-md widths cannot make every filter field the same size. */ html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel { --ff-tariff-clean-grid-gap-x-final: 10px; --ff-tariff-clean-grid-gap-y-final: 6px; --ff-tariff-clean-action-button-final: 34px; --ff-tariff-clean-search-final: 150px; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { align-items: end !important; display: grid !important; gap: var(--ff-tariff-clean-grid-gap-y-final) var(--ff-tariff-clean-grid-gap-x-final) !important; grid-template-columns: repeat(24, minmax(0, 1fr)) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > legend.ff-sr-legend { grid-column: 1 / -1 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) { display: contents !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row)::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row)::after, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::after, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::before, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > [class*="col-"] { box-sizing: border-box !important; flex: none !important; float: none !important; grid-column: span 4 !important; margin: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is(.form-group, .ff-control, .ff-ui, .ui-select-container, .ui-select-match, .ff-ms, .input-group, .input-icon) { max-width: 100% !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is(label, .control-label) { margin-bottom: 2px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is(.form-control, .ui-select-container, .ui-select-match, .btn-group, .multiselect-parent) { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is( .ff-tariff-id-field, .ff-tariff-category-field, .ff-tariff-account-field, .ff-tariff-from-pc-field, .ff-tariff-to-pc-field, .ff-tariff-from-kgs-field, .ff-tariff-to-kgs-field, .ff-tariff-ring-code-field, .ff-tariff-non-doc-field, .ff-tariff-zone-field ) { grid-column: span 2 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is( .ff-tariff-type-field, .ff-tariff-effective-date, .ff-tariff-service-field, .ff-tariff-top-recs-field ) { grid-column: span 3 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is( .ff-tariff-client-field, .ff-tariff-agent-field, .ff-tariff-sender-field, .ff-tariff-receiver-field ) { grid-column: span 8 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-date-group { align-items: stretch !important; display: flex !important; table-layout: auto !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-date-group .input-group-addon { align-items: center !important; display: inline-flex !important; flex: 0 0 68px !important; justify-content: center !important; max-width: 68px !important; min-width: 68px !important; padding-left: 4px !important; padding-right: 4px !important; width: 68px !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-date-group .ff-tariff-date-icon { display: block !important; flex: 1 1 auto !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-account-field textarea.form-control { height: var(--ff-control-h) !important; min-height: var(--ff-control-h) !important; overflow-y: auto !important; resize: none !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row { align-items: end !important; display: grid !important; gap: var(--ff-tariff-clean-grid-gap-y-final) var(--ff-tariff-clean-grid-gap-x-final) !important; grid-column: 1 / -1 !important; grid-template-columns: minmax(145px, 220px) minmax(145px, 220px) minmax(16px, 1fr) max-content !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-from { grid-column: 1 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-area-to { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-footer-actions { display: flex !important; grid-column: 4 !important; justify-content: flex-end !important; justify-self: end !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { flex: 0 0 auto !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin-left: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-keep-filter { flex: 0 0 auto !important; margin-left: 0 !important; margin-right: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-column-loading-toggle:is(:hover, :focus, :active, .active), html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-close-filter, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-close-filter:is(:hover, :focus, :active, .active) { align-items: center !important; display: inline-flex !important; flex: 0 0 var(--ff-tariff-clean-action-button-final) !important; height: var(--ff-tariff-clean-action-button-final) !important; justify-content: center !important; max-width: var(--ff-tariff-clean-action-button-final) !important; min-width: var(--ff-tariff-clean-action-button-final) !important; padding-left: 0 !important; padding-right: 0 !important; width: var(--ff-tariff-clean-action-button-final) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-search { flex: 0 0 var(--ff-tariff-clean-search-final) !important; margin: 0 !important; max-width: 160px !important; min-width: 140px !important; width: var(--ff-tariff-clean-search-final) !important; } @media (max-width: 1180px) { html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row { grid-template-columns: minmax(145px, 1fr) minmax(145px, 1fr) !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row .ff-filter-footer-actions { grid-column: 1 / -1 !important; justify-self: stretch !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { margin-left: auto !important; } } @media (max-width: 900px) { html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { display: block !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row > [class*="col-"] { flex: 1 1 100% !important; max-width: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner { flex-wrap: wrap !important; width: 100% !important; } } /* Tariffs clean page uses .ff-rates-tariffs, while legacy tariff CSS uses .ff-tariffs. Keep this override narrow so the v26 sticky cells keep the same border rhythm as the scrollable cells without reviving legacy rules. */ html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-key-col { border-bottom: 1px solid #d9dde5 !important; border-right: 1px solid #d9dde5 !important; box-shadow: inset -1px 0 0 #d9dde5 !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-select-col { left: var(--ff-v26-sticky-select-left) !important; z-index: 24 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-key-col { left: var(--ff-v26-sticky-key-left) !important; z-index: 23 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-select-col, html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th).ff-v26-sticky-key-col { z-index: 34 !important; } html body.ff-app.ff-app.ff-app .ff-rates-tariffs.ff-v26-grid-blueprint .ff-grid-toolbar-inner .ff-tariff-export-btn { align-items: center !important; display: inline-flex !important; height: 28px !important; justify-content: center !important; min-width: 34px !important; padding: 0 8px !important; } /* Absolute-final View Quotes grid polish. Keep CSS-sticky fixed cells bordered, reserve the native rows scrollbar for header/footer alignment, and leave totals without vertical separators. */ html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 451px)) !important; --ff-view-quotes-grid-line: var(--border, #d9dde5) !important; --ff-view-quotes-scrollbar-reserve: 17px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: max(220px, calc(100dvh - 511px)) !important; } @supports not (height: max(1px, 2px)) { html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 451px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--quotes.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 511px) !important; } } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: content-box !important; padding-right: var(--ff-view-quotes-scrollbar-reserve) !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-quote-select-col, .ff-quote-command-col, .ff-quote-key-col, .dx-command-select, .dx-command-edit) { border-bottom: 1px solid var(--ff-view-quotes-grid-line) !important; border-right: 1px solid var(--ff-view-quotes-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-view-quotes-grid-line), inset 0 -1px 0 var(--ff-view-quotes-grid-line) !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-view-quotes.ff-view-quotes.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-quote-select-col, .ff-quote-command-col, .ff-quote-key-col, .dx-command-select, .dx-command-edit) { border-left: 0 !important; border-left-color: transparent !important; border-left-width: 0 !important; border-right: 0 !important; border-right-color: transparent !important; border-right-width: 0 !important; box-shadow: none !important; } /* Absolute-final Debriefing sticky Waybill column. Keep Waybill # directly after the row selector without enabling DevExtreme fixed panes; the page stays on the fast CSS-sticky single-table grid. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--debriefing.ff-standard-grid-css-owned { --ff-debrief-sticky-grid-line: var(--border, #d9dde5) !important; --ff-v26-sticky-action-left: calc(var(--ff-v26-sticky-select-width) + var(--ff-v26-sticky-key-width)) !important; --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 270px !important; --ff-v26-sticky-select-width: var(--ff-debrief-select-width-final, 28px) !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-debrief-select-col, .ff-debrief-key-col, .dx-command-select) { border-bottom: 1px solid var(--ff-debrief-sticky-grid-line) !important; border-right: 1px solid var(--ff-debrief-sticky-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-debrief-sticky-grid-line), inset 0 -1px 0 var(--ff-debrief-sticky-grid-line) !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-key-col, .ff-debrief-key-col) { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width) !important; min-width: var(--ff-v26-sticky-key-width) !important; width: var(--ff-v26-sticky-key-width) !important; } /* Absolute-final Debriefing dark header colour. Keep every header cell on the active theme colour, not only the sticky key. */ html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th) { background-color: var(--grid-head-bg, var(--ff-portal-theme-grid-head-bg, var(--primary, #367bf5))) !important; background-image: none !important; border-bottom-color: color-mix(in srgb, var(--grid-head-bg, var(--ff-portal-theme-grid-head-bg, var(--primary, #367bf5))) 78%, #000) !important; border-right-color: var(--grid-head-sep, color-mix(in srgb, var(--on-primary, #fff) 22%, transparent)) !important; color: var(--grid-head-fg, var(--on-primary, #fff)) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th) :is(.dx-datagrid-text-content, .dx-header-filter, .dx-sort, .dx-sort-index) { color: var(--grid-head-fg, var(--on-primary, #fff)) !important; } /* Absolute-final Debriefing selector checkbox centering. Keep the accepted 22px row height and nudge only the checkbox painting. */ html body.ff-app.ff-app.ff-app .ff-debriefing.ff-debriefing.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(td, th):is(.ff-v26-native-select-col, .ff-v26-sticky-select-col, .ff-debrief-select-col, .dx-command-select) :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { position: relative !important; top: -1px !important; transform: none !important; } /* Absolute-final View Payments v26 sticky/scroll polish. Keep the page on one standard grid with CSS-sticky cells; do not revive DevExtreme fixed panes or the older split-table scroll sync behaviour. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments.ff-standard-grid-css-owned { --ff-view-payments-grid-line: var(--border, #d9dde5) !important; --ff-view-payments-scrollbar-reserve: 17px !important; --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-action-width: 30px !important; --ff-v26-sticky-key-left: calc(var(--ff-v26-sticky-select-width) + var(--ff-v26-sticky-action-width)) !important; --ff-v26-sticky-key-width: 116px !important; --ff-v26-sticky-select-width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) { box-sizing: content-box !important; padding-right: var(--ff-view-payments-scrollbar-reserve) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-payments-select-col, .ff-payments-view-command-col, .dx-command-select, .dx-command-edit) { background-clip: padding-box !important; border-bottom: 1px solid var(--ff-view-payments-grid-line) !important; border-right: 1px solid var(--ff-view-payments-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-view-payments-grid-line), inset 0 -1px 0 var(--ff-view-payments-grid-line) !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-payments-select-col, .ff-payments-view-command-col, .dx-command-select, .dx-command-edit) { background: #fff !important; color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-payments-select-col, .ff-payments-view-command-col, .dx-command-select, .dx-command-edit) { border-left: 0 !important; border-left-color: transparent !important; border-left-width: 0 !important; border-right: 0 !important; border-right-color: transparent !important; border-right-width: 0 !important; box-shadow: none !important; } /* Generate Manifest v26 grid conversion. Keep the selector/action/key columns sticky in the single-table grid so the row selector paints with the row instead of DevExtreme's late fixed pane. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-standard-grid-css-owned { --ff-generate-manifest-sticky-alt-bg: #f6f6f6 !important; --ff-generate-manifest-sticky-bg: #fff !important; --ff-generate-manifest-sticky-grid-line: var(--border, #d9dde5) !important; --ff-generate-manifest-sticky-selected-alt-bg: #fff0a6 !important; --ff-generate-manifest-sticky-selected-bg: #fff4bf !important; --ff-v26-sticky-action-width: 34px !important; --ff-v26-sticky-key-width: 140px !important; --ff-v26-sticky-select-width: 28px !important; --ff-standard-grid-rows-max-height: max(240px, calc(100dvh - 415px)) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background-clip: border-box !important; border-bottom: 1px solid var(--ff-generate-manifest-sticky-grid-line) !important; border-right: 1px solid var(--ff-generate-manifest-sticky-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-generate-manifest-sticky-grid-line), inset 0 -1px 0 var(--ff-generate-manifest-sticky-grid-line) !important; overflow: hidden !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-manifest-select-col, .dx-command-select) { left: var(--ff-v26-sticky-select-left) !important; max-width: var(--ff-v26-sticky-select-width) !important; min-width: var(--ff-v26-sticky-select-width) !important; width: var(--ff-v26-sticky-select-width) !important; z-index: 29 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-action-col, .ff-manifest-command-col, .dx-command-edit) { left: var(--ff-v26-sticky-action-left) !important; max-width: var(--ff-v26-sticky-action-width) !important; min-width: var(--ff-v26-sticky-action-width) !important; width: var(--ff-v26-sticky-action-width) !important; z-index: 28 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-key-col, .ff-manifest-key-col) { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width) !important; min-width: var(--ff-v26-sticky-key-width) !important; width: var(--ff-v26-sticky-key-width) !important; z-index: 27 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: #347cf5 !important; color: #fff !important; z-index: 39 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: var(--ff-generate-manifest-sticky-bg) !important; color: inherit !important; z-index: 38 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: var(--ff-generate-manifest-sticky-bg) !important; background-clip: border-box !important; opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: var(--ff-generate-manifest-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: var(--ff-generate-manifest-sticky-selected-bg) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-manifest-select-col, .ff-manifest-command-col, .ff-manifest-key-col, .dx-command-select, .dx-command-edit) { background: var(--ff-generate-manifest-sticky-selected-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(td, th):is(.ff-v26-native-select-col, .ff-v26-sticky-select-col, .ff-manifest-select-col, .dx-command-select) :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { position: relative !important; top: -1px !important; transform: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-generate-manifest-horizontal-width, 100%) !important; width: var(--ff-generate-manifest-horizontal-width, auto) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-generate-manifest-horizontal-width, 100%) !important; table-layout: fixed !important; width: var(--ff-generate-manifest-horizontal-width, auto) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-row > :is(td, th), html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > :is(td, th) { border-left: 0 !important; border-right: 0 !important; box-shadow: none !important; } /* Query v26 sticky columns. Query now uses the shared v26 single-table grid; these rules only size and border the CSS-sticky selector/key columns. Header/body widths are owned by DevExtreme column definitions, not by late table-width overrides. */ html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid { --ff-query-sticky-alt-bg: #f6f6f6 !important; --ff-query-sticky-bg: #fff !important; --ff-query-sticky-grid-line: var(--border, #d9dde5) !important; --ff-query-sticky-selected-alt-bg: #fff0a6 !important; --ff-query-sticky-selected-bg: #fff4bf !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width, 30px) !important; --ff-v26-sticky-key-width: 150px !important; --ff-v26-sticky-select-left: 0px !important; --ff-v26-sticky-select-width: 30px !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background-clip: border-box !important; border-bottom: 1px solid var(--ff-query-sticky-grid-line) !important; border-right: 1px solid var(--ff-query-sticky-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-query-sticky-grid-line), inset 0 -1px 0 var(--ff-query-sticky-grid-line) !important; opacity: 1 !important; position: sticky !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col) { left: var(--ff-v26-sticky-select-left, 0px) !important; max-width: var(--ff-v26-sticky-select-width, 30px) !important; min-width: var(--ff-v26-sticky-select-width, 30px) !important; width: var(--ff-v26-sticky-select-width, 30px) !important; z-index: 40 !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-query-key-col, .ff-v26-sticky-key-col) { left: var(--ff-v26-sticky-key-left, 30px) !important; max-width: var(--ff-v26-sticky-key-width, 150px) !important; min-width: var(--ff-v26-sticky-key-width, 150px) !important; width: var(--ff-v26-sticky-key-width, 150px) !important; z-index: 39 !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: #347cf5 !important; color: #fff !important; z-index: 39 !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: var(--ff-query-sticky-bg) !important; color: inherit !important; z-index: 38 !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: var(--ff-query-sticky-bg) !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: var(--ff-query-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: var(--ff-query-sticky-selected-bg) !important; } html body.ff-app.ff-app.ff-app :is(.ff-query.ff-view-query, .ff-view-ops-fin-query).ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .ff-query-key-col, .ff-v26-sticky-key-col) { background: var(--ff-query-sticky-selected-alt-bg) !important; } /* Bulk Capture v26 Receivers grid. Keep the grid on the page surface, use the native selector column, and let the rows viewport own horizontal scrolling. */ html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint.ff-standard-grid-page { --ff-bulk-capture-sticky-alt-bg: #f6f6f6 !important; --ff-bulk-capture-sticky-bg: #fff !important; --ff-bulk-capture-sticky-grid-line: var(--border, #d9dde5) !important; --ff-bulk-capture-sticky-selected-alt-bg: #fff0a6 !important; --ff-bulk-capture-sticky-selected-bg: #fff4bf !important; --ff-standard-grid-rows-max-height: max(240px, calc(100dvh - 540px)) !important; --ff-v26-sticky-key-left: var(--ff-v26-sticky-select-width) !important; --ff-v26-sticky-key-width: 78px !important; --ff-v26-sticky-select-width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-bulk-grid-section { background: transparent !important; border: 0 !important; box-shadow: none !important; box-sizing: border-box !important; margin: 2px 0 0 !important; max-width: 100% !important; min-width: 0 !important; overflow: visible !important; padding: 0 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-bulk-grid-title { color: var(--text, #202124) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0 !important; line-height: 18px !important; margin: 0 0 3px !important; text-transform: uppercase !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-row, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-inner { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; margin: 0 !important; max-width: 100% !important; min-width: 0 !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-left, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-right { align-items: center !important; display: inline-flex !important; flex-wrap: wrap !important; gap: 4px 8px !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-left { flex: 1 1 auto !important; justify-content: flex-start !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-right { flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-right .ff-grid-actions-host, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-right .ff-grid-actions-host--icon-only, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-right .ff-grid-actions { display: inline-flex !important; flex: 0 0 auto !important; justify-content: flex-end !important; margin-left: auto !important; max-width: none !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-inner .margin-left-10 { margin-left: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-inner :is(.checkbox, .checkbox-inline, .valuesonly) { align-items: center !important; display: inline-flex !important; height: 22px !important; line-height: 22px !important; margin-bottom: 0 !important; margin-top: 0 !important; min-height: 22px !important; padding-top: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-toolbar-inner .btn { height: 26px !important; line-height: 18px !important; padding: 3px 10px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture { box-sizing: border-box !important; margin: 4px 0 0 !important; max-width: 100% !important; min-width: 0 !important; overflow: visible !important; padding: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid, .dx-gridbase-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; overflow: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview { max-height: var(--ff-standard-grid-rows-max-height, 420px) !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview .dx-scrollable-container { max-height: var(--ff-standard-grid-rows-max-height, 420px) !important; overflow: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-total-footer { display: none !important; height: 0 !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-bulk-main-fieldset { padding-bottom: 8px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-bulk-main-fieldset > .container { box-sizing: border-box !important; margin-left: 0 !important; margin-right: 0 !important; max-width: none !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .ff-bulk-parcel-grid-responsive { box-sizing: border-box !important; margin-top: 0 !important; max-width: 100% !important; overflow-x: auto !important; overflow-y: visible !important; padding-bottom: 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture .table-wrapper { max-width: 100% !important; overflow: visible !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture table.custom-dx-table.ff-parcel-grid { margin-bottom: 0 !important; min-width: 960px !important; table-layout: fixed !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture table.custom-dx-table.ff-parcel-grid :is(td, th) { box-sizing: border-box !important; padding: 3px 5px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture table.custom-dx-table.ff-parcel-grid .form-control { height: 26px !important; line-height: 20px !important; min-height: 26px !important; padding-bottom: 2px !important; padding-top: 2px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture table.custom-dx-table.ff-parcel-grid .ui-select-container { min-height: 26px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture .dx-datagrid-header-panel { display: none !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-bulk-capture-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; width: var(--ff-bulk-capture-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-bulk-capture-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; table-layout: fixed !important; width: var(--ff-bulk-capture-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-total-footer { display: none !important; height: 0 !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background-clip: border-box !important; border-bottom: 1px solid var(--ff-bulk-capture-sticky-grid-line) !important; border-right: 1px solid var(--ff-bulk-capture-sticky-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-bulk-capture-sticky-grid-line), inset 0 -1px 0 var(--ff-bulk-capture-sticky-grid-line) !important; overflow: hidden !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-select-col, .ff-bulk-select-col, .dx-command-select) { left: var(--ff-v26-sticky-select-left) !important; max-width: var(--ff-v26-sticky-select-width) !important; min-width: var(--ff-v26-sticky-select-width) !important; text-align: center !important; width: var(--ff-v26-sticky-select-width) !important; z-index: 29 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-key-col, .ff-bulk-key-col) { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width) !important; min-width: var(--ff-v26-sticky-key-width) !important; width: var(--ff-v26-sticky-key-width) !important; z-index: 28 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: #347cf5 !important; color: #fff !important; z-index: 39 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: var(--ff-bulk-capture-sticky-bg) !important; color: inherit !important; z-index: 38 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: var(--ff-bulk-capture-sticky-bg) !important; background-clip: border-box !important; opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: var(--ff-bulk-capture-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: var(--ff-bulk-capture-sticky-selected-bg) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-v26-sticky-select-col, .ff-v26-sticky-key-col, .ff-bulk-select-col, .ff-bulk-key-col, .dx-command-select) { background: var(--ff-bulk-capture-sticky-selected-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-v26-native-select-col, .ff-v26-sticky-select-col, .ff-bulk-select-col, .dx-command-select) :is(.ff-v26-native-select-all, input[type="checkbox"].ff-v26-native-select-all, .dx-checkbox.dx-widget, .dx-select-checkbox), html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(td, th):is(.ff-v26-native-select-col, .ff-v26-sticky-select-col, .ff-bulk-select-col, .dx-command-select) :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { display: block !important; margin-left: auto !important; margin-right: auto !important; position: relative !important; top: -1px !important; transform: none !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-filter-row, .dx-filter-row), html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-filter-row, .dx-filter-row) > :is(td, th) { height: 31px !important; line-height: 18px !important; max-height: 31px !important; min-height: 31px !important; overflow: visible !important; padding-bottom: 2px !important; padding-top: 2px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-filter-row, .dx-filter-row) :is(.dx-editor-cell, .dx-editor-container, .dx-texteditor, .dx-texteditor-container, .dx-texteditor-input-container, .dx-texteditor-input) { box-sizing: border-box !important; height: 25px !important; line-height: 19px !important; max-height: 25px !important; min-height: 25px !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-filter-row, .dx-filter-row) .dx-texteditor-input { padding-left: 6px !important; padding-right: 6px !important; } /* Absolute-final Bulk Capture native grid sizing and scroll sync guard. Bulk Capture uses DevExtreme native horizontal scroll; do not translate the header table as well, or it will move faster than the rows. */ html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint { --ff-standard-grid-rows-max-height: var(--ff-bulk-capture-rows-height-measured, max(260px, calc(100dvh - 520px))) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint > .container-fullw, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint > .container-fluid.container-fullw, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint form#form { box-sizing: border-box !important; margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-main-fieldset { margin-bottom: 4px !important; padding-bottom: 6px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-grid-section { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid { height: var(--ff-bulk-capture-grid-height-measured, auto) !important; max-height: var(--ff-bulk-capture-grid-height-measured, none) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid, .dx-gridbase-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { max-height: var(--ff-bulk-capture-rows-height-measured, var(--ff-standard-grid-rows-max-height, 420px)) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-bulk-capture-horizontal-width, 100%) !important; width: var(--ff-bulk-capture-horizontal-width, 100%) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table) { transform: none !important; will-change: auto !important; } /* Absolute-final Bulk Capture native sticky-column polish. Keep selector/ReceiverID/Acc#/Receiver in the normal rendered table so their headers and cells stay visible while the native body scrolls. */ html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint { --ff-bulk-capture-key-left: var(--ff-bulk-capture-select-width) !important; --ff-bulk-capture-key-width: 86px !important; --ff-bulk-capture-receiver-id-left: var(--ff-bulk-capture-select-width) !important; --ff-bulk-capture-receiver-id-width: 86px !important; --ff-bulk-capture-receiver-left: calc(var(--ff-bulk-capture-select-width) + var(--ff-bulk-capture-key-width)) !important; --ff-bulk-capture-receiver-width: 280px !important; --ff-bulk-capture-select-width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-bulk-capture-show-ids { --ff-bulk-capture-key-left: calc(var(--ff-bulk-capture-select-width) + var(--ff-bulk-capture-receiver-id-width)) !important; --ff-bulk-capture-receiver-left: calc(var(--ff-bulk-capture-select-width) + var(--ff-bulk-capture-receiver-id-width) + var(--ff-bulk-capture-key-width)) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-main-fieldset :is(.form-control, .input-sm, .ff-control, .ui-select-bootstrap > .ui-select-match > .btn, .ui-select-bootstrap > .ui-select-match > .ui-select-toggle) { padding-left: 6px !important; padding-right: 6px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-main-fieldset :is(.ui-select-bootstrap > .ui-select-match > .btn, .ui-select-bootstrap > .ui-select-match > .ui-select-toggle) { min-width: 0 !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-main-fieldset .ui-select-bootstrap .ui-select-match-text { max-width: calc(100% - 18px) !important; overflow: hidden !important; text-overflow: ellipsis !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint .ff-bulk-main-fieldset .ui-select-bootstrap .caret { right: 6px !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { display: block !important; max-width: none !important; min-width: 0 !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed .dx-scrollable-content { display: block !important; max-width: none !important; min-width: 0 !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, table) { display: table !important; max-width: none !important; min-width: 0 !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) { left: 0 !important; max-width: var(--ff-bulk-capture-select-width) !important; min-width: var(--ff-bulk-capture-select-width) !important; padding-left: 0 !important; padding-right: 0 !important; position: sticky !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-bulk-capture-select-width) !important; z-index: 7 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-bulk-receiver-id-col, .ff-v26-sticky-id-col) { left: var(--ff-bulk-capture-receiver-id-left) !important; max-width: var(--ff-bulk-capture-receiver-id-width) !important; min-width: var(--ff-bulk-capture-receiver-id-width) !important; position: sticky !important; width: var(--ff-bulk-capture-receiver-id-width) !important; z-index: 7 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-bulk-key-col, .ff-v26-sticky-key-col) { left: var(--ff-bulk-capture-key-left) !important; max-width: var(--ff-bulk-capture-key-width) !important; min-width: var(--ff-bulk-capture-key-width) !important; position: sticky !important; width: var(--ff-bulk-capture-key-width) !important; z-index: 7 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-bulk-receiver-col, .ff-v26-sticky-receiver-col) { left: var(--ff-bulk-capture-receiver-left) !important; max-width: var(--ff-bulk-capture-receiver-width) !important; min-width: var(--ff-bulk-capture-receiver-width) !important; position: sticky !important; width: var(--ff-bulk-capture-receiver-width) !important; z-index: 7 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-headers :is(.dx-header-row, .dx-datagrid-filter-row) > :is(td, th):is(.ff-bulk-select-col, .ff-bulk-receiver-id-col, .ff-bulk-key-col, .ff-bulk-receiver-col, .ff-v26-sticky-select-col, .ff-v26-sticky-id-col, .ff-v26-sticky-key-col, .ff-v26-sticky-receiver-col, .dx-command-select) { z-index: 12 !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-bulk-select-col, .ff-bulk-receiver-id-col, .ff-bulk-key-col, .ff-bulk-receiver-col, .ff-v26-sticky-select-col, .ff-v26-sticky-id-col, .ff-v26-sticky-key-col, .ff-v26-sticky-receiver-col, .dx-command-select) { background: var(--primary, #347cf5) !important; background-color: var(--primary, #347cf5) !important; color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-headers .dx-datagrid-filter-row > :is(td, th):is(.ff-bulk-select-col, .ff-bulk-receiver-id-col, .ff-bulk-key-col, .ff-bulk-receiver-col, .ff-v26-sticky-select-col, .ff-v26-sticky-id-col, .ff-v26-sticky-key-col, .ff-v26-sticky-receiver-col, .dx-command-select) { background: var(--surface, #fff) !important; background-color: var(--surface, #fff) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview .dx-data-row:not(.dx-row-alt):not(.dx-selection):not(.ff-dx-row-selected) > :is(td, th):is(.ff-bulk-select-col, .ff-bulk-receiver-id-col, .ff-bulk-key-col, .ff-bulk-receiver-col, .ff-v26-sticky-select-col, .ff-v26-sticky-id-col, .ff-v26-sticky-key-col, .ff-v26-sticky-receiver-col, .dx-command-select) { background: var(--surface, #fff) !important; background-color: var(--surface, #fff) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:not(.dx-selection):not(.ff-dx-row-selected) > :is(td, th):is(.ff-bulk-select-col, .ff-bulk-receiver-id-col, .ff-bulk-key-col, .ff-bulk-receiver-col, .ff-v26-sticky-select-col, .ff-v26-sticky-id-col, .ff-v26-sticky-key-col, .ff-v26-sticky-receiver-col, .dx-command-select) { background: var(--surface-2, #f6f6f6) !important; background-color: var(--surface-2, #f6f6f6) !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid .dx-datagrid-rowsview :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) { align-items: center !important; justify-content: center !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.ff-v26-native-select-checkbox, .ff-v26-native-select-all) { display: inline-block !important; height: 14px !important; left: 50% !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: top !important; width: 14px !important; } /* Absolute-final Tariffs filter layout correction. This sits after every shared grid/filter rule so Bootstrap col widths and the earlier generic span-4 fallback cannot make every field the same width. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { align-items: end !important; display: grid !important; gap: 6px 10px !important; grid-template-columns: repeat(24, minmax(0, 1fr)) !important; padding-bottom: 8px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > legend.ff-sr-legend { grid-column: 1 / -1 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) { display: contents !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row)::before, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row)::after, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::before, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row::after, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::before, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > [class*="col-"] { box-sizing: border-box !important; flex: none !important; float: none !important; grid-column: span 4 !important; margin: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > :is(.ff-tariff-id-field, .ff-tariff-category-field, .ff-tariff-account-field, .ff-tariff-from-pc-field, .ff-tariff-to-pc-field, .ff-tariff-from-kgs-field, .ff-tariff-to-kgs-field, .ff-tariff-ring-code-field, .ff-tariff-non-doc-field, .ff-tariff-zone-field, .ff-tariff-top-recs-field) { grid-column: span 3 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > :is(.ff-tariff-type-field, .ff-tariff-effective-date, .ff-tariff-service-field, .ff-tariff-origin-field, .ff-tariff-destination-field, .ff-tariff-origin-hub-field, .ff-tariff-destination-hub-field, .ff-tariff-town-area-field, .ff-tariff-box-field, .ff-tariff-rate-code-field) { grid-column: span 4 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > :is(.ff-tariff-agent-field, .ff-tariff-sender-field, .ff-tariff-receiver-field) { grid-column: span 5 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > .ff-tariff-client-field.ff-tariff-client-field { grid-column: span 7 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is(.form-group, .ff-control, .ff-ui, .ui-select-container, .ui-select-match, .ff-ms, .input-group, .input-icon) { max-width: 100% !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel :is(.form-control, .ui-select-container, .ui-select-match, .btn-group, .multiselect-parent) { max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row { align-items: end !important; display: grid !important; gap: 6px 10px !important; grid-column: 1 / -1 !important; grid-template-columns: minmax(210px, 280px) minmax(210px, 280px) minmax(24px, 1fr) max-content !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin: 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > .ff-filter-area-from.ff-filter-area-from { grid-column: 1 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > .ff-filter-area-to.ff-filter-area-to { grid-column: 2 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > .ff-filter-footer-actions.ff-filter-footer-actions { align-self: end !important; display: flex !important; grid-column: 4 !important; justify-content: flex-end !important; justify-self: end !important; margin-left: 0 !important; max-width: none !important; min-width: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner.ff-filter-footer-actions-inner { align-items: center !important; display: flex !important; flex: 0 0 auto !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin-left: 0 !important; max-width: none !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-keep-filter.ff-tariff-keep-filter { flex: 0 0 auto !important; margin: 0 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-column-loading-toggle, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-close-filter { align-items: center !important; display: inline-flex !important; flex: 0 0 34px !important; height: 34px !important; justify-content: center !important; max-width: 34px !important; min-width: 34px !important; padding-left: 0 !important; padding-right: 0 !important; width: 34px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-tariff-search.ff-tariff-search { flex: 0 0 190px !important; margin: 0 !important; max-width: 190px !important; min-width: 160px !important; width: 190px !important; } @media (max-width: 1180px) { html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { grid-template-columns: repeat(12, minmax(0, 1fr)) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row { grid-template-columns: minmax(210px, 1fr) minmax(210px, 1fr) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > .ff-filter-footer-actions.ff-filter-footer-actions { grid-column: 1 / -1 !important; justify-self: stretch !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner.ff-filter-footer-actions-inner { margin-left: auto !important; } } @media (max-width: 900px) { html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend { display: block !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row), html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row { display: flex !important; flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel fieldset.ff-sr-legend > .row:not(.ff-filter-final-row) > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-final-row.ff-filter-final-row > [class*="col-"] { flex: 1 1 100% !important; max-width: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-rates-tariffs.ff-tariffs-clean-baseline .ff-tariff-filter-panel .ff-filter-footer-actions-inner.ff-filter-footer-actions-inner { flex-wrap: wrap !important; width: 100% !important; } } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-images-list { background: var(--surface, #fff) !important; display: flex !important; flex-direction: column !important; gap: 12px !important; min-height: 75vh !important; padding: 12px !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-images-list .ff-images-frame { background: var(--surface, #fff) !important; border: 1px solid var(--border, #d7dde6) !important; height: auto !important; max-height: 75vh !important; min-height: 0 !important; object-fit: contain !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-images-preview { width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-images-list iframe.ff-images-frame { height: 75vh !important; min-height: 75vh !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-images-pane { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-external-image-error { align-items: center !important; background: var(--surface, #fff) !important; color: var(--text, #2b2f36) !important; display: flex !important; font-weight: 600 !important; gap: 10px !important; justify-content: center !important; min-height: 75vh !important; padding: 24px !important; text-align: center !important; } html body.ff-app.ff-app.ff-app .ff-internal-tracking.ff-internal-tracking--final .ff-external-image-error { color: var(--error, #ff4d4f) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar { margin: 0 0 2px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar-inner { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 4px 14px !important; min-height: 28px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar-inner::before, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar-inner::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar-inner > .checkbox { margin: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-list-toolbar-inner > .btn { align-self: center !important; line-height: 20px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-total { align-self: center !important; color: var(--text, #202124) !important; flex: 0 0 auto !important; font-size: 16px !important; font-weight: 600 !important; line-height: 24px !important; margin: 0 !important; text-align: left !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-parcel-list-body { margin-bottom: 0 !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-parcel-list-body > .row { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-parcel-list-body .table-responsive, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-parcel-list-body table.table { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-parcel-list-body table.table > thead > tr > th { text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-save-row { margin-top: -12px !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-save-row > [class*="col-"] { padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-save-row #btnsave { margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-save-row .checkbox { margin-bottom: 0 !important; margin-top: 6px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-field { flex: 0 0 282px !important; max-width: 282px !important; padding-left: 0 !important; padding-right: 0 !important; width: 282px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-field .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-input-group { align-items: stretch !important; display: flex !important; flex-wrap: nowrap !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-input-group #manNo { border-bottom-right-radius: 0 !important; border-right: 0 !important; border-top-right-radius: 0 !important; flex: 1 1 auto !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action { align-self: flex-start !important; flex: 0 0 42px !important; margin-left: 0 !important; margin-top: 0 !important; max-width: 42px !important; padding-left: 0 !important; padding-right: 0 !important; position: relative !important; top: -12px !important; width: 42px !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn-group, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn { margin: 0 !important; width: 42px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn { align-items: center !important; border-bottom-left-radius: 0 !important; border-top-left-radius: 0 !important; display: flex !important; height: 34px !important; justify-content: center !important; min-height: 34px !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action { flex: 0 0 var(--ff-ui-density-control-h, 26px) !important; max-width: var(--ff-ui-density-control-h, 26px) !important; width: var(--ff-ui-density-control-h, 26px) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn-group, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn { width: var(--ff-ui-density-control-h, 26px) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-action .btn { height: var(--ff-ui-density-control-h, 26px) !important; min-height: var(--ff-ui-density-control-h, 26px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-reference-field { flex: 1 1 0 !important; max-width: none !important; min-width: 0 !important; padding-left: 12px !important; padding-right: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-warning-count-row { line-height: 24px !important; margin: 0 0 4px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-warning-count-row h4 { font-size: 15px !important; line-height: 22px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-parcel-tracking-summary-grid-wrap #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--parcel-tracking-summary :is(td, th):is(.ff-parcel-tracking-select-col, .ff-v26-sticky-select-col, .dx-command-select) { max-width: 28px !important; min-width: 28px !important; width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-parcel-tracking-summary-grid-wrap #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--parcel-tracking-summary :is(td, th):is(.ff-parcel-tracking-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { max-width: 58px !important; min-width: 42px !important; width: 50px !important; } @media (max-width: 1024px) { html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-total { text-align: left !important; } } @media (max-width: 767px) { html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-row { flex-wrap: wrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-manifest-field { flex: 1 1 calc(100% - 42px) !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-tracking-reference-field { flex-basis: 100% !important; padding-left: 0 !important; width: 100% !important; } } /* Absolute-final View Payments Payment # and filter layout. PaymentID is now a business column, not a Show IDs column. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments { --ff-payments-filter-payment-id-width: 80px !important; --ff-payments-filter-batch-width: 160px !important; --ff-payments-filter-branch-width: 206px !important; --ff-payments-filter-client-width: 640px !important; --ff-payments-filter-acc-width: 160px !important; --ff-payments-filter-date-gap: 12px !important; --ff-payments-filter-date-period-width: 172px !important; --ff-payments-filter-date-range-width: 216px !important; --ff-payments-filter-user-width: var(--ff-payments-filter-branch-width) !important; --ff-v26-sticky-key-width: 116px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 5px var(--ff-payments-filter-date-gap) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters > .ff-finance-user-group, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block > .row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-period { flex: 0 0 var(--ff-payments-filter-date-period-width) !important; max-width: var(--ff-payments-filter-date-period-width) !important; min-width: var(--ff-payments-filter-date-period-width) !important; order: 10 !important; width: var(--ff-payments-filter-date-period-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-date-block .ff-finance-date-range { flex: 0 0 var(--ff-payments-filter-date-range-width) !important; margin-left: 0 !important; max-width: var(--ff-payments-filter-date-range-width) !important; min-width: var(--ff-payments-filter-date-range-width) !important; order: 11 !important; width: var(--ff-payments-filter-date-range-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-payment-id { flex: 0 0 var(--ff-payments-filter-payment-id-width) !important; max-width: var(--ff-payments-filter-payment-id-width) !important; min-width: var(--ff-payments-filter-payment-id-width) !important; order: 12 !important; width: var(--ff-payments-filter-payment-id-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-branch-filter { flex: 0 0 var(--ff-payments-filter-branch-width) !important; max-width: var(--ff-payments-filter-branch-width) !important; min-width: var(--ff-payments-filter-branch-width) !important; order: 13 !important; width: var(--ff-payments-filter-branch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex: 0 0 var(--ff-payments-filter-client-width) !important; max-width: var(--ff-payments-filter-client-width) !important; min-width: 320px !important; order: 14 !important; width: var(--ff-payments-filter-client-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-batch-filter { flex: 0 0 var(--ff-payments-filter-batch-width) !important; max-width: var(--ff-payments-filter-batch-width) !important; min-width: var(--ff-payments-filter-batch-width) !important; order: 20 !important; width: var(--ff-payments-filter-batch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-waybill-filter, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-ref-filter { flex: 0 0 var(--ff-payments-filter-batch-width) !important; max-width: var(--ff-payments-filter-batch-width) !important; min-width: var(--ff-payments-filter-batch-width) !important; width: var(--ff-payments-filter-batch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-waybill-filter { order: 21 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-ref-filter { order: 22 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card :is(.ff-finance-user-filter, .ff-finance-webuser-filter) { flex: 0 0 var(--ff-payments-filter-user-width) !important; max-width: var(--ff-payments-filter-user-width) !important; min-width: var(--ff-payments-filter-user-width) !important; width: var(--ff-payments-filter-user-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-user-filter { order: 23 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-webuser-filter { order: 24 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-acc-filter { flex: 0 0 var(--ff-payments-filter-acc-width) !important; max-width: var(--ff-payments-filter-acc-width) !important; min-width: var(--ff-payments-filter-acc-width) !important; order: 25 !important; width: var(--ff-payments-filter-acc-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card :is(.ff-finance-payment-id, .ff-finance-branch-filter, .ff-finance-client-filter, .ff-finance-batch-filter, .ff-finance-waybill-filter, .ff-finance-ref-filter, .ff-finance-user-filter, .ff-finance-webuser-filter, .ff-finance-acc-filter) :is(.form-group, .form-control, textarea, .ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices) { box-sizing: border-box !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments :is(td, th).dx-command-adaptive { border: 0 !important; display: none !important; max-width: 0 !important; min-width: 0 !important; padding: 0 !important; width: 0 !important; } @media (max-width: 1400px) { html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters > .ff-finance-client-filter { flex-basis: min(var(--ff-payments-filter-client-width), 100%) !important; max-width: 100% !important; } } /* Payment filters source-layout lock. These target the direct Payment-only fields added to financesfilters.html, so the shared Bootstrap finance filter grid cannot force a second row. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card { --ff-payment-filter-date-period-width: 172px !important; --ff-payment-filter-date-range-width: 216px !important; --ff-payment-filter-field-gap: 4px !important; --ff-payment-filter-current-batch-width: 206px !important; --ff-payment-filter-batch-width: 103px !important; --ff-payment-filter-payment-id-width: 80px !important; --ff-payment-filter-branch-width: 263px !important; --ff-payment-filter-user-width: 210px !important; --ff-payment-filter-client-width: 412px !important; --ff-payment-filter-acc-width: 103px !important; --ff-filter-date-period-width-final: var(--ff-payment-filter-date-period-width) !important; --ff-filter-date-range-width-final: var(--ff-payment-filter-date-range-width) !important; --ff-filter-date-period-ignore-width-final: 78px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment { align-items: flex-start !important; display: flex !important; flex-wrap: wrap !important; gap: 6px var(--ff-payment-filter-field-gap) !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment::after, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment .ff-finance-user-row > [class*="col-"] { box-sizing: border-box !important; float: none !important; margin-left: 0 !important; margin-right: 0 !important; min-height: 0 !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > .ff-finance-date-period--payment { --ff-filter-date-period-width-final: var(--ff-payment-filter-date-period-width) !important; --ff-filter-date-period-ignore-width-final: 78px !important; flex: 0 0 var(--ff-payment-filter-date-period-width) !important; max-width: var(--ff-payment-filter-date-period-width) !important; min-width: var(--ff-payment-filter-date-period-width) !important; order: 10 !important; width: var(--ff-payment-filter-date-period-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > .ff-finance-date-range--payment { --ff-filter-date-range-width-final: var(--ff-payment-filter-date-range-width) !important; flex: 0 0 var(--ff-payment-filter-date-range-width) !important; max-width: var(--ff-payment-filter-date-range-width) !important; min-width: var(--ff-payment-filter-date-range-width) !important; order: 11 !important; width: var(--ff-payment-filter-date-range-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > .ff-finance-payment-id { flex: 0 0 var(--ff-payment-filter-payment-id-width) !important; max-width: var(--ff-payment-filter-payment-id-width) !important; min-width: var(--ff-payment-filter-payment-id-width) !important; order: 12 !important; width: var(--ff-payment-filter-payment-id-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > .ff-finance-branch-filter { flex: 0 0 var(--ff-payment-filter-branch-width) !important; max-width: var(--ff-payment-filter-branch-width) !important; min-width: var(--ff-payment-filter-branch-width) !important; order: 13 !important; width: var(--ff-payment-filter-branch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment > .ff-finance-client-filter { flex: 0 0 var(--ff-payment-filter-client-width) !important; max-width: var(--ff-payment-filter-client-width) !important; min-width: var(--ff-payment-filter-client-width) !important; order: 14 !important; width: var(--ff-payment-filter-client-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-batch-filter { flex: 0 0 var(--ff-payment-filter-batch-width) !important; max-width: var(--ff-payment-filter-batch-width) !important; min-width: var(--ff-payment-filter-batch-width) !important; order: 20 !important; width: var(--ff-payment-filter-batch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-waybill-filter, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-ref-filter { flex: 0 0 var(--ff-payment-filter-current-batch-width) !important; max-width: var(--ff-payment-filter-current-batch-width) !important; min-width: var(--ff-payment-filter-current-batch-width) !important; width: var(--ff-payment-filter-current-batch-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-waybill-filter { order: 21 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-ref-filter { order: 22 !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment > .ff-finance-user-group { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment .ff-finance-user-row { display: contents !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment .ff-finance-user-filter { flex: 0 0 var(--ff-payment-filter-user-width) !important; max-width: var(--ff-payment-filter-user-width) !important; min-width: var(--ff-payment-filter-user-width) !important; order: 23 !important; width: var(--ff-payment-filter-user-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment .ff-finance-webuser-filter { flex: 0 0 var(--ff-payment-filter-user-width) !important; max-width: var(--ff-payment-filter-user-width) !important; min-width: var(--ff-payment-filter-user-width) !important; order: 24 !important; width: var(--ff-payment-filter-user-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-secondary-filters--payment .ff-finance-acc-filter { flex: 0 0 var(--ff-payment-filter-acc-width) !important; max-width: var(--ff-payment-filter-acc-width) !important; min-width: var(--ff-payment-filter-acc-width) !important; order: 25 !important; width: var(--ff-payment-filter-acc-width) !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card :is(.ff-finance-primary-filters--payment, .ff-finance-secondary-filters--payment) :is(.form-group, .form-control, textarea, .ui-select-container, .ui-select-bootstrap, .ui-select-match, .ui-select-toggle, .btn, .ui-select-choices, .range-picker, .ff-date-period-group) { box-sizing: border-box !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment .ff-date-period-ignore { flex: 0 0 78px !important; max-width: 78px !important; min-width: 78px !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment .ff-date-period-select { flex: 0 0 94px !important; max-width: 94px !important; min-width: 94px !important; width: 94px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment .range-picker :is(.start-date, .end-date) { flex: 0 0 96px !important; max-width: 96px !important; min-width: 96px !important; width: 96px !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-view-payments .ff-sr-card .ff-finance-primary-filters--payment .range-picker > .input-group-addon { flex: 0 0 24px !important; max-width: 24px !important; min-width: 24px !important; width: 24px !important; } /* Capture parcel grids: keep the right edge visible instead of painting it on the clipped container boundary. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-parcel-grid-responsive { --ff-capture-parcel-grid-right-gutter: 10px; box-sizing: border-box !important; padding-right: var(--ff-capture-parcel-grid-right-gutter) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page table.custom-dx-table.ff-parcel-grid { box-sizing: border-box !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page table.custom-dx-table.ff-parcel-grid.table-bordered { border-bottom: 1px solid var(--border) !important; border-right: 1px solid var(--border) !important; } /* Credit/Debit Note Capture line grid: match the View Waybills blue header and center the captions regardless of legacy text-left/text-right classes. */ html body.ff-app.ff-app.ff-app .ff-finance.ff-capture-page table.custom-dx-table.ff-crdr-line-table > thead { background: #337bf2 !important; background-color: #337bf2 !important; } html body.ff-app.ff-app.ff-app .ff-finance.ff-capture-page table.custom-dx-table.ff-crdr-line-table > thead > tr.ff-parcel-grid-headrow > td.ff-parcel-grid-th { background: #337bf2 !important; background-color: #337bf2 !important; border-bottom-color: #2b68d3 !important; border-right-color: rgba(255, 255, 255, 0.28) !important; color: #fff !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-finance.ff-capture-page table.custom-dx-table.ff-crdr-line-table > thead > tr.ff-parcel-grid-headrow > td.ff-parcel-grid-th:last-child { border-right-color: #2b68d3 !important; } /* Tariffs grid final polish: reclaim bottom whitespace and align compact selector/boolean checkboxes. */ html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(487px, min(calc(145dvh - 394px), calc(100dvh - 117px)), 1543px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(487px, min(calc(145dvh - 418px), calc(100dvh - 137px)), 1543px) !important; } /* Tariffs page-height guard: keep only the data rows scrollbar. The rowsview keeps a fixed body height, while outer grid/page shells must not grow past the footer and create page or whole-grid vertical scrollbars. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(360px, min(calc(145dvh - 523px), calc(100dvh - 246px)), 980px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(360px, min(calc(145dvh - 543px), calc(100dvh - 266px)), 960px) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-tariff-clone-options-open { --ff-standard-grid-rows-max-height: clamp(220px, min(calc(145dvh - 705px), calc(100dvh - 425px)), 760px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-tariff-clone-options-open { --ff-standard-grid-rows-max-height: clamp(220px, min(calc(145dvh - 730px), calc(100dvh - 450px)), 740px) !important; } html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td, th).dx-command-select > .ff-v26-native-select-checkbox, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td, th):not(.dx-command-select) > .ff-grid-boolean-checkbox, html body.ff-app.ff-app.ff-app .ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(td, th):not(.dx-command-select) > :is(.dx-checkbox, .dx-select-checkbox) { position: relative !important; top: -2px !important; } /* Absolute-final Tariffs v26 single-table width guard. This is the same class of fault as the Query page: the rowsview can keep a narrow body surface while the header/filter row spans the grid. Keep Tariffs on the CSS-sticky single-table path and let the DevExtreme colgroup define one natural width for header, rows, and footer. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid, .dx-gridbase-container) { overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } /* Tariffs fast native selector: keep click feedback immediate and draw a real tick instead of the browser's filled checkbox accent. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox) { -webkit-appearance: none !important; appearance: none !important; background: var(--surface, #fff) !important; border: 1px solid color-mix(in srgb, var(--border, #b9c2d0) 72%, var(--text-muted, #666)) !important; border-radius: 2px !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .28) !important; box-sizing: border-box !important; cursor: pointer !important; display: inline-block !important; height: 14px !important; margin: 0 auto !important; padding: 0 !important; position: relative !important; vertical-align: middle !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox):checked { background: var(--primary, #337bf2) !important; border-color: var(--primary, #337bf2) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox):checked::after { border: solid #fff !important; border-width: 0 2px 2px 0 !important; content: "" !important; display: block !important; height: 8px !important; left: 4px !important; position: absolute !important; top: 1px !important; transform: rotate(45deg) !important; width: 4px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox):indeterminate { background: var(--primary, #337bf2) !important; border-color: var(--primary, #337bf2) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox):indeterminate::after { background: #fff !important; content: "" !important; display: block !important; height: 2px !important; left: 3px !important; position: absolute !important; top: 5px !important; width: 6px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) input[type="checkbox"]:is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox):focus-visible { outline: 2px solid color-mix(in srgb, var(--primary, #337bf2) 55%, transparent) !important; outline-offset: 1px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview { display: block !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable-wrapper, .dx-scrollable-container) { display: block !important; flex: 1 1 auto !important; flex-basis: auto !important; max-width: 100% !important; min-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-tariffs-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; width: var(--ff-tariffs-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-tariffs-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; table-layout: fixed !important; width: var(--ff-tariffs-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-scrollable-content, .dx-datagrid-table, table) { display: none !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) { display: block !important; min-height: 100% !important; opacity: 1 !important; visibility: visible !important; } /* Absolute-final v26 data checkbox alignment. Lift only direct row checkbox wrappers/inputs; do not change row height or nested DevExtreme checkbox parts, otherwise some pages double-apply the move. */ html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th) > :is(.ff-v26-native-select-checkbox, .ff-invoice-native-select-checkbox, .ff-waybill-native-select-checkbox, input[type="checkbox"], .ff-grid-boolean-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, .ff-invoice-native-select-checkbox, .ff-waybill-native-select-checkbox, input[type="checkbox"], .ff-grid-boolean-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { position: relative !important; top: -2px !important; transform: none !important; } /* Tariffs selector alignment. The shared dense-grid checkbox lift is too high for the Tariffs native selector column after the v26 single-table conversion. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tariff-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox), html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tariff-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox) { position: relative !important; top: 0 !important; transform: none !important; vertical-align: middle !important; } /* Absolute-final v26 eye icon alignment. Lift the painted eye icon only; keep the action cell size and sticky layout unchanged. */ html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-action-col, .ff-invoice-view-command-col, .ff-invoice-view-waybill-command-col, .ff-payments-view-command-col, .ff-quote-command-col, .ff-manifest-command-col, .ff-image-command-col, .ff-tracking-command-col, .dx-command-edit) :is(.ff-invoice-view-eye-button, .fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye, .dx-icon-eyeopen), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-action-col, .ff-invoice-view-command-col, .ff-invoice-view-waybill-command-col, .ff-payments-view-command-col, .ff-quote-command-col, .ff-manifest-command-col, .ff-image-command-col, .ff-tracking-command-col, .dx-command-edit) :is(.ff-invoice-view-eye-button, .fa-eye, .fa.fa-eye, .dx-icon.fa-eye, .dx-icon-eye, .dx-icon-eyeopen)::before { position: relative !important; top: -2px !important; } /* View Payments final action/selector alignment. Keep the native selector and print action centered in compact payment rows. */ html body.ff-app.ff-app.ff-app .ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-payments-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox), html body.ff-app.ff-app.ff-app .ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-payments-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { position: relative !important; top: -2px !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-payments-view-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.fa-print, .fa.fa-print, .dx-icon.fa-print, .dx-icon-print, .dx-icon.fa)::before, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-v26-grid-blueprint.ff-standard-grid-page.ff-payments-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--payments .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-payments-view-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.fa-print, .fa.fa-print, .dx-icon.fa-print, .dx-icon-print, .dx-icon.fa) { position: relative !important; top: -2px !important; } /* View Tracking final action/selector alignment. */ html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td.dx-command-edit, th.dx-command-edit, .ff-tracking-command-col, .ff-v26-sticky-action-col) { max-width: 42px !important; min-width: 42px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 42px !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tracking-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox), html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tracking-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox, .dx-checkbox.dx-widget, .dx-select-checkbox) { position: relative !important; top: -3px !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-view-tracking.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tracking .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-tracking-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.ff-grid-row-action-buttons, .ff-tracking-row-action-buttons, .ff-grid-row-action-button, .ff-tracking-row-print-button) { align-items: center !important; display: inline-flex !important; justify-content: center !important; margin-left: auto !important; margin-right: auto !important; } /* Absolute-final capture time validation highlight. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page input.ff-invalid-time, html body.ff-app.ff-app.ff-app .ff-formpage.ff-capture-page input.ff-invalid-time { background: #fff2f2 !important; background: color-mix(in srgb, var(--error, #ff4d4f) 12%, var(--surface, #fff)) !important; border-color: #ff8f8f !important; border-color: color-mix(in srgb, var(--error, #ff4d4f) 58%, var(--border, #d7dee8)) !important; color: var(--error, #ff4d4f) !important; } /* Tariffs native scrollbar persistence. Keep the rows scrollbar painted even when scrolled to the bottom. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-y: scroll !important; scrollbar-color: color-mix(in srgb, var(--text-muted, #666) 68%, var(--surface, #fff)) color-mix(in srgb, var(--border, #d7dee8) 52%, var(--surface, #fff)) !important; scrollbar-gutter: stable !important; scrollbar-width: auto !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar { background: color-mix(in srgb, var(--border, #d7dee8) 52%, var(--surface, #fff)) !important; height: 15px !important; width: 15px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--text-muted, #666) 68%, var(--surface, #fff)) !important; border: 3px solid color-mix(in srgb, var(--border, #d7dee8) 52%, var(--surface, #fff)) !important; border-radius: 8px !important; min-height: 34px !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-corner, html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container::-webkit-scrollbar-track { background: color-mix(in srgb, var(--border, #d7dee8) 52%, var(--surface, #fff)) !important; } /* Tariffs native horizontal scroll authority. The grid uses the rowsview browser scrollbar; DevExtreme's overlay bar can sit above it and swallow track clicks without moving the native scrollLeft. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-total-footer) .dx-scrollable-container { overflow-x: hidden !important; overflow-y: hidden !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers :is(.dx-header-row, .dx-filter-row) > :is(td, th):is(.ff-tariff-select-col, .ff-v26-sticky-select-col, .dx-command-select) { background-clip: padding-box !important; left: var(--ff-v26-sticky-select-left, 0px) !important; max-width: var(--ff-v26-sticky-select-width, 30px) !important; min-width: var(--ff-v26-sticky-select-width, 30px) !important; position: sticky !important; width: var(--ff-v26-sticky-select-width, 30px) !important; z-index: 180 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-tariff-select-col, .ff-v26-sticky-select-col, .dx-command-select) { background: var(--primary, #337bf2) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row > :is(td, th):is(.ff-tariff-select-col, .ff-v26-sticky-select-col, .dx-command-select) { background: var(--surface, #fff) !important; color: var(--text, inherit) !important; z-index: 179 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers :is(.dx-header-row, .dx-filter-row) > :is(td, th).ff-v26-sticky-id-col { background-clip: padding-box !important; left: var(--ff-v26-sticky-id-left, var(--ff-v26-sticky-select-width, 30px)) !important; max-width: var(--ff-v26-sticky-id-width, 78px) !important; min-width: var(--ff-v26-sticky-id-width, 78px) !important; position: sticky !important; width: var(--ff-v26-sticky-id-width, 78px) !important; z-index: 178 !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row > :is(td, th).ff-v26-sticky-id-col { background: var(--primary, #337bf2) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row > :is(td, th).ff-v26-sticky-id-col { background: var(--surface, #fff) !important; color: var(--text, inherit) !important; z-index: 177 !important; } /* Tariffs Show IDs: sticky TariffID cells sit above the grid body, so redraw their cell borders after the final Tariffs scrollbar/width rules. */ html body.ff-app.ff-app.ff-app .ff-page.ff-rates-tariffs.ff-tariffs.ff-standard-grid-page.ff-tariffs-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--tariffs.ff-standard-grid-css-owned.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-v26-sticky-id-col { border-bottom: 1px solid var(--ff-tariffs-grid-line, var(--border, #d9dde5)) !important; border-left: 1px solid var(--ff-tariffs-grid-line, var(--border, #d9dde5)) !important; border-right: 1px solid var(--ff-tariffs-grid-line, var(--border, #d9dde5)) !important; box-shadow: inset 1px 0 0 var(--ff-tariffs-grid-line, var(--border, #d9dde5)), inset -1px 0 0 var(--ff-tariffs-grid-line, var(--border, #d9dde5)), inset 0 -1px 0 var(--ff-tariffs-grid-line, var(--border, #d9dde5)) !important; } /* View Images final action/sticky polish. Keep after the shared v26 action rules so print/email remain centered. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { max-width: 52px !important; min-width: 52px !important; padding-left: 0 !important; padding-right: 0 !important; width: 52px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { overflow: visible !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-image-row-action-buttons { align-items: center !important; display: inline-flex !important; gap: 5px !important; height: 100% !important; justify-content: center !important; margin: 0 auto !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-grid-row-action-button { align-items: center !important; background: transparent !important; border: 0 !important; color: var(--primary, #2f77f3) !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; min-height: 18px !important; min-width: 18px !important; padding: 0 !important; position: static !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.dx-button, .dx-link, a) { align-items: center !important; display: inline-flex !important; height: 100% !important; justify-content: center !important; left: 0 !important; line-height: 1 !important; margin: 0 auto !important; max-width: none !important; min-height: 100% !important; overflow: visible !important; padding: 0 !important; position: absolute !important; right: 0 !important; top: 50% !important; transform: translateY(-50%) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.dx-button-content, .dx-icon, .fa-eye, .dx-icon.fa-eye) { align-items: center !important; display: inline-flex !important; height: 100% !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-width: none !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-image-command-col, .ff-v26-sticky-action-col, .dx-command-edit) :is(.fa-eye, .dx-icon.fa-eye)::before { line-height: 1 !important; margin: 0 !important; position: static !important; top: auto !important; transform: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is( .ff-image-select-col, .ff-image-command-col, .ff-image-key-col, .ff-image-key2-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit ) { border-bottom: 1px solid var(--border, #d9dde5) !important; border-left: 1px solid var(--border, #d9dde5) !important; border-right: 1px solid var(--border, #d9dde5) !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-image-key2-col, .ff-v26-sticky-key2-col) { box-shadow: inset -1px 0 0 var(--border, #d9dde5) !important; } /* View Images final height and selector alignment. Keep the page scrollbar away while the grid keeps its own row scrollbar. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-standard-grid-rows-max-height) !important; --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 277px), 850px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(370px, calc(100dvh - 297px), 850px) !important; } @supports not (height: clamp(1px, 2px, 3px)) { html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 277px) !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: calc(100vh - 297px) !important; } } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-select-col, .ff-image-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox), html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-select-col, .ff-image-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox) { position: relative !important; top: -2px !important; transform: none !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-header { align-items: flex-end !important; display: flex !important; gap: 8px !important; justify-content: space-between !important; min-height: 58px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-title { flex: 1 1 auto !important; margin: 0 !important; min-width: 0 !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar { align-items: center !important; display: flex !important; flex: 0 0 auto !important; gap: 6px !important; justify-content: flex-end !important; margin-left: 0 !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-status { align-items: center !important; align-self: flex-end !important; color: color-mix(in srgb, var(--muted-text, #5f6b7a) 70%, var(--surface, #fff)) !important; display: inline-flex !important; flex: 0 1 170px !important; font-size: 12px !important; font-weight: 600 !important; gap: 6px !important; justify-content: center !important; line-height: 16px !important; margin-bottom: 3px !important; max-width: 170px !important; min-width: 0 !important; overflow: hidden !important; text-align: center !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-status-spinner { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 2px solid color-mix(in srgb, var(--primary, #337bf2) 28%, var(--surface, #fff)) !important; border-radius: 50% !important; border-top-color: var(--primary, #337bf2) !important; display: inline-block !important; flex: 0 0 14px !important; height: 14px !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn { align-items: center !important; display: inline-flex !important; gap: 6px !important; min-height: 34px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-nav-group { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; gap: 4px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn { flex: 0 0 36px !important; justify-content: center !important; min-width: 36px !important; padding-left: 0 !important; padding-right: 0 !important; width: 36px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn .fa { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn--jump { flex-basis: 22px !important; min-height: 28px !important; min-width: 22px !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn--jump[disabled], html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn--jump[disabled]:active, html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn--jump[disabled]:focus, html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .ff-image-preview-nav-btn--jump[disabled]:hover { background-color: var(--surface, #fff) !important; border-color: var(--border, #d7dee8) !important; box-shadow: none !important; color: color-mix(in srgb, var(--muted-text, #5f6b7a) 50%, var(--surface, #fff)) !important; cursor: default !important; opacity: 0.62 !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-nav-spacer { flex: 0 0 22px !important; height: 34px !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o { color: var(--primary, #337bf2) !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o > * { color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o:active, html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o:focus, html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o:focus-visible, html body.ff-app.ff-app.ff-app .ff-image-preview-toolbar .btn.btn-primary.btn-o.active { background-color: var(--primary, #337bf2) !important; border-color: var(--primary, #337bf2) !important; box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary, #337bf2) 24%, transparent) !important; color: #fff !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-position { align-items: center !important; color: var(--muted-text, #5f6b7a) !important; display: inline-flex !important; flex: 0 0 auto !important; font-size: 14px !important; font-weight: 700 !important; justify-content: center !important; min-height: 34px !important; min-width: 34px !important; padding: 0 1px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-position-main { display: block !important; line-height: 16px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-meta { align-items: flex-start !important; color: color-mix(in srgb, var(--muted-text, #5f6b7a) 78%, var(--surface, #fff)) !important; display: inline-flex !important; flex: 0 1 150px !important; flex-direction: column !important; font-size: 11px !important; font-weight: 600 !important; justify-content: center !important; line-height: 13px !important; max-width: 150px !important; min-height: 34px !important; min-width: 0 !important; white-space: normal !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-meta-line, html body.ff-app.ff-app.ff-app .ff-image-preview-meta-size { display: block !important; max-width: 100% !important; overflow: visible !important; overflow-wrap: anywhere !important; text-overflow: clip !important; word-break: break-word !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-meta-line { max-height: 26px !important; white-space: normal !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-meta-size { white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-meta-size { color: color-mix(in srgb, var(--muted-text, #5f6b7a) 84%, var(--surface, #fff)) !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-position-meta { color: color-mix(in srgb, var(--muted-text, #5f6b7a) 78%, var(--surface, #fff)) !important; display: block !important; font-size: 11px !important; font-weight: 600 !important; line-height: 14px !important; max-width: 220px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-position-size { color: color-mix(in srgb, var(--muted-text, #5f6b7a) 84%, var(--surface, #fff)) !important; display: block !important; font-size: 11px !important; font-weight: 600 !important; line-height: 14px !important; max-width: 220px !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .modal.ff-mail-aside--front, html body.ff-app.ff-app.ff-app .aside.ff-mail-aside--front, html body.ff-app.ff-app.ff-app .ff-mail-aside--front { z-index: 43050 !important; } html body.ff-app.ff-app.ff-app .modal-backdrop.ff-mail-backdrop--front, html body.ff-app.ff-app.ff-app .ff-mail-backdrop--front { z-index: 43040 !important; } html body.ff-app.ff-app.ff-app .ff-mail-aside--front .ui-select-dropdown, html body.ff-app.ff-app.ff-app .ff-mail-aside--front .ui-select-choices, html body.ff-app.ff-app.ff-app .ff-mail-aside--front .dropdown-menu { z-index: 43060 !important; } html body.ff-app.ff-app.ff-app .swal2-container.ff-image-mail-scope-swal { z-index: 43070 !important; } html body.ff-app.ff-app.ff-app .swal2-container.ff-image-download-scope-swal { z-index: 43070 !important; } html body.ff-app.ff-app.ff-app .swal2-container.ff-image-print-scope-swal, html body.ff-app.ff-app.ff-app .swal2-container.ff-image-option-scope-swal { z-index: 43070 !important; } html body.ff-app.ff-app.ff-app .swal2-container.ff-image-download-scope-swal .swal2-html-container, html body.ff-app.ff-app.ff-app .swal2-container.ff-image-mail-scope-swal .swal2-html-container, html body.ff-app.ff-app.ff-app .swal2-container.ff-image-print-scope-swal .swal2-html-container, html body.ff-app.ff-app.ff-app .swal2-container.ff-image-option-scope-swal .swal2-html-container { margin-top: 12px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-choice-intro { margin: 0 auto 12px auto !important; max-width: 520px !important; text-align: left !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-choice-list, html body.ff-app.ff-app.ff-app .ff-image-download-choice-list { display: flex !important; flex-direction: column !important; gap: 10px !important; margin: 0 auto !important; max-width: 360px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-choice, html body.ff-app.ff-app.ff-app .ff-image-download-choice { align-items: center !important; background: var(--surface, #fff) !important; border: 1px solid var(--primary, #337bf2) !important; border-radius: 6px !important; color: var(--primary, #337bf2) !important; cursor: pointer !important; display: flex !important; font-size: 15px !important; font-weight: 700 !important; justify-content: center !important; min-height: 42px !important; padding: 8px 12px !important; text-align: center !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-choice--default { box-shadow: 0 0 0 2px color-mix(in srgb, var(--primary, #337bf2) 22%, transparent) !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-choice:hover, html body.ff-app.ff-app.ff-app .ff-image-preview-choice:focus, html body.ff-app.ff-app.ff-app .ff-image-preview-choice:focus-visible, html body.ff-app.ff-app.ff-app .ff-image-download-choice:hover, html body.ff-app.ff-app.ff-app .ff-image-download-choice:focus, html body.ff-app.ff-app.ff-app .ff-image-download-choice:focus-visible { background: var(--primary, #337bf2) !important; color: #fff !important; outline: none !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-stage { background: var(--surface, #fff) !important; height: 85vh !important; overflow: auto !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-item { margin-bottom: 12px !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-img { display: block !important; margin: 0 auto !important; max-height: 100% !important; max-width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-frame { border: 0 !important; display: block !important; height: 100% !important; min-height: 720px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-loading { align-items: center !important; background: color-mix(in srgb, var(--surface, #fff) 88%, transparent) !important; color: var(--text, #2b2f36) !important; display: flex !important; font-weight: 600 !important; gap: 10px !important; inset: 0 !important; justify-content: center !important; position: absolute !important; z-index: 4 !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-loading.ff-image-preview-loading--hidden { display: none !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-spinner { animation: ff-waybill-filter-spin 0.75s linear infinite !important; border: 3px solid color-mix(in srgb, var(--primary, #337bf2) 28%, var(--surface, #fff)) !important; border-radius: 50% !important; border-top-color: var(--primary, #337bf2) !important; display: inline-block !important; height: 28px !important; width: 28px !important; } html body.ff-app.ff-app.ff-app:has(.ff-external-image-loading) #loading-bar, html body.ff-app.ff-app.ff-app:has(.ff-external-image-loading) #loading-bar-spinner, html body.ff-app.ff-app.ff-app:has(.ff-image-preview-loading:not(.ng-hide):not(.ff-image-preview-loading--hidden)) #loading-bar, html body.ff-app.ff-app.ff-app:has(.ff-image-preview-loading:not(.ng-hide):not(.ff-image-preview-loading--hidden)) #loading-bar-spinner { display: none !important; opacity: 0 !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-external-image-loading)::before, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-external-image-loading)::after, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-image-preview-loading:not(.ng-hide):not(.ff-image-preview-loading--hidden))::before, html body.ff-app.ff-app.ff-app .app-content:is(.csspinner, .loading, .load1, .load2):has(.ff-image-preview-loading:not(.ng-hide):not(.ff-image-preview-loading--hidden))::after { animation: none !important; content: none !important; display: none !important; opacity: 0 !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-load-error { background: color-mix(in srgb, var(--error, #ff4d4f) 10%, var(--surface, #fff)) !important; border: 1px solid color-mix(in srgb, var(--error, #ff4d4f) 50%, var(--border, #d7dee8)) !important; border-radius: 6px !important; color: var(--error, #ff4d4f) !important; font-weight: 600 !important; left: 16px !important; padding: 8px 12px !important; position: absolute !important; top: 16px !important; z-index: 5 !important; } html body.ff-app.ff-app.ff-app .ff-image-preview-load-error.ff-image-preview-load-error--visible { display: block !important; } /* Tiny inline copy affordance for record key fields. */ html body.ff-app.ff-app.ff-app .ff-waybill-copy-field, html body.ff-app.ff-app.ff-app .ff-record-copy-field { max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill-copy-field .ff-waybill-copy-btn, html body.ff-app.ff-app.ff-app .ff-record-copy-field .ff-record-copy-btn { align-items: center !important; background: var(--surface, #fff) !important; border-color: var(--border-strong, #b8c0cc) !important; color: var(--primary, #337bf2) !important; display: inline-flex !important; font-size: 13px !important; height: 100% !important; justify-content: center !important; min-height: 34px !important; min-width: 30px !important; padding: 0 !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-waybill-copy-field .ff-waybill-copy-btn:hover, html body.ff-app.ff-app.ff-app .ff-waybill-copy-field .ff-waybill-copy-btn:focus, html body.ff-app.ff-app.ff-app .ff-record-copy-field .ff-record-copy-btn:hover, html body.ff-app.ff-app.ff-app .ff-record-copy-field .ff-record-copy-btn:focus { background: color-mix(in srgb, var(--primary, #337bf2) 10%, var(--surface, #fff)) !important; border-color: var(--primary, #337bf2) !important; color: var(--primary, #337bf2) !important; } html body.ff-app.ff-app.ff-app .ff-waybill-copy-field .ff-waybill-copy-btn .fa, html body.ff-app.ff-app.ff-app .ff-record-copy-field .ff-record-copy-btn .fa { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-record-copy-label-btn { align-items: center !important; background: var(--surface, #fff) !important; border-color: var(--border-strong, #b8c0cc) !important; color: var(--primary, #337bf2) !important; display: inline-flex !important; font-size: 11px !important; height: 20px !important; justify-content: center !important; margin-left: 6px !important; min-height: 20px !important; min-width: 22px !important; padding: 0 !important; vertical-align: middle !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-record-copy-label-btn:hover, html body.ff-app.ff-app.ff-app .ff-record-copy-label-btn:focus { background: color-mix(in srgb, var(--primary, #337bf2) 10%, var(--surface, #fff)) !important; border-color: var(--primary, #337bf2) !important; color: var(--primary, #337bf2) !important; } html body.ff-app.ff-app.ff-app .ff-record-copy-label-btn .fa { margin: 0 !important; } /* Full Capture Basic Details first-paint layout lock. The Waybill # caption and neighboring ui-selects are populated by Angular in separate passes, so reserve the final label/control height before data lands. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label.width100 { align-items: center !important; display: flex !important; height: 18px !important; line-height: 16px !important; margin: 0 0 2px !important; min-height: 18px !important; overflow: visible !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row { --ff-full-basic-label-stack-h: 20px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label .symbol.required, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label .symbol.required::before { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; font-size: 15px !important; height: 16px !important; line-height: 16px !important; margin-top: 0 !important; min-height: 16px !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-1 > .form-group, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-3 > .form-group { margin-bottom: 0 !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-1 > .form-group > .error, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-3 > .form-group > .error { left: 0 !important; line-height: 12px !important; margin: 0 !important; min-height: 12px !important; pointer-events: none !important; position: absolute !important; top: calc(var(--ff-full-basic-label-stack-h, 20px) + var(--ff-control-h, 34px) + 2px) !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-courier-action { padding-top: var(--ff-full-basic-label-stack-h, 20px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-waybill-copy-field, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-record-copy-field { align-items: stretch !important; display: flex !important; height: var(--ff-control-h, 34px) !important; min-height: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-waybill-copy-field > input.form-control, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-record-copy-field > input.form-control { flex: 1 1 auto !important; height: var(--ff-control-h, 34px) !important; max-height: var(--ff-control-h, 34px) !important; min-height: var(--ff-control-h, 34px) !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-waybill-copy-field > .input-group-btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-record-copy-field > .input-group-btn { flex: 0 0 30px !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-waybill-copy-field > .input-group-btn > .ff-waybill-copy-btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .ff-record-copy-field > .input-group-btn > .ff-record-copy-btn { height: var(--ff-control-h, 34px) !important; max-height: var(--ff-control-h, 34px) !important; min-height: var(--ff-control-h, 34px) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row :is(.ff-waybill-copy-field, .ff-record-copy-field) > .input-group-btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row :is(.ff-waybill-copy-field, .ff-record-copy-field) > .input-group-btn { align-self: center !important; display: flex !important; flex: 0 0 30px !important; height: 32px !important; max-height: 32px !important; min-height: 32px !important; width: 30px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row :is(.ff-waybill-copy-field, .ff-record-copy-field) > .input-group-btn > :is(.ff-waybill-copy-btn, .ff-record-copy-btn), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row :is(.ff-waybill-copy-field, .ff-record-copy-field) > .input-group-btn > :is(.ff-waybill-copy-btn, .ff-record-copy-btn) { align-self: center !important; height: 32px !important; line-height: 1 !important; max-height: 32px !important; min-height: 32px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row .form-group > label { height: 12px !important; line-height: 12px !important; margin: 0 0 1px !important; min-height: 12px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row { --ff-full-basic-label-stack-h: 13px; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-courier-action, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-docs .ff-full-courier-action { padding-top: var(--ff-full-basic-label-stack-h, 13px) !important; } /* Full Capture Origin/Destination town locks: keep the compact lock controls from increasing the label height and pushing the town lists down. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-quick-town-label { align-items: flex-start !important; line-height: 16px !important; margin-bottom: -1px !important; min-height: 16px !important; overflow: visible !important; padding-right: 72px !important; position: relative !important; z-index: 3 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-quick-town-label-actions { align-items: center !important; gap: 3px !important; min-width: 0 !important; position: absolute !important; right: 4px !important; top: -4px !important; z-index: 4 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-quick-town-label-actions .ff-quick-town-lock { border-radius: 4px !important; flex: 0 0 18px !important; height: 18px !important; line-height: 16px !important; min-height: 18px !important; min-width: 18px !important; padding: 0 !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-quick-town-label-actions .ff-quick-town-lock i { font-size: 10px !important; line-height: 1 !important; } /* Absolute-final View Credits/Debits sticky-column polish. Trans # and Trans Date are both sticky data columns, with fixed-cell borders and sparse-body guide lines so totals line up clearly after short result sets. */ html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-standard-grid-css-owned { --ff-crdr-sticky-alt-bg: #f6f6f6 !important; --ff-crdr-sticky-bg: var(--surface, #fff) !important; --ff-crdr-sticky-grid-line: var(--border, #d9dde5) !important; --ff-crdr-sticky-selected-alt-bg: #fff0a6 !important; --ff-crdr-sticky-selected-bg: #fff4bf !important; --ff-v26-sticky-action-width: 32px !important; --ff-v26-sticky-key-width: 73px !important; --ff-v26-sticky-key2-width: 108px !important; --ff-v26-sticky-select-width: 30px !important; --ff-crdr-guide-action: calc(var(--ff-v26-sticky-select-width, 30px) + var(--ff-v26-sticky-action-width, 32px)) !important; --ff-crdr-guide-trans-id: calc(var(--ff-crdr-guide-action) + var(--ff-v26-sticky-key-width, 73px)) !important; --ff-crdr-guide-trans-date: calc(var(--ff-crdr-guide-trans-id) + var(--ff-v26-sticky-key2-width, 108px)) !important; --ff-crdr-guide-acc: calc(var(--ff-crdr-guide-trans-date) + 72px) !important; --ff-crdr-guide-client: calc(var(--ff-crdr-guide-acc) + 240px) !important; --ff-crdr-guide-inv: calc(var(--ff-crdr-guide-client) + 72px) !important; --ff-crdr-guide-excl-vat: calc(var(--ff-crdr-guide-inv) + 192px) !important; --ff-crdr-guide-vat: calc(var(--ff-crdr-guide-excl-vat) + 192px) !important; --ff-crdr-guide-incl-vat: calc(var(--ff-crdr-guide-vat) + 192px) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--ff-crdr-sticky-bg) !important; background-clip: border-box !important; border-bottom: 1px solid var(--ff-crdr-sticky-grid-line) !important; border-right: 1px solid var(--ff-crdr-sticky-grid-line) !important; box-shadow: inset -1px 0 0 var(--ff-crdr-sticky-grid-line), inset 0 -1px 0 var(--ff-crdr-sticky-grid-line) !important; opacity: 1 !important; overflow: hidden !important; position: sticky !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-crdr-select-col, .ff-v26-sticky-select-col, .dx-command-select) { left: var(--ff-v26-sticky-select-left, 0px) !important; max-width: var(--ff-v26-sticky-select-width, 30px) !important; min-width: var(--ff-v26-sticky-select-width, 30px) !important; width: var(--ff-v26-sticky-select-width, 30px) !important; z-index: 42 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-crdr-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { left: var(--ff-v26-sticky-action-left) !important; max-width: var(--ff-v26-sticky-action-width, 32px) !important; min-width: var(--ff-v26-sticky-action-width, 32px) !important; width: var(--ff-v26-sticky-action-width, 32px) !important; z-index: 41 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-crdr-trans-id-col, .ff-v26-sticky-key-col) { left: var(--ff-v26-sticky-key-left) !important; max-width: var(--ff-v26-sticky-key-width, 73px) !important; min-width: var(--ff-v26-sticky-key-width, 73px) !important; width: var(--ff-v26-sticky-key-width, 73px) !important; z-index: 40 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-crdr-trans-date-col, .ff-v26-sticky-key2-col) { left: var(--ff-v26-sticky-key2-left) !important; max-width: var(--ff-v26-sticky-key2-width, 108px) !important; min-width: var(--ff-v26-sticky-key2-width, 108px) !important; width: var(--ff-v26-sticky-key2-width, 108px) !important; z-index: 39 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-header-row :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--primary, #347cf5) !important; color: #fff !important; z-index: 52 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-headers .dx-filter-row :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--ff-crdr-sticky-bg) !important; color: inherit !important; z-index: 46 !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--ff-crdr-sticky-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--ff-crdr-sticky-selected-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-crdr-select-col, .ff-crdr-command-col, .ff-crdr-trans-id-col, .ff-crdr-trans-date-col, .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .dx-command-select, .dx-command-edit) { background: var(--ff-crdr-sticky-selected-alt-bg) !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr .dx-datagrid-total-footer .dx-datagrid-table > tbody > tr.dx-row > :is(td, th) { border-left: 0 !important; border-right: 0 !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-crdr-sparse-grid .dx-datagrid-rowsview .dx-scrollable-container { background-image: linear-gradient(to right, transparent calc(var(--ff-v26-sticky-select-width, 30px) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-v26-sticky-select-width, 30px) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-v26-sticky-select-width, 30px), transparent var(--ff-v26-sticky-select-width, 30px)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-action) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-action) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-action), transparent var(--ff-crdr-guide-action)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-trans-id) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-trans-id) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-trans-id), transparent var(--ff-crdr-guide-trans-id)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-trans-date) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-trans-date) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-trans-date), transparent var(--ff-crdr-guide-trans-date)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-acc) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-acc) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-acc), transparent var(--ff-crdr-guide-acc)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-client) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-client) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-client), transparent var(--ff-crdr-guide-client)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-inv) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-inv) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-inv), transparent var(--ff-crdr-guide-inv)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-excl-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-excl-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-excl-vat), transparent var(--ff-crdr-guide-excl-vat)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-vat), transparent var(--ff-crdr-guide-vat)), linear-gradient(to right, transparent calc(var(--ff-crdr-guide-incl-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) calc(var(--ff-crdr-guide-incl-vat) - 1px), var(--ff-crdr-sticky-grid-line, #d9dde5) var(--ff-crdr-guide-incl-vat), transparent var(--ff-crdr-guide-incl-vat)) !important; background-repeat: no-repeat !important; background-size: 100% 100% !important; overflow-y: hidden !important; scrollbar-gutter: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-crdr.ff-view-crdr.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--crdr.ff-crdr-sparse-grid .dx-datagrid-rowsview :is(.dx-scrollbar-vertical, .dx-scrollable-scrollbar-vertical) { display: none !important; opacity: 0 !important; visibility: hidden !important; width: 0 !important; } /* Absolute-final shared fixed/sticky grid border polish. Keep frozen cells on normal grid borders; only the outside frozen edge gets a subtle divider, avoiding the heavier double/inset borders seen on pages that still have page-local sticky column rules. */ html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is( .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .ff-v26-sticky-id-col, .dx-command-select, .dx-command-edit ), html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) > tbody > tr > :is(td, th) { border-bottom: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; border-left: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; border-right: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-v26-sticky-key2-col, .ff-v26-sticky-id-col), html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { box-shadow: 1px 0 0 var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-v26-sticky-key2-col, .ff-v26-sticky-id-col) { box-shadow: inset -1px 0 0 var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is( .ff-v26-sticky-select-col, .ff-v26-sticky-action-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .ff-v26-sticky-id-col, .dx-command-select, .dx-command-edit ), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) > tbody > tr > :is(td, th) { border-bottom: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; border-left: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; border-right: 1px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; box-shadow: none !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-v26-sticky-key2-col, .ff-v26-sticky-id-col) { box-shadow: inset -1px 0 0 var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; } html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #clientGridContainer#clientGridContainer, #waybillGridContainer#waybillGridContainer, #townMasterGrid#townMasterGrid, #hubMasterGrid#hubMasterGrid).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { box-shadow: 1px 0 0 var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; } /* Full Capture sender/receiver switch: float it over the shared card edge. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .padding-0:has(> .col-md-12 > .ff-sr-switch) { height: 0 !important; margin: 0 !important; overflow: visible !important; padding: 0 !important; pointer-events: none !important; position: relative !important; z-index: 8 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .padding-0:has(> .col-md-12 > .ff-sr-switch) > .col-md-12 { align-items: center !important; display: flex !important; height: 0 !important; justify-content: center !important; left: 50% !important; margin: 0 !important; max-width: none !important; padding: 0 !important; pointer-events: none !important; position: absolute !important; top: 8px !important; transform: translate(-50%, -50%) !important; width: auto !important; z-index: 9 !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .padding-0:has(> .col-md-12 > .ff-sr-switch) .ff-sr-switch { box-shadow: 0 1px 5px color-mix(in srgb, var(--shadow, #203040) 16%, transparent) !important; pointer-events: auto !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ff-sr-card > legend.ff-sr-legend { margin-left: 22px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-sr-card > legend.ff-sr-legend { margin-left: 18px !important; } /* Full Capture readability pilot. Do not set field heights here; existing layout/density rules own sizing. This block only tunes text, line-height, and value padding. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture { --ff-full-capture-readable-font-size: 24px; --ff-full-capture-readable-line-height: 24px; --ff-full-capture-readable-padding-x: 2px; --ff-full-capture-readable-padding-left: 4px; --ff-full-capture-readable-padding-right: 2px; --ff-full-capture-readable-padding-y: 3px; --ff-full-capture-readable-date-padding-left: 33px; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture { --ff-full-capture-readable-font-size: 24px; --ff-full-capture-readable-line-height: 24px; --ff-full-capture-readable-padding-x: 2px; --ff-full-capture-readable-padding-left: 4px; --ff-full-capture-readable-padding-right: 2px; --ff-full-capture-readable-padding-y: 3px; --ff-full-capture-readable-date-padding-left: 33px; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture input.form-control:not([type="checkbox"]):not([type="radio"]), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture select.form-control { box-sizing: border-box !important; font-size: var(--ff-full-capture-readable-font-size) !important; line-height: var(--ff-full-capture-readable-line-height) !important; padding: var(--ff-full-capture-readable-padding-y) var(--ff-full-capture-readable-padding-right) var(--ff-full-capture-readable-padding-y) var(--ff-full-capture-readable-padding-left) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture textarea.form-control { box-sizing: border-box !important; font-size: var(--ff-full-capture-readable-font-size) !important; line-height: var(--ff-full-capture-readable-line-height) !important; padding: var(--ff-full-capture-readable-padding-y) var(--ff-full-capture-readable-padding-right) var(--ff-full-capture-readable-padding-y) var(--ff-full-capture-readable-padding-left) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]) { padding-left: var(--ff-full-capture-readable-date-padding-left) !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture :is(ui-select.ff-control.ff-ui, .ui-select-container, .ui-select-bootstrap, .ui-select-bootstrap > .ui-select-match) { box-sizing: border-box !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search { box-sizing: border-box !important; font-size: var(--ff-full-capture-readable-font-size) !important; line-height: var(--ff-full-capture-readable-line-height) !important; padding-bottom: var(--ff-full-capture-readable-padding-y) !important; padding-top: var(--ff-full-capture-readable-padding-y) !important; text-align: left !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn { align-items: center !important; display: flex !important; justify-content: flex-start !important; padding-left: var(--ff-full-capture-readable-padding-left) !important; padding-right: calc(var(--ff-full-capture-readable-padding-right) + 14px) !important; text-align: left !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search { padding-left: var(--ff-full-capture-readable-padding-left) !important; padding-right: var(--ff-full-capture-readable-padding-right) !important; text-align: left !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture .ui-select-bootstrap :is(.ui-select-match-text, .ui-select-match-text span, .ui-select-placeholder) { align-items: center !important; display: flex !important; flex: 1 1 auto !important; font-size: inherit !important; justify-content: flex-start !important; line-height: var(--ff-full-capture-readable-line-height) !important; margin-left: 0 !important; margin-right: auto !important; min-height: 0 !important; min-width: 0 !important; text-align: left !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture :is(input.form-control, input.ff-input).ff-key-field-value { font-size: max(19px, var(--ff-full-capture-readable-font-size)) !important; line-height: var(--ff-full-capture-readable-line-height) !important; padding-bottom: var(--ff-full-capture-readable-padding-y) !important; padding-top: var(--ff-full-capture-readable-padding-y) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture :is(input.form-control, input.ff-input).ff-key-field-value, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact :is(input.form-control, input.ff-input).ff-key-field-value, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture :is(input.form-control, input.ff-input).ff-key-field-value { font-size: max(24px, var(--ff-full-capture-readable-font-size)) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control), html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control), html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control) { font-size: 24px !important; line-height: 24px !important; padding: 1.5px 2px 4.5px 4px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]), html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]), html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]) { padding-left: var(--ff-full-capture-readable-date-padding-left) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search { font-size: 24px !important; line-height: 24px !important; padding-bottom: 4.5px !important; padding-top: 1.5px !important; text-align: left !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ui-select-bootstrap > .ui-select-match > .btn { justify-content: flex-start !important; padding-left: 4px !important; padding-right: 16px !important; text-align: left !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app .ff-view-compact .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app[data-grid-font-size="small"] .ff-waybill.ff-full-capture .ui-select-bootstrap .ui-select-search { padding-left: 4px !important; padding-right: 2px !important; text-align: left !important; } /* Full Capture compact final corrections. Keep the larger normal-mode fields, but make compact mode use a smaller readable font and prevent account fields from crowding the paired lists. */ @media (min-width: 768px) { html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card > .row:first-of-type, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card > .row:first-of-type { column-gap: 12px !important; display: grid !important; grid-template-columns: minmax(88px, 132px) minmax(0, 1fr) !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card > .row:first-of-type > .col-md-3, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card > .row:first-of-type > .col-md-9, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card > .row:first-of-type > .col-md-3, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card > .row:first-of-type > .col-md-9 { float: none !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } } @media (min-width: 992px) { html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row { column-gap: 12px !important; display: flex !important; flex-wrap: nowrap !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-1, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row > .col-md-1 { flex: 0 0 120px !important; float: none !important; max-width: 120px !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: 120px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .col-md-3:not(.ff-full-waybill-no-field), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row > .col-md-3:not(.ff-full-waybill-no-field) { flex: 0 1 360px !important; float: none !important; max-width: 360px !important; min-width: 260px !important; padding-left: 0 !important; padding-right: 0 !important; width: 360px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-basic-details .ff-full-basic-row > .ff-full-basic-docs, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-basic-details .ff-full-basic-row > .ff-full-basic-docs { flex: 1 1 auto !important; float: none !important; max-width: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; width: auto !important; } } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact { --ff-full-capture-readable-font-size: 15.3px; --ff-full-capture-readable-line-height: 16.2px; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form :is(input.form-control:not([type="checkbox"]):not([type="radio"]), select.form-control, textarea.form-control) { font-size: 15.3px !important; line-height: 16.2px !important; padding: 2px 2px 5.7px 4px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form .input-icon > input.form-control:not([type="checkbox"]):not([type="radio"]) { padding-left: var(--ff-full-capture-readable-date-padding-left) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form .ui-select-bootstrap .ui-select-search.form-control, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form .ui-select-bootstrap .ui-select-search.form-control { font-size: 15.3px !important; line-height: 16.2px !important; padding-bottom: 5.7px !important; padding-top: 2px !important; text-align: left !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control :is(.ui-select-match-text, span), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control :is(.ui-select-match-text, span) { line-height: 16.2px !important; text-align: left !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control :is(.ui-select-match-text, .ui-select-match-text span, .ui-select-placeholder), html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact #form#form .ui-select-bootstrap > .ui-select-match > .btn.form-control :is(.ui-select-match-text, .ui-select-match-text span, .ui-select-placeholder) { flex: 1 1 auto !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: auto !important; min-width: 0 !important; text-align: left !important; } /* Full Capture charges: total amounts are table cells, so match them to the readable charge input text size without enlarging the captions. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr.ff-charge-total-row > td:last-child { font-size: var(--ff-full-capture-readable-font-size, 13px) !important; height: calc(var(--ff-full-capture-readable-line-height, 18px) + 2px) !important; line-height: var(--ff-full-capture-readable-line-height, 18px) !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card .ff-quick-town-label > .ff-quick-town-label-actions, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card .ff-quick-town-label > .ff-quick-town-label-actions { height: 16px !important; line-height: 16px !important; min-height: 16px !important; min-width: 16px !important; top: -3px !important; transform: none !important; width: auto !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card .ff-quick-town-label .ff-quick-town-lock, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card .ff-quick-town-label .ff-quick-town-lock { flex: 0 0 16px !important; height: 16px !important; line-height: 14px !important; max-height: 16px !important; max-width: 16px !important; min-height: 16px !important; min-width: 16px !important; width: 16px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"], [data-grid-font-size="small"]) .ff-waybill.ff-full-capture .ff-sr-card .ff-quick-town-label .ff-quick-town-lock i, html body.ff-app.ff-app.ff-app .ff-waybill.ff-full-capture.ff-view-compact .ff-sr-card .ff-quick-town-label .ff-quick-town-lock i { font-size: 9px !important; } /* External tracking/image public polish. Scoped to the external anonymous pages so internal tracking grids are not affected. */ html body.ff-app.ff-app.ff-app .ff-public-tracking { background: linear-gradient(180deg, #f7f9fc 0%, #eef3f8 100%) !important; color: var(--text, #252b33) !important; min-height: 100vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-tracking-container { background: transparent !important; max-width: 1200px !important; padding: 24px 24px 18px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-tracking-shell { margin: 0 auto !important; max-width: 1160px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-hero { background: #ffffff !important; border: 1px solid #dfe6ef !important; border-radius: 8px !important; box-shadow: 0 12px 30px rgba(38, 52, 72, .08) !important; margin-bottom: 16px !important; overflow: hidden !important; padding: 20px 22px 22px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-hero--compact { margin-bottom: 14px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-hero-top { align-items: center !important; display: flex !important; gap: 14px !important; justify-content: space-between !important; margin-bottom: 18px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand { align-items: center !important; color: #2e3744 !important; display: inline-flex !important; gap: 10px !important; min-width: 0 !important; text-decoration: none !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand:focus { color: #1f6fb2 !important; text-decoration: none !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand-mark { align-items: center !important; background: #1f6fb2 !important; border-radius: 8px !important; color: #ffffff !important; display: inline-flex !important; flex: 0 0 34px !important; font-size: 13px !important; font-weight: 800 !important; height: 34px !important; justify-content: center !important; letter-spacing: 0 !important; line-height: 1 !important; width: 34px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand-copy { display: flex !important; flex-direction: column !important; gap: 1px !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand-name { color: #202833 !important; font-size: 14px !important; font-weight: 700 !important; line-height: 1.15 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-brand-link { color: #7a8697 !important; font-size: 11px !important; font-weight: 500 !important; line-height: 1.2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-login { align-items: center !important; background: #ffffff !important; border: 1px solid #cfd8e4 !important; border-radius: 6px !important; box-shadow: none !important; color: #324055 !important; display: inline-flex !important; font-weight: 700 !important; height: 34px !important; justify-content: center !important; min-width: 76px !important; padding: 0 14px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-login:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-login:focus { background: #f5f8fb !important; border-color: #b9c6d6 !important; color: #1f6fb2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-title-block { max-width: 780px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-eyebrow { color: #408060 !important; display: block !important; font-size: 11px !important; font-weight: 800 !important; letter-spacing: .08em !important; line-height: 1.2 !important; margin-bottom: 7px !important; text-transform: uppercase !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-title { color: #202833 !important; font-size: 30px !important; font-weight: 800 !important; letter-spacing: 0 !important; line-height: 1.12 !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-title-number { color: #5d6878 !important; display: inline-block !important; font-weight: 700 !important; margin-left: 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-subtitle { color: #667386 !important; font-size: 14px !important; line-height: 1.55 !important; margin: 10px 0 0 !important; max-width: 650px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card.panel { border-color: #dfe6ef !important; border-radius: 8px !important; box-shadow: 0 8px 22px rgba(38, 52, 72, .06) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-shell.ff-card.panel { border-color: #d8e2ed !important; box-shadow: 0 10px 26px rgba(38, 52, 72, .07) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-shell .ff-card-body { padding: 18px 18px 14px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-row label { color: #39465a !important; font-size: 12px !important; font-weight: 800 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking :is(.ff-input, input.form-control, select.form-control, textarea.form-control) { background: #ffffff !important; border-color: #cfd8e4 !important; border-radius: 6px !important; box-shadow: none !important; color: #202833 !important; min-height: 38px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking :is(.ff-input, input.form-control, select.form-control, textarea.form-control):focus { border-color: #1f6fb2 !important; box-shadow: 0 0 0 3px rgba(31, 111, 178, .14) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-submit { align-items: center !important; background: #1f6fb2 !important; border-color: #1f6fb2 !important; border-radius: 6px !important; display: inline-flex !important; gap: 8px !important; justify-content: center !important; min-height: 38px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip { border-top-color: #e5ebf2 !important; gap: 8px !important; margin-top: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip-item { background: #f8fafc !important; border-color: #dfe6ef !important; border-radius: 7px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip-item--latest { background: #eef7f3 !important; border-color: #c9e3d6 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs { background: #eef3f8 !important; border: 1px solid #dbe4ee !important; border-radius: 8px !important; display: flex !important; gap: 4px !important; margin-bottom: 14px !important; padding: 4px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs::-webkit-scrollbar { height: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs::-webkit-scrollbar-track { background: transparent !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs::-webkit-scrollbar-thumb { background: #c6d2e1 !important; border-radius: 999px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs.nav-justified > li, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li { display: block !important; flex: 1 1 0 !important; float: none !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs.nav-justified > li > a { background: transparent !important; border: 0 !important; border-radius: 6px !important; color: #6f7c90 !important; font-size: 12px !important; font-weight: 800 !important; letter-spacing: .03em !important; margin: 0 !important; padding: 10px 12px !important; text-align: center !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a:focus { background: rgba(255,255,255,.58) !important; color: #324055 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a:focus { background: #ffffff !important; box-shadow: 0 2px 8px rgba(38, 52, 72, .08) !important; color: #1f6fb2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header { background: #fbfcfe !important; border-bottom-color: #e5ebf2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-title { color: #202833 !important; font-size: 17px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--inline { align-items: baseline !important; display: flex !important; flex-wrap: wrap !important; gap: 6px 12px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--inline .ff-card-title, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--inline .ff-card-meta { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--spread { align-items: baseline !important; display: flex !important; gap: 12px !important; justify-content: space-between !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--spread .ff-card-title, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--spread .ff-card-meta { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main--spread .ff-card-meta { margin-left: auto !important; text-align: right !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-meta { color: #748196 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-latest-event-banner { background: #eef7f3 !important; border-color: #c9e3d6 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-latest-event-badge { background: #408060 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-head { border-bottom-color: #e5ebf2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .timeline-xs .timeline-item { border-left-color: #82ad98 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-row { border-bottom-color: #e7edf4 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-row--highlight { background: #f0f7ff !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-grid { gap: 16px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-group { background: #fbfcfe !important; border: 1px solid #e1e8f1 !important; border-radius: 8px !important; padding: 14px 14px 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-item { border-bottom-color: #e8edf4 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane { background: #f7f9fc !important; border-radius: 0 0 8px 8px !important; min-height: 62vh !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-frame { background: #ffffff !important; min-height: 62vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-list { background: #f7f9fc !important; gap: 14px !important; min-height: 62vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-list .ff-images-frame { border-color: #d7e0eb !important; border-radius: 6px !important; max-height: 70vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-list iframe.ff-images-frame { height: 70vh !important; min-height: 62vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-error, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-document-empty { background: #f7f9fc !important; min-height: 62vh !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-empty-state { color: #667386 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-empty-state-icon { background: #eef3f8 !important; color: #1f6fb2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-empty-state-title { color: #202833 !important; } html body.ff-app.ff-app.ff-app .ff-public-grid-state { align-items: center !important; background: #f7f9fc !important; border: 1px dashed #cfd8e4 !important; border-radius: 8px !important; color: #667386 !important; display: flex !important; gap: 10px !important; justify-content: center !important; min-height: 180px !important; padding: 24px !important; text-align: center !important; } html body.ff-app.ff-app.ff-app .ff-public-grid-state > .fa { color: #1f6fb2 !important; font-size: 18px !important; } html body.ff-app.ff-app.ff-app .ff-public-footer { align-items: center !important; color: #7d8898 !important; display: flex !important; font-size: 12px !important; gap: 8px !important; justify-content: center !important; padding: 6px 0 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-footer a { color: #536174 !important; font-weight: 700 !important; text-decoration: none !important; } html body.ff-app.ff-app.ff-app .ff-public-footer a:hover, html body.ff-app.ff-app.ff-app .ff-public-footer a:focus { color: #1f6fb2 !important; text-decoration: underline !important; } /* External tracking/image compact public layout. Keeps the anonymous page closer to capture-page density. */ html body.ff-app.ff-app.ff-app:has(.ff-public-tracking) #app { overflow: visible !important; overflow-y: visible !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking { background: #f3f6fa !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-tracking-container { padding: 0 10px 10px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-tracking-shell { margin-top: 0 !important; max-width: 1220px !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-pagebar { align-items: center !important; display: flex !important; gap: 12px !important; justify-content: space-between !important; margin: 0 0 6px !important; min-height: 36px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-page-title { align-items: baseline !important; color: #202833 !important; display: flex !important; flex: 1 1 auto !important; flex-wrap: wrap !important; font-size: 22px !important; font-weight: 500 !important; gap: 6px !important; letter-spacing: 0 !important; line-height: 1.16 !important; margin: 0 !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-page-title strong { color: #202833 !important; font-size: inherit !important; font-weight: 800 !important; font-variant-numeric: lining-nums !important; font-feature-settings: "lnum" 1 !important; line-height: inherit !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-login { flex: 0 0 auto !important; height: 30px !important; min-width: 68px !important; padding: 0 12px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card.panel { border-color: #dce4ef !important; border-radius: 6px !important; box-shadow: 0 2px 8px rgba(38, 52, 72, .05) !important; margin-bottom: 6px !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-shell.ff-card.panel { box-shadow: 0 2px 8px rgba(38, 52, 72, .05) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-shell .ff-card-body { padding: 10px 12px 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-row .form-group { margin-bottom: 4px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-row label { margin-bottom: 3px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking :is(.ff-input, input.form-control, select.form-control, textarea.form-control) { min-height: 34px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-search-submit { min-height: 34px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip { margin-top: 5px !important; padding-top: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip-item { padding: 6px 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tracking-tabs { background: transparent !important; margin-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs { background: transparent !important; border: 0 !important; border-bottom: 0 !important; border-radius: 0 !important; display: flex !important; gap: 6px !important; margin-bottom: 4px !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs.nav-justified > li { background: transparent !important; border: 0 !important; display: block !important; flex: 1 1 0 !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs.nav-justified > li > a { background: #ffffff !important; border: 1px solid #d7e0ec !important; border-bottom: 2px solid transparent !important; border-radius: 8px 8px 0 0 !important; color: #657386 !important; display: block !important; font-size: 12px !important; font-weight: 700 !important; letter-spacing: 0 !important; margin: 0 !important; overflow: hidden !important; padding: 8px 10px 7px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a:focus { background: #ffffff !important; color: #253244 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li.active > a:focus { background: #ffffff !important; border-color: #cbd7e6 !important; border-bottom-color: #1f6fb2 !important; box-shadow: none !important; color: #1f6fb2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tab-pane-wrap { padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header { padding: 8px 12px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-body { padding: 10px 12px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-title { font-size: 15px !important; line-height: 1.2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-meta { font-size: 12px !important; line-height: 1.25 !important; margin-top: 2px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane { min-height: calc(100vh - 150px) !important; overflow: visible !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-pane { min-height: calc(100vh - 210px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-frame { border: 0 !important; min-height: calc(100vh - 150px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-frame { min-height: calc(100vh - 210px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-list { gap: 8px !important; min-height: calc(100vh - 150px) !important; padding: 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-list { min-height: calc(100vh - 210px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-preview { position: relative !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-chip { background: rgba(32, 40, 51, .72) !important; border-radius: 999px !important; color: #ffffff !important; font-size: 11px !important; font-weight: 700 !important; left: 44px !important; line-height: 1 !important; padding: 5px 8px !important; position: absolute !important; top: 10px !important; z-index: 2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions { align-items: center !important; background: #ffffff !important; border-bottom: 1px solid #d7e0ec !important; box-shadow: 0 3px 10px rgba(31, 45, 64, .08) !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; justify-content: space-between !important; padding: 7px 10px !important; position: sticky !important; top: 0 !important; z-index: 8 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-selects, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-buttons { align-items: center !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-select { border-color: #c9d5e3 !important; color: #2d3746 !important; font-size: 12px !important; height: 30px !important; line-height: 1.2 !important; min-height: 30px !important; min-width: 118px !important; padding: 4px 26px 4px 8px !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-select-toggle { align-items: center !important; background: #ffffff !important; border-color: #c9d5e3 !important; border-radius: 6px !important; color: #2d3746 !important; display: inline-flex !important; font-size: 12px !important; font-weight: 700 !important; gap: 6px !important; height: 30px !important; line-height: 1 !important; min-height: 30px !important; padding: 0 10px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-select-toggle .fa { color: #2f74ff !important; font-size: 14px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-selected-count { align-items: center !important; background: #eef5ff !important; border: 1px solid #c7daf6 !important; border-radius: 999px !important; color: #245587 !important; display: inline-flex !important; font-size: 12px !important; font-weight: 700 !important; height: 30px !important; line-height: 1 !important; padding: 0 10px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-format-select { min-width: 92px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select { align-items: center !important; background: rgba(255, 255, 255, .94) !important; border: 1px solid #c9d5e3 !important; border-radius: 6px !important; box-shadow: 0 3px 10px rgba(31, 45, 64, .14) !important; cursor: pointer !important; display: inline-flex !important; height: 26px !important; justify-content: center !important; left: 10px !important; margin: 0 !important; padding: 0 !important; position: absolute !important; top: 10px !important; width: 26px !important; z-index: 4 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select--single { top: 58px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select input[type="checkbox"] { height: 1px !important; opacity: 0 !important; pointer-events: none !important; position: absolute !important; width: 1px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select-mark { align-items: center !important; background: #ffffff !important; border: 2px solid #2f74ff !important; border-radius: 4px !important; color: #ffffff !important; display: inline-flex !important; height: 18px !important; justify-content: center !important; width: 18px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select-mark::after { color: #ffffff !important; content: "\f00c" !important; font-family: FontAwesome !important; font-size: 12px !important; line-height: 1 !important; opacity: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select input[type="checkbox"]:checked + .ff-document-page-select-mark { background: #2f74ff !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-document-page-select input[type="checkbox"]:checked + .ff-document-page-select-mark::after { opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-btn { align-items: center !important; border-radius: 6px !important; display: inline-flex !important; font-size: 13px !important; font-weight: 600 !important; gap: 7px !important; height: 30px !important; justify-content: center !important; line-height: 1 !important; min-width: 86px !important; padding: 0 11px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-btn .fa { font-size: 14px !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions ~ .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions ~ .ff-images-list { min-height: calc(100vh - 190px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-preview-fallback { background: color-mix(in srgb, var(--surface, #ffffff) 92%, transparent) !important; border: 1px solid var(--border, #d7e0ec) !important; border-radius: 6px !important; bottom: 10px !important; box-shadow: 0 4px 12px rgba(35, 48, 68, .12) !important; font-size: 12px !important; line-height: 1.2 !important; padding: 6px 9px !important; position: absolute !important; right: 10px !important; z-index: 3 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-preview-fallback a { color: var(--primary, #1f6fb2) !important; font-weight: 700 !important; text-decoration: none !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-preview-fallback a:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-preview-fallback a:focus { color: var(--primary-strong, #17558b) !important; text-decoration: underline !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-public-document-actions ~ .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-public-document-actions ~ .ff-images-list { min-height: calc(100vh - 250px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-error, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-document-empty { min-height: calc(100vh - 150px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-image-error, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-document-empty { min-height: calc(100vh - 210px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-empty-state-card .ff-card-body { min-height: 220px !important; } html body.ff-app.ff-app.ff-app .ff-public-footer { padding: 2px 0 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header { align-items: center !important; display: flex !important; gap: 10px !important; justify-content: space-between !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-main { min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-card-header-actions { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; gap: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-icon-btn { align-items: center !important; border-color: #cfd8e4 !important; border-radius: 5px !important; color: #253244 !important; display: inline-flex !important; gap: 6px !important; justify-content: center !important; min-height: 26px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-icon-btn:hover, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-icon-btn:focus { background: #eef4fb !important; border-color: #9fb5cf !important; color: #1f6fb2 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-icon-btn[disabled] { color: #9aa6b5 !important; cursor: not-allowed !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-time-col .ff-text { white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-status-col .ff-text, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-timeline-status-col .ff-action-link { max-width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-group-title-row { align-items: center !important; display: flex !important; gap: 8px !important; justify-content: space-between !important; margin-bottom: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-group-title-row .ff-detail-group-title { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-value-actions { align-items: center !important; display: flex !important; gap: 8px !important; justify-content: space-between !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-value-actions > span:first-child { min-width: 0 !important; overflow-wrap: anywhere !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-detail-action-buttons { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; gap: 4px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-modal { align-items: center !important; background: rgba(20, 30, 44, .38) !important; bottom: 0 !important; display: flex !important; justify-content: center !important; left: 0 !important; padding: 20px !important; position: fixed !important; right: 0 !important; top: 0 !important; z-index: 1050 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-dialog { background: #ffffff !important; border: 1px solid #d7e0ec !important; border-radius: 8px !important; box-shadow: 0 16px 42px rgba(20, 30, 44, .22) !important; max-height: 82vh !important; max-width: 860px !important; overflow: auto !important; padding: 12px !important; width: min(860px, 96vw) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-header { align-items: flex-start !important; border-bottom: 1px solid #e5ebf2 !important; display: flex !important; gap: 12px !important; justify-content: space-between !important; margin-bottom: 10px !important; padding-bottom: 8px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-actions { align-items: center !important; display: inline-flex !important; flex: 0 0 auto !important; gap: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-table { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-table > thead > tr > th { background: #f3f6fa !important; color: #253244 !important; font-size: 12px !important; font-weight: 700 !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-parcel-table > tbody > tr > td { color: #334155 !important; font-size: 12px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane--has-list, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane--has-list .ff-images-list { min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane.ff-images-pane--has-preview .ff-external-image-loading { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions ~ .ff-external-image-loading { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; overflow: hidden !important; padding: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane.ff-images-pane--has-list, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane.ff-images-pane--has-list .ff-public-document-actions ~ .ff-images-list, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-pane.ff-images-pane--has-list, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-pane.ff-images-pane--has-list .ff-public-document-actions ~ .ff-images-list { min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane--has-list .ff-images-list { padding-bottom: 2px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane--has-list .ff-images-preview:last-child { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-card { margin-bottom: 0 !important; } @media (max-width: 767px) { html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-tracking-container { padding: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-pagebar { gap: 8px !important; min-height: 32px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-page-title { font-size: 18px !important; word-break: break-word !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-login { height: 28px !important; min-width: 62px !important; padding: 0 10px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs { overflow-x: auto !important; scrollbar-width: thin !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs.nav-justified > li, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li { flex: 0 0 auto !important; min-width: 104px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-tabs-clean > .nav-tabs > li > a { padding-left: 10px !important; padding-right: 10px !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-summary-strip-item { flex: 1 1 100% !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-pane, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-image-error, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-external-document-empty { min-height: calc(100vh - 118px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions { align-items: stretch !important; padding: 6px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-selects, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-buttons { flex: 1 1 100% !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-select { flex: 1 1 120px !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-action-btn { flex: 1 1 94px !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions ~ .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-document-actions ~ .ff-images-list { min-height: calc(100vh - 158px) !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-pane, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-image-loading, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-image-error, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-external-document-empty { min-height: 280px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-public-document-actions ~ .ff-images-frame, html body.ff-app.ff-app.ff-app .ff-public-tracking:not(.ff-external-image-preview) .ff-public-document-actions ~ .ff-images-list { min-height: 240px !important; } html body.ff-app.ff-app.ff-app .ff-public-tracking .ff-public-footer { flex-wrap: wrap !important; } } /* Compact capture lock buttons: keep client/town/service locks on the label line so they do not overlap the ui-select fields below. */ html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill:is(.ff-full-capture, .ff-quick-capture) :is(.ff-client-lock-label, .ff-quick-town-label, .ff-full-service-lock-label, .ff-quick-party-lock-label), html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill .ff-stages-capture :is(.ff-client-lock-label, .ff-quick-town-label, .ff-full-service-lock-label, .ff-quick-party-lock-label) { line-height: var(--ff-ui-density-label-line-height, 15px) !important; margin-bottom: 1px !important; min-height: var(--ff-ui-density-label-line-height, 15px) !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill:is(.ff-full-capture, .ff-quick-capture) .ff-quick-town-label-actions, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill .ff-stages-capture .ff-quick-town-label-actions { align-self: flex-start !important; line-height: 18px !important; min-height: 18px !important; transform: translateY(-7px) !important; z-index: 6 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill:is(.ff-full-capture, .ff-quick-capture) :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill .ff-stages-capture :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon { border-radius: 4px !important; flex: 0 0 18px !important; height: 18px !important; line-height: 16px !important; max-height: 18px !important; max-width: 18px !important; min-height: 18px !important; min-width: 18px !important; padding: 0 !important; width: 18px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill:is(.ff-full-capture, .ff-quick-capture) :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon i, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill .ff-stages-capture :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon i { font-size: 10px !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-quick-town-label-actions { top: -2px !important; transform: none !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill.ff-full-capture .ff-full-service-lock-label .ff-quick-town-label-actions { top: -3px !important; } /* Waybill Stages list fields: keep lock buttons from increasing the label row height so list controls align with plain text/date fields in the same row. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture :is(.ff-client-lock-label, .ff-quick-town-label, .ff-full-service-lock-label) { align-items: flex-start !important; display: block !important; height: 14px !important; line-height: 14px !important; margin-bottom: 1px !important; min-height: 14px !important; overflow: visible !important; padding-right: 30px !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture :is(.ff-client-lock-label, .ff-quick-town-label, .ff-full-service-lock-label) > span:first-child { display: inline-block !important; line-height: 14px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture :is(.ff-client-lock-label, .ff-quick-town-label, .ff-full-service-lock-label) .ff-quick-town-label-actions { align-items: center !important; display: inline-flex !important; height: 22px !important; justify-content: flex-end !important; line-height: 22px !important; min-height: 0 !important; min-width: 0 !important; position: absolute !important; right: 0 !important; top: -5px !important; transform: none !important; z-index: 6 !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon { border-radius: 4px !important; flex: 0 0 22px !important; height: 22px !important; line-height: 20px !important; max-height: 22px !important; max-width: 22px !important; min-height: 22px !important; min-width: 22px !important; padding: 0 !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture :is(.ff-quick-party-lock, .ff-quick-client-lock, .ff-quick-town-lock, .ff-quick-service-lock).ff-action.ff-action--icon i { font-size: 12px !important; line-height: 1 !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="client"].ff-control.ff-ui, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="origin"].ff-control.ff-ui, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="dest"].ff-control.ff-ui, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="service"].ff-control.ff-ui { margin-top: -7px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="client"].ff-control.ff-ui + .error, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="origin"].ff-control.ff-ui + .error, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="dest"].ff-control.ff-ui + .error, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture ui-select[name="service"].ff-control.ff-ui + .error { margin-top: -6px !important; } /* Waybill Stages CourierWB action: keep the linked options button aligned with the CourierWB field and shrink it with compact capture density. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action { --ff-stages-courier-action-h: var(--ff-control-h, 34px); align-self: flex-start !important; box-sizing: border-box !important; flex: 0 0 var(--ff-stages-courier-action-h) !important; margin-left: -12px !important; max-width: var(--ff-stages-courier-action-h) !important; min-width: var(--ff-stages-courier-action-h) !important; padding: 0 !important; transform: translateY(-1px) !important; width: var(--ff-stages-courier-action-h) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action :is(.btn-group, .dropdown-toggle) { box-sizing: border-box !important; height: var(--ff-stages-courier-action-h) !important; line-height: var(--ff-stages-courier-action-h) !important; margin: 0 !important; max-height: var(--ff-stages-courier-action-h) !important; max-width: var(--ff-stages-courier-action-h) !important; min-height: var(--ff-stages-courier-action-h) !important; min-width: var(--ff-stages-courier-action-h) !important; padding: 0 !important; width: var(--ff-stages-courier-action-h) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action .dropdown-toggle { align-items: center !important; display: inline-flex !important; justify-content: center !important; vertical-align: top !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action { --ff-stages-courier-action-h: var(--ff-ui-density-control-h, 26px); padding-top: 0 !important; transform: translateY(-1px) !important; } /* Absolute-final Waybill Stages rate-table header readability. This wins over legacy table header colour/fill rules in light and dark mode. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > :is(th, td), html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > :is(th, td) * { background-color: var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) !important; border-color: color-mix(in srgb, var(--ff-portal-theme-grid-head-bg, var(--primary-seed, #1677ff)) 72%, #000) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; font-weight: 700 !important; opacity: 1 !important; text-align: center !important; text-shadow: none !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-waybill #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > :is(th, td), html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-waybill #wizard.ff-stages-capture table.tableheadernowrap2 > thead > tr > :is(th, td) * { background-color: #242b37 !important; border-color: #647083 !important; color: #f8fafc !important; -webkit-text-fill-color: #f8fafc !important; opacity: 1 !important; text-shadow: none !important; visibility: visible !important; } /* Absolute-final Waybill Stages bubbles: keep completed numbers visible and make the current-stage halo a true circle, including the last step. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard .stepNumber { aspect-ratio: 1 / 1 !important; border-radius: 50% !important; box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; flex: 0 0 36px !important; height: 36px !important; max-height: 36px !important; max-width: 36px !important; min-height: 36px !important; min-width: 36px !important; text-indent: 0 !important; width: 36px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard.swMain > ul > li > a.selected:not(.done) .stepNumber::before { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard.swMain > ul > li > a.selected:not(.done) .stepNumber { box-shadow: 0 0 0 7px var(--nav-active-bg, rgba(22, 119, 255, .14)), 0 0 0 8px var(--nav-active-border, rgba(22, 119, 255, .35)), var(--shadow-1, 0 6px 16px rgba(15, 23, 42, .12)) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard.swMain > ul > li > a.done .stepNumber { color: var(--on-primary, #fff) !important; -webkit-text-fill-color: var(--on-primary, #fff) !important; font-size: 13px !important; font-weight: 700 !important; line-height: 1 !important; text-indent: 0 !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard.swMain > ul > li > a.done .stepNumber::before { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture.ff-wizard.swMain > ul > li > a.done .stepNumber::after { content: none !important; display: none !important; } /* Absolute-final Waybill Stages post-BASIC navigation. Keep RATE and later tabs on the same simple button system as the BASIC tab Next button, without the older forced footer button layer. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav { --ff-stages-rate-btn-width: 136px; --ff-service-rate-action-accent: var(--ff-portal-theme-grid-head-bg, var(--primary, var(--primary-seed, #1677ff))); --ff-service-rate-action-bg: color-mix(in srgb, var(--ff-service-rate-action-accent) 10%, var(--surface, #fff)); --ff-service-rate-action-bg-hover: color-mix(in srgb, var(--ff-service-rate-action-accent) 16%, var(--surface, #fff)); --ff-service-rate-action-bg-active: color-mix(in srgb, var(--ff-service-rate-action-accent) 22%, var(--surface, #fff)); --ff-service-rate-action-border: color-mix(in srgb, var(--ff-service-rate-action-accent) 66%, var(--surface, #fff)); --ff-service-rate-action-fg: color-mix(in srgb, var(--ff-service-rate-action-accent) 86%, var(--text, #1f1f1f)); align-items: center !important; display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; gap: 8px !important; justify-content: flex-end !important; margin: 8px 15px 4px !important; width: calc(100% - 30px) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav, html body.ff-app.ff-app.ff-app[data-theme="dark"] #wizard.ff-stages-capture .ff-stages-standard-nav { --ff-service-rate-action-bg: color-mix(in srgb, var(--ff-service-rate-action-accent) 24%, var(--surface, #111827)); --ff-service-rate-action-bg-hover: color-mix(in srgb, var(--ff-service-rate-action-accent) 31%, var(--surface, #111827)); --ff-service-rate-action-bg-active: color-mix(in srgb, var(--ff-service-rate-action-accent) 38%, var(--surface, #111827)); --ff-service-rate-action-border: color-mix(in srgb, var(--ff-service-rate-action-accent) 62%, var(--border, #647083)); --ff-service-rate-action-fg: color-mix(in srgb, var(--ff-service-rate-action-accent) 35%, #f8fafc); } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav::before, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav::after, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav::before, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button { align-items: center !important; background: var(--ff-service-rate-action-bg) !important; background-color: var(--ff-service-rate-action-bg) !important; border: 1px solid var(--ff-service-rate-action-border) !important; border-radius: 7px !important; box-shadow: none !important; box-sizing: border-box !important; color: var(--ff-service-rate-action-fg) !important; display: inline-flex !important; flex: 0 0 var(--ff-stages-rate-btn-width) !important; float: none !important; font-weight: 700 !important; height: 38px !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: 38px !important; max-width: var(--ff-stages-rate-btn-width) !important; min-height: 38px !important; min-width: var(--ff-stages-rate-btn-width) !important; padding: 0 12px !important; text-align: center !important; width: var(--ff-stages-rate-btn-width) !important; -webkit-text-fill-color: var(--ff-service-rate-action-fg) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:hover, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:focus, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:hover, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:focus { background: var(--ff-service-rate-action-bg-hover) !important; background-color: var(--ff-service-rate-action-bg-hover) !important; border-color: var(--ff-service-rate-action-accent) !important; color: var(--ff-service-rate-action-fg) !important; -webkit-text-fill-color: var(--ff-service-rate-action-fg) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:active, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button:active { background: var(--ff-service-rate-action-bg-active) !important; background-color: var(--ff-service-rate-action-bg-active) !important; border-color: var(--ff-service-rate-action-accent) !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button[disabled], html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button[disabled] { opacity: .55 !important; pointer-events: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .back-step, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .back-step { margin-right: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button .fa, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-standard-nav > .ff-stages-standard-nav__button .fa { color: inherit !important; line-height: 1 !important; margin-left: 3px !important; -webkit-text-fill-color: inherit !important; } /* Waybill Stages direct RATE tab: reduce the two compact read-only panels by 30% from the previous hard sizes. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section { flex: 0 1 273px !important; max-width: 364px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section { flex: 0 0 118px !important; max-width: 118px !important; min-width: 118px !important; width: 118px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section .ff-rating-actions { align-items: center !important; display: flex !important; justify-content: center !important; margin-top: 6px !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section .ff-rating-actions > .btn { box-sizing: border-box !important; margin-left: auto !important; margin-right: auto !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } /* Capture rating charges: keep labels/amounts right-aligned, but shrink the visible Charges frame so its left border sits just before the total divider. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-charges-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-charges-section { box-sizing: border-box !important; flex: 0 0 206px !important; max-width: 206px !important; min-width: 206px !important; padding-left: 0 !important; padding-right: 0 !important; width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section > fieldset, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-charges-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-charges-section > fieldset { box-sizing: border-box !important; margin-left: auto !important; margin-right: 0 !important; max-width: 206px !important; min-width: 206px !important; padding-left: 10px !important; padding-right: 10px !important; width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { margin-left: auto !important; margin-right: 0 !important; table-layout: fixed !important; width: 184px !important; } /* Waybill Stages RATE tab: keep the rating panels compact. Reducing Charges must not let Rating Variables, Freight Calculation, or Mass grow into the freed page width. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset { box-sizing: border-box !important; display: inline-block !important; max-width: 100% !important; overflow-x: auto !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset > .ff-rating-compact-row, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset > .ff-rating-compact-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; width: max-content !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-charges-col, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-charges-col { box-sizing: border-box !important; flex: 0 0 454px !important; max-width: 454px !important; min-width: 454px !important; width: 454px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row { flex-wrap: nowrap !important; width: 454px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-vars-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-vars-section { box-sizing: border-box !important; flex: 0 0 242px !important; max-width: 242px !important; min-width: 242px !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-fcalc-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-fcalc-section { box-sizing: border-box !important; flex: 0 0 364px !important; max-width: 364px !important; min-width: 273px !important; width: 364px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-mass-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-mass-section { box-sizing: border-box !important; flex: 0 0 112px !important; max-width: 112px !important; min-width: 112px !important; width: 112px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-mass-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-rating-fieldset .ff-rating-mass-section > fieldset { padding-left: 8px !important; padding-right: 8px !important; } /* Waybill Stages CourierWB: top-align the split/dropdown action with the CourierWB input rather than letting the button sit lower than the field. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action { padding-top: 8px !important; transform: none !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-courier-action { padding-top: 5px !important; } /* Waybill Stages Client: align the list control with the text/date inputs on the same row. The lock button lives in the label, so move only the select. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-client-name ui-select[name="client"].ff-control.ff-ui, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-client-name ui-select[name="client"].ff-control.ff-ui { display: block !important; margin-top: -10px !important; } html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-ui-density="compact"], [data-grid-density="compact"]) .ff-waybill #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-client-name ui-select[name="client"].ff-control.ff-ui, html body.ff-app.ff-app.ff-app:is(.ff-ui-density-compact, .ff-grid-density-compact, [data-grid-density="compact"], [data-ui-density="compact"]) #wizard.ff-stages-capture .ff-stages-client-row > .ff-stages-client-name ui-select[name="client"].ff-control.ff-ui { margin-top: -6px !important; } /* Waybill Stages RATE final layout: target the existing direct include wrapper so the compact panel widths apply even if the rating partial is browser-cached. */ html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main { box-sizing: border-box !important; display: inline-block !important; max-width: 100% !important; overflow-x: auto !important; width: auto !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; gap: 0 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: max-content !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row::before, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row::after, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row::before, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main > .ff-rating-compact-row::after, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-split-row::before, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-split-row::after, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-split-row::before, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-split-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-settings-col, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-settings-col { box-sizing: border-box !important; flex: 0 0 222px !important; float: none !important; max-width: 222px !important; min-width: 222px !important; padding-left: 0 !important; padding-right: 0 !important; width: 222px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col { box-sizing: border-box !important; flex: 0 0 456px !important; float: none !important; max-width: 456px !important; min-width: 456px !important; padding-left: 0 !important; padding-right: 0 !important; width: 456px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; gap: 0 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 456px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section { box-sizing: border-box !important; flex: 0 0 206px !important; float: none !important; max-width: 206px !important; min-width: 206px !important; padding-left: 0 !important; padding-right: 0 !important; width: 206px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section { box-sizing: border-box !important; flex: 0 0 242px !important; float: none !important; max-width: 242px !important; min-width: 242px !important; padding-left: 0 !important; padding-right: 0 !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section > fieldset { box-sizing: border-box !important; max-width: 242px !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section { box-sizing: border-box !important; flex: 0 0 364px !important; float: none !important; max-width: 364px !important; min-width: 364px !important; padding-left: 0 !important; padding-right: 0 !important; width: 364px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-fcalc-section > fieldset { box-sizing: border-box !important; max-width: 364px !important; width: 364px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section { box-sizing: border-box !important; flex: 0 0 118px !important; float: none !important; max-width: 118px !important; min-width: 118px !important; padding-left: 0 !important; padding-right: 0 !important; width: 118px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section > fieldset { box-sizing: border-box !important; max-width: 118px !important; padding-left: 8px !important; padding-right: 8px !important; width: 118px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed { table-layout: fixed !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed > tbody > tr > td:first-child { padding-left: 0 !important; padding-right: 2px !important; white-space: nowrap !important; width: 66px !important; } html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-mass-section table.table-condensed > tbody > tr > td:last-child { padding-left: 2px !important; padding-right: 0 !important; white-space: nowrap !important; width: 34px !important; } /* Capture rating final balance: Quick, Full, and Stages use the same compact rating partial. Give Charges enough room for readable amounts while keeping Rating Variables clamped instead of letting Bootstrap make it half-page wide. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col { box-sizing: border-box !important; flex: 0 0 559px !important; float: none !important; max-width: 559px !important; min-width: 559px !important; padding-left: 0 !important; padding-right: 0 !important; width: 559px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; gap: 0 8px !important; margin-left: 0 !important; margin-right: 0 !important; width: 559px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row::before, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row::after, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row::before, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row::after, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row::before, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-col > .ff-rating-split-row::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section { box-sizing: border-box !important; flex: 0 0 309px !important; float: none !important; max-width: 309px !important; min-width: 309px !important; padding-left: 0 !important; padding-right: 0 !important; width: 309px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section > fieldset, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-charges-section > fieldset { box-sizing: border-box !important; margin-left: auto !important; margin-right: 0 !important; max-width: 309px !important; min-width: 309px !important; padding-left: 10px !important; padding-right: 10px !important; width: 309px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-vars-section, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section { box-sizing: border-box !important; flex: 0 0 242px !important; float: none !important; max-width: 242px !important; min-width: 242px !important; padding-left: 0 !important; padding-right: 0 !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-vars-section > fieldset, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section > fieldset, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct .ff-rating-vars-section > fieldset { box-sizing: border-box !important; max-width: 242px !important; width: 242px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { margin-left: auto !important; margin-right: 0 !important; table-layout: fixed !important; width: 286px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child { box-sizing: border-box !important; min-width: 116px !important; padding-left: 2px !important; padding-right: 4px !important; width: 116px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child { box-sizing: border-box !important; min-width: 168px !important; padding-left: 4px !important; padding-right: 0 !important; width: 168px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-rating-charges-section input.editable-rates.maxWidth100, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-rating-charges-section input.editable-rates.maxWidth100, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-rating-charges-section input.editable-rates.maxWidth100 { max-width: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr.ff-charge-total-row > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr.ff-charge-total-row > td:last-child, html body.ff-app.ff-app.ff-app #wizard.ff-stages-capture .ff-stages-rating-direct fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr.ff-charge-total-row > td:last-child { font-size: var(--ff-full-capture-readable-font-size, var(--ff-quick-capture-readable-font-size, 13px)) !important; height: calc(var(--ff-full-capture-readable-line-height, var(--ff-quick-capture-readable-line-height, 18px)) + 2px) !important; line-height: var(--ff-full-capture-readable-line-height, var(--ff-quick-capture-readable-line-height, 18px)) !important; padding-right: 0 !important; white-space: nowrap !important; } /* Full/Quick Capture RATE final trim. Keep this in dx-custom as well as the later polish file because this block is the main capture rating balance. */ html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset > .ff-rating-compact-row { align-items: flex-start !important; display: flex !important; flex-wrap: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col { box-sizing: border-box !important; display: block !important; flex: 0 0 497px !important; max-width: 497px !important; min-width: 497px !important; width: 497px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-rating-fieldset .ff-rating-charges-col > .ff-rating-split-row { width: 497px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section { flex: 0 0 247px !important; max-width: 247px !important; min-width: 247px !important; width: 247px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-charges-section > fieldset { max-width: 247px !important; min-width: 247px !important; width: 247px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection--agent .ff-subsection__table { width: 224px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:first-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:first-child { min-width: 92px !important; width: 92px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-charge-summary-table > tbody > tr > td:last-child, html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-subsection__table > tbody > tr > td:last-child { min-width: 132px !important; width: 132px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-mass-section { box-sizing: border-box !important; flex: 0 0 282px !important; float: none !important; max-width: 282px !important; min-width: 282px !important; padding-left: 0 !important; padding-right: 0 !important; width: 282px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-mass-section > fieldset { box-sizing: border-box !important; max-width: 282px !important; min-width: 282px !important; padding-left: 10px !important; padding-right: 10px !important; width: 282px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed { margin-left: auto !important; margin-right: 0 !important; table-layout: fixed !important; width: 260px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed > tbody > tr > td:first-child { box-sizing: border-box !important; min-width: 132px !important; padding-left: 0 !important; padding-right: 4px !important; white-space: nowrap !important; width: 132px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page fieldset.ff-legend--main .ff-rating-mass-section table.table-condensed > tbody > tr > td:last-child { box-sizing: border-box !important; min-width: 128px !important; padding-left: 4px !important; padding-right: 0 !important; white-space: nowrap !important; width: 128px !important; } html body.ff-app.ff-app.ff-app .ff-waybill.ff-capture-page .ff-rating-mass-section .ff-rating-actions { max-width: 282px !important; width: 100% !important; } /* Compact capture notification flyout. Keep this overlay-only so capture fields do not move. */ .ff-quote-notify { display: inline-flex; position: relative; } .ff-quote-notify-trigger { min-width: 82px !important; width: 82px !important; } .ff-quote-notify-panel { background: var(--ff-surface, var(--surface, #fff)); border: 1px solid var(--ff-border, var(--border, #cfd7e2)); border-radius: 6px; box-shadow: 0 8px 22px rgba(35, 48, 70, 0.22); color: var(--ff-text, var(--text, #242830)); font-size: 12px; min-width: 372px; padding: 8px; position: absolute; right: 0; top: calc(100% + 6px); z-index: 1060; } .ff-quote-notify-head, .ff-quote-notify-row, .ff-quote-notify-foot { align-items: center; display: flex; gap: 8px; } .ff-quote-notify-head { border-bottom: 1px solid var(--ff-border, var(--border, #e4e9f0)); justify-content: space-between; margin-bottom: 6px; padding-bottom: 5px; } .ff-quote-notify-actions { display: inline-flex; gap: 4px; } .ff-quote-notify-icon { align-items: center; background: var(--ff-surface-2, var(--surface-2, #f6f8fb)); border: 1px solid var(--ff-border, var(--border, #d5dde8)); border-radius: 4px; color: var(--ff-text, var(--text, #2d3748)); display: inline-flex; height: 22px; justify-content: center; padding: 0; width: 24px; } .ff-quote-notify-icon.is-active { background: var(--ff-primary, #347cf6); border-color: var(--ff-primary, #347cf6); color: #fff; } .ff-quote-notify-row { column-gap: 6px; display: grid; grid-template-columns: 82px 18px 78px 62px 100px; min-height: 26px; white-space: nowrap; } .ff-quote-notify-name { align-self: center; color: var(--ff-primary, var(--primary, #347cf6)); font-weight: 700; line-height: 16px; min-width: 0; transform: translateY(-1px); } .ff-quote-notify-spacer { display: block; min-width: 0; } .ff-quote-notify-row label { align-items: center; display: inline-flex; font-weight: 600; gap: 4px; justify-content: flex-start; line-height: 18px; margin: 0; width: max-content; } .ff-quote-notify-row input[type="checkbox"] { accent-color: var(--ff-primary, var(--primary, #347cf6)); margin: 0; position: relative; top: 0; } .ff-quote-notify-row label span { line-height: 18px; } .ff-quote-notify-foot { border-top: 1px solid var(--ff-border, var(--border, #e4e9f0)); color: var(--ff-muted, var(--text-muted, #6b7280)); font-size: 11px; justify-content: flex-end; margin-top: 7px; padding-top: 7px; } .ff-quote-notify-now { background: var(--ff-primary, #347cf6); border: 1px solid var(--ff-primary, #347cf6); border-radius: 4px; color: #fff; font-size: 12px; font-weight: 700; height: 24px; padding: 0 9px; } .ff-quote-notify-now:disabled { cursor: not-allowed; opacity: 0.48; } .ff-quote-notify-prompt-label { display: block; font-size: 12px; margin: 8px 0 -6px; text-align: left; } body.ff-app .swal2-container .swal2-input.ff-quote-notify-email-input { display: block !important; margin-left: auto !important; margin-right: auto !important; max-width: calc(100% - 32px) !important; width: 400px !important; } body.ff-app .swal2-container .swal2-input.ff-quote-notify-cell-input { display: block !important; margin-left: auto !important; margin-right: auto !important; max-width: calc(100% - 32px) !important; width: 260px !important; } body.ff-app[data-theme="dark"] .ff-quote-notify-panel { background: var(--ff-surface, var(--surface, #111827)); border-color: var(--ff-border, var(--border, #374151)); box-shadow: 0 10px 28px rgba(0, 0, 0, 0.5); color: var(--ff-text, var(--text, #e5e7eb)); } body.ff-app[data-theme="dark"] .ff-quote-notify-icon { background: var(--ff-surface-2, var(--surface-2, #172033)); border-color: var(--ff-border, var(--border, #374151)); color: var(--ff-text, var(--text, #e5e7eb)); } /* Global list placeholder removal. Empty list/search controls should stay visually blank until a value is chosen; selected values remain visible. */ html body :is(.ui-select-container, .ui-select-bootstrap, .ff-ui.ui-select-bootstrap) .ui-select-placeholder, html body :is(.dx-selectbox, .dx-dropdowneditor).dx-texteditor-empty .dx-placeholder, html body :is(.dx-selectbox, .dx-dropdowneditor).dx-texteditor-empty .dx-placeholder::before, html body :is(.dx-selectbox, .dx-dropdowneditor).dx-texteditor-empty .dx-placeholder::after { color: transparent !important; display: none !important; flex: 0 0 0 !important; margin: 0 !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; text-shadow: none !important; visibility: hidden !important; width: 0 !important; } html body :is(.ui-select-container, .ui-select-bootstrap, .ff-ui.ui-select-bootstrap) .ui-select-search::placeholder, html body .dropdown-multiselect .searchField::placeholder, html body .dropdown-multiselect #multiselectsearch::placeholder { color: transparent !important; opacity: 0 !important; } html body.ff-app.ff-app.ff-app .ff-users .ff-users-client-list .dropdown-multiselect .searchField::placeholder, html body.ff-app.ff-app.ff-app .ff-users .ff-users-client-list .dropdown-multiselect #multiselectsearch::placeholder { color: var(--muted, #6b7280) !important; opacity: 0.85 !important; } html body select.form-control:has(> option[value=""]:checked), html body select.ff-input:has(> option[value=""]:checked) { color: transparent !important; text-shadow: none !important; } html body select.form-control:has(> option[value=""]:checked) option, html body select.ff-input:has(> option[value=""]:checked) option { color: var(--text, #242830) !important; } /* Debriefing undebriefed-manifest popup. Keep this late so it wins over ff-theme. */ body.ff-app .ff-debriefing .ff-trip-expenses-action { align-items: flex-end !important; display: inline-flex !important; flex: 0 0 256px !important; gap: 8px !important; min-width: 256px !important; } body.ff-app .ff-debriefing .ff-trip-expenses-action .btn { align-items: center !important; display: inline-flex !important; height: var(--ff-control-h) !important; justify-content: center !important; margin: 0 !important; white-space: nowrap !important; } body.ff-app .ff-debriefing .ff-undebriefed-manifest-btn { gap: 5px !important; min-width: 82px !important; padding-left: 9px !important; padding-right: 9px !important; } body.ff-app .ff-debriefing #undebriefedManifestPopup.ff-undebriefed-manifest-popup:not(.dx-popup) { display: none !important; height: 0 !important; min-height: 0 !important; overflow: hidden !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .dx-popup-content { background: var(--ff-surface, var(--surface, #fff)) !important; color: var(--ff-text, var(--text, #242830)) !important; display: flex !important; flex-direction: column !important; overflow: visible !important; padding: 8px !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .dx-popup-title { background: var(--ff-surface-2, var(--surface-2, #f6f8fb)) !important; border-bottom: 1px solid var(--ff-border, var(--border, #d9e0ea)) !important; color: var(--ff-text, var(--text, #242830)) !important; } body.ff-app .ff-undebriefed-manifest-grid, body.ff-app .ff-undebriefed-manifest-grid.dx-datagrid { flex: 1 1 auto !important; height: auto !important; min-height: 300px !important; min-width: 0 !important; width: 100% !important; } body.ff-app .ff-undebriefed-manifest-filter { flex: 0 0 auto !important; margin-bottom: 7px !important; min-width: 0 !important; } body.ff-app .ff-undebriefed-manifest-filter-row { align-items: flex-end !important; display: flex !important; flex-wrap: wrap !important; gap: 8px !important; min-width: 0 !important; } body.ff-app .ff-undebriefed-manifest-field { display: flex !important; flex-direction: column !important; gap: 3px !important; margin: 0 !important; min-width: 0 !important; } body.ff-app .ff-undebriefed-manifest-field > span { color: var(--ff-text, var(--text, #242830)) !important; font-size: 12px !important; font-weight: 700 !important; line-height: 14px !important; } body.ff-app .ff-undebriefed-manifest-field--period { flex: 0 0 124px !important; } body.ff-app .ff-undebriefed-manifest-field--date { flex: 0 0 142px !important; width: 142px !important; } body.ff-app .ff-undebriefed-manifest-field--branch { flex: 1.35 1 240px !important; max-width: 420px !important; min-width: 200px !important; } body.ff-app .ff-undebriefed-manifest-field--lookup { flex: 1 1 200px !important; max-width: 340px !important; min-width: 180px !important; } body.ff-app .ff-undebriefed-manifest-filter .form-control, body.ff-app .ff-undebriefed-manifest-filter .btn, body.ff-app .ff-undebriefed-manifest-filter .ui-select-container .btn, body.ff-app .ff-undebriefed-manifest-filter .ui-select-match > .btn { height: 30px !important; min-height: 30px !important; } body.ff-app .ff-undebriefed-manifest-filter .input-group .btn { align-items: center !important; display: inline-flex !important; justify-content: center !important; min-width: 30px !important; padding-left: 8px !important; padding-right: 8px !important; } body.ff-app .ff-undebriefed-manifest-field--date .input-group { display: flex !important; width: 142px !important; } body.ff-app .ff-undebriefed-manifest-field--date .input-group .form-control { display: block !important; flex: 1 1 auto !important; min-width: 0 !important; width: 112px !important; } body.ff-app .ff-undebriefed-manifest-field--date .input-group .input-group-btn { display: flex !important; flex: 0 0 30px !important; width: 30px !important; } body.ff-app .ff-undebriefed-manifest-field--date .input-group .input-group-btn .btn { min-width: 30px !important; padding-left: 0 !important; padding-right: 0 !important; width: 30px !important; } body.ff-app .ff-undebriefed-manifest-native-select { display: block !important; height: 30px !important; min-height: 30px !important; padding-bottom: 3px !important; padding-top: 3px !important; text-align: left !important; text-align-last: left !important; width: 100% !important; } body.ff-app .ff-undebriefed-manifest-field :is(ui-select, .ui-select-container, .ui-select-match) { display: block !important; min-width: 0 !important; width: 100% !important; } body.ff-app .ff-undebriefed-manifest-field :is(.ui-select-container.open, .ui-select-bootstrap.open) { z-index: 2400 !important; } body.ff-app .ff-undebriefed-manifest-toolbar-row { align-items: center !important; display: grid !important; gap: 8px 12px !important; grid-template-columns: auto minmax(280px, 1fr) 156px !important; margin-top: 8px !important; min-width: 0 !important; } body.ff-app .ff-undebriefed-manifest-count { align-items: center !important; align-self: start !important; background: var(--ff-accent, var(--primary, #2f78ef)) !important; border-radius: 4px !important; color: #fff !important; display: inline-flex !important; font-size: 13px !important; font-weight: 700 !important; height: 30px !important; justify-content: center !important; justify-self: start !important; min-width: 72px !important; padding: 0 10px !important; white-space: nowrap !important; } body.ff-app .ff-undebriefed-manifest-actions { align-items: stretch !important; display: flex !important; flex-direction: column !important; flex: 0 0 auto !important; gap: 6px !important; justify-self: end !important; width: 156px !important; } body.ff-app .ff-undebriefed-manifest-actions .btn { align-items: center !important; display: inline-flex !important; gap: 5px !important; justify-content: center !important; padding-left: 10px !important; padding-right: 10px !important; white-space: nowrap !important; } body.ff-app .ff-undebriefed-manifest-output-actions { display: grid !important; gap: 6px !important; grid-template-columns: 1fr 1fr !important; } body.ff-app .ff-undebriefed-manifest-search { width: 100% !important; } body.ff-app .ff-undebriefed-manifest-global-search { display: block !important; justify-self: center !important; margin: 0 !important; max-width: 520px !important; min-width: 280px !important; position: relative !important; width: 100% !important; } body.ff-app .ff-undebriefed-manifest-global-search .fa { color: var(--ff-muted, var(--muted, #7b8794)) !important; font-size: 14px !important; left: 11px !important; pointer-events: none !important; position: absolute !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 2 !important; } body.ff-app .ff-undebriefed-manifest-global-search .form-control { padding-left: 32px !important; width: 100% !important; } body.ff-app .ff-undebriefed-manifest-export { align-items: center !important; display: inline-flex !important; gap: 6px !important; justify-content: center !important; min-width: 0 !important; padding-left: 10px !important; padding-right: 10px !important; white-space: nowrap !important; } body.ff-app .ff-undebriefed-manifest-print { align-items: center !important; display: inline-flex !important; gap: 6px !important; justify-content: center !important; min-width: 0 !important; padding-left: 10px !important; padding-right: 10px !important; white-space: nowrap !important; } body.ff-app .ff-undebriefed-manifest-popup-title { align-items: center !important; display: inline-flex !important; gap: 10px !important; min-height: 32px !important; } body.ff-app .ff-undebriefed-manifest-popup-title-text { display: inline-block !important; line-height: 1.2 !important; } body.ff-app .ff-undebriefed-manifest-title-clear { align-items: center !important; appearance: none !important; background: color-mix(in srgb, var(--error, #f05161) 6%, var(--surface, #fff)) !important; border: 1px solid color-mix(in srgb, var(--error, #f05161) 55%, var(--border, #d7dee8)) !important; border-radius: 999px !important; color: var(--error, #f05161) !important; cursor: pointer !important; display: inline-flex !important; flex: 0 0 28px !important; height: 28px !important; justify-content: center !important; margin: 0 !important; min-height: 28px !important; min-width: 28px !important; opacity: .88 !important; padding: 0 !important; width: 28px !important; } body.ff-app .ff-undebriefed-manifest-title-clear:hover { opacity: 1 !important; } body.ff-app .ff-undebriefed-manifest-title-clear:focus, body.ff-app .ff-undebriefed-manifest-title-clear:focus-visible { outline: none !important; box-shadow: 0 0 0 3px var(--focus, rgba(55, 124, 247, .24)) !important; } body.ff-app .ff-undebriefed-manifest-title-clear .fa { color: currentColor !important; font-size: 15px !important; line-height: 1 !important; pointer-events: none !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-grid .dx-datagrid-header-panel { display: none !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-table { table-layout: fixed !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .dx-datagrid .dx-datagrid-rowsview .dx-data-row > td { height: var(--ff-grid-row-height) !important; line-height: calc(var(--ff-grid-row-height) - 2px) !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; white-space: nowrap !important; } body.ff-app .ff-undebriefed-manifest-popup-wrapper .dx-datagrid .dx-toolbar .dx-button { min-height: 26px !important; } body.ff-app[data-theme="dark"] .ff-undebriefed-manifest-popup-wrapper .dx-popup-content { background: var(--ff-surface, var(--surface, #111827)) !important; color: var(--ff-text, var(--text, #e5e7eb)) !important; } html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters):has(:is(.ui-select-container, .ui-select-bootstrap, ui-select)) { contain: none !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters):has(:is(.ui-select-container, .ui-select-bootstrap, ui-select)) :is(.row, [class*="col-"], .form-group, .input-group, .ff-filter-flow-row, .ff-waybill-filter-grid, .ff-finance-primary-filters) { contain: none !important; overflow: visible !important; } html body.ff-app.ff-app.ff-app :is(.ui-select-container, .ui-select-bootstrap, ui-select) { min-width: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) { position: relative !important; z-index: 2400 !important; } html body.ff-app.ff-app.ff-app :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) .ui-select-choices { display: block !important; max-height: min(320px, calc(100dvh - 160px)) !important; opacity: 1 !important; overflow-x: hidden !important; overflow-y: auto !important; visibility: visible !important; z-index: 2450 !important; } /* Generate Manifest summary guard: summary grids should not show waybill-entry controls. */ body.ff-app .ff-generate-manifest.ff-manifest-summary-mode .ff-manifest-wb-entry-row { display: none !important; } /* Generate Manifest eye action final alignment. Keep after shared v26 eye nudges. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-v26-single-table-sticky-grid { --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width, 28px) !important; --ff-v26-sticky-action-width: 34px !important; --ff-v26-sticky-key-left: calc(var(--ff-v26-sticky-select-width, 28px) + var(--ff-v26-sticky-action-width, 34px)) !important; --ff-v26-sticky-select-left: 0px !important; --ff-v26-sticky-select-width: 28px !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview) :is(td, th):is(.ff-v26-sticky-action-col, .ff-manifest-command-col, .dx-command-edit) { left: var(--ff-v26-sticky-action-left, 28px) !important; max-width: var(--ff-v26-sticky-action-width, 34px) !important; min-width: var(--ff-v26-sticky-action-width, 34px) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-v26-sticky-action-width, 34px) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-action-col, .ff-manifest-command-col, .dx-command-edit) :is(.dx-link, .dx-button, .dx-button-content, .ff-manifest-eye-action, .ff-manifest-view-cell) { align-items: center !important; display: flex !important; height: 100% !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-width: none !important; min-height: var(--ff-grid-row-height, 22px) !important; padding: 0 !important; position: static !important; text-align: center !important; transform: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-action-col, .ff-manifest-command-col, .dx-command-edit) :is(.dx-link-icon, .dx-icon, .fa, .fa-eye, .dx-icon.fa-eye, .ff-manifest-eye-action)::before, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-v26-sticky-action-col, .ff-manifest-command-col, .dx-command-edit) :is(.dx-link-icon, .dx-icon, .fa, .fa-eye, .dx-icon.fa-eye, .ff-manifest-eye-action) { align-items: center !important; display: inline-flex !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; position: static !important; text-align: center !important; top: auto !important; transform: none !important; } /* Generate Manifest final header colour guard. Apply the theme header background to every header cell, not only sticky command cells. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-headers .dx-header-row > :is(td, th) { background: var(--primary, #347cf5) !important; background-color: var(--primary, #347cf5) !important; color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-headers .dx-header-row > :is(td, th) :is(.dx-datagrid-text-content, .dx-sort, .dx-sort-indicator, .dx-header-filter, .dx-column-indicators) { color: var(--on-primary, #fff) !important; } /* Generate Manifest dark data-checkbox guard. Row selectors use their own checkbox styling; this makes read-only boolean cells visible in dark mode. */ html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) :is(.ff-grid-boolean-checkbox, .ff-grid-boolean-checkbox > div, .dx-checkbox, .dx-checkbox-container, .dx-checkbox-wrapper, .dx-select-checkbox, input[type="checkbox"]) { align-items: center !important; background: transparent !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-standard-grid-check-size, 14px) !important; justify-content: center !important; line-height: var(--ff-standard-grid-check-size, 14px) !important; margin: 0 auto !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; visibility: visible !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) :is(.ff-grid-boolean-checkbox .dx-checkbox-icon, .dx-checkbox-icon, input[type="checkbox"]) { accent-color: var(--primary, #5b8cff) !important; background-color: color-mix(in srgb, var(--surface-2, #171d2b) 82%, var(--text, #e5e7eb) 18%) !important; border: 1px solid color-mix(in srgb, var(--border, #7c8799) 62%, var(--text, #e5e7eb) 38%) !important; border-radius: 2px !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08) !important; box-sizing: border-box !important; color: var(--on-primary, #fff) !important; display: inline-block !important; height: var(--ff-standard-grid-check-size, 14px) !important; max-height: var(--ff-standard-grid-check-size, 14px) !important; max-width: var(--ff-standard-grid-check-size, 14px) !important; min-height: var(--ff-standard-grid-check-size, 14px) !important; min-width: var(--ff-standard-grid-check-size, 14px) !important; opacity: 1 !important; position: relative !important; visibility: visible !important; width: var(--ff-standard-grid-check-size, 14px) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) input[type="checkbox"]:checked { background-color: var(--primary, #5b8cff) !important; border-color: var(--primary, #5b8cff) !important; color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-generate-manifest.ff-generate-manifest.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.ff-manifest-select-col):not(.dx-command-edit):not(.ff-manifest-command-col) :is(.dx-checkbox.dx-checkbox-checked, .dx-checkbox.dx-checkbox-indeterminate) .dx-checkbox-icon:before { color: var(--on-primary, #fff) !important; opacity: 1 !important; visibility: visible !important; } /* Generate Manifest final footer spacing guard. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-row, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-panel, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-panel > .panel-body, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest :is(.dx-datagrid-pager, .dx-pager) { align-items: center !important; display: flex !important; height: 28px !important; justify-content: flex-end !important; margin: 0 !important; max-height: 28px !important; min-height: 28px !important; padding: 0 4px !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--generate-manifest :is(.dx-datagrid-pager, .dx-pager) :is(.dx-page-sizes, .dx-pages, .dx-info) { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 24px !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-footer-row { margin-top: 4px !important; padding-top: 0 !important; } /* Absolute-final v26 old-method grid conversion guard. Bulk Capture, Tariffs, and View Manifests now use the shared rendered-column width lock instead of late max-content table forcing. */ html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid { --ff-v26-standard-grid-horizontal-width: 100% !important; --ff-bulk-capture-horizontal-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; --ff-tariffs-horizontal-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; --ff-view-manifests-horizontal-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; } html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid, .dx-gridbase-container, .dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer, .dx-datagrid-pager, .dx-pager), html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { box-sizing: border-box !important; max-width: 100% !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; } html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; table-layout: fixed !important; width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; } /* View Manifests row-width guard. The header and total footer are already on the shared v26 width lock; keep the rowsview body on the same manifest-specific measured width so data rows cannot collapse to only the currently rendered left-hand columns. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { box-sizing: content-box !important; max-width: none !important; min-width: var(--ff-view-manifests-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; width: var(--ff-view-manifests-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-view-manifests-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; table-layout: fixed !important; width: var(--ff-view-manifests-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed, html body.ff-app.ff-app.ff-app :is(.ff-bulk-capture.ff-v26-grid-blueprint, .ff-page.ff-rates-tariffs.ff-tariffs.ff-v26-grid-blueprint, .ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-scrollable-content, .dx-datagrid-table, table) { display: none !important; max-width: 0 !important; min-width: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; width: 0 !important; } /* Absolute-final ui-select alignment guard. Prevent shared list controls from briefly painting selected/search text right-aligned before Angular settles. */ html body.ff-app.ff-app.ff-app ui-select, html body.ff-app.ff-app.ff-app ui-select-match, html body.ff-app.ff-app.ff-app ui-select-choices, html body.ff-app.ff-app.ff-app .dx-field-value ui-select, html body.ff-app.ff-app.ff-app .dx-field-value ui-select-match, html body.ff-app.ff-app.ff-app .dx-field-value ui-select-choices, html body.ff-app.ff-app.ff-app .ui-select-container, html body.ff-app.ff-app.ff-app .ui-select-bootstrap, html body.ff-app.ff-app.ff-app .ui-select-bootstrap > .ui-select-match, html body.ff-app.ff-app.ff-app .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ui-select-bootstrap > .ui-select-match > .ui-select-toggle { direction: ltr !important; text-align: left !important; text-align-last: left !important; } html body.ff-app.ff-app.ff-app ui-select, html body.ff-app.ff-app.ff-app ui-select-match { display: block !important; float: none !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ui-select-bootstrap > .ui-select-match > .ui-select-toggle { align-items: center !important; display: flex !important; justify-content: flex-start !important; } html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-search, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-placeholder, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text *, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-choices-row-inner, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-choices-row-inner * { direction: ltr !important; float: none !important; text-align: left !important; text-align-last: left !important; } html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text { display: block !important; flex: 1 1 auto !important; justify-content: flex-start !important; margin-left: 0 !important; margin-right: auto !important; min-width: 0 !important; } html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-placeholder.ng-hide, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text.ng-hide, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text.ng-hide *, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-search.ng-hide, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match.ng-hide, html body.ff-app.ff-app.ff-app ui-select-match.ng-hide { display: none !important; } html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text.pull-left, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-match-text.pull-right, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-placeholder.pull-left, html body.ff-app.ff-app.ff-app .ui-select-bootstrap .ui-select-placeholder.pull-right { float: none !important; } /* Absolute-final ui-select close/open size guard. ui-select briefly swaps the search input and match button while closing. Keep the host sized so the whole list field cannot collapse to only its caption. */ html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters) :is(ui-select, .ui-select-container, .ui-select-bootstrap) { box-sizing: border-box !important; display: block !important; min-height: var(--ff-control-h, 30px) !important; min-width: 0 !important; position: relative !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters) .ui-select-bootstrap > .ui-select-match, html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters) .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters) .ui-select-bootstrap > .ui-select-match > .ui-select-toggle, html body.ff-app.ff-app.ff-app :is(.dx-popup-content, .modal-content, .ff-waybill, .ff-sr-card, .ff-standard-filter-overlay-panel, .ff-standard-filter-inline-row, .ff-finance-primary-filters) .ui-select-bootstrap .ui-select-search { box-sizing: border-box !important; min-height: var(--ff-control-h, 30px) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-field :is(ui-select, .ui-select-container, .ui-select-bootstrap), html body.ff-app.ff-app.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-field .ui-select-bootstrap > .ui-select-match, html body.ff-app.ff-app.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-field .ui-select-bootstrap > .ui-select-match > .btn, html body.ff-app.ff-app.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-field .ui-select-bootstrap > .ui-select-match > .ui-select-toggle, html body.ff-app.ff-app.ff-app .ff-undebriefed-manifest-popup-wrapper .ff-undebriefed-manifest-field .ui-select-bootstrap .ui-select-search { height: 30px !important; min-height: 30px !important; } /* Absolute-final View Manifests sparse-row width guard. Keep body rows on the same locked surface width as the header, even when a one-row result would otherwise shrink the rowsview table to max-content. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-v26-single-table-sticky-grid { --ff-view-manifests-horizontal-width-final: max(100%, var(--ff-view-manifests-horizontal-width, var(--ff-v26-standard-grid-horizontal-width, 100%))) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple.ff-v26-grid-blueprint, .ff-view-manifests.ff-v26-grid-blueprint) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed), .dx-datagrid-table:not(.dx-pointer-events-none), tbody, tr.dx-data-row) { box-sizing: border-box !important; max-width: none !important; min-width: var(--ff-view-manifests-horizontal-width-final) !important; width: var(--ff-view-manifests-horizontal-width-final) !important; } /* Absolute-final View Manifests native-grid fixed pane, totals, and density guard. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid { --ff-grid-cell-padding-y: 1px !important; --ff-grid-row-height: 22px !important; --ff-standard-grid-cell-line-height: 20px !important; --ff-standard-grid-cell-padding-y: 1px !important; --ff-standard-grid-effective-rows-height: var(--ff-view-manifests-rows-height-final) !important; --ff-standard-grid-row-height: 22px !important; --ff-standard-grid-total-footer-height: 24px !important; --ff-v26-sticky-action-left: var(--ff-view-manifest-select-width) !important; --ff-v26-sticky-action-width: var(--ff-view-manifest-action-width) !important; --ff-v26-sticky-key-left: calc(var(--ff-view-manifest-select-width) + var(--ff-view-manifest-action-width)) !important; --ff-v26-sticky-key-width: var(--ff-view-manifest-key-width) !important; --ff-v26-sticky-key2-left: calc(var(--ff-v26-sticky-key-left) + var(--ff-view-manifest-key-width)) !important; --ff-v26-sticky-key2-width: var(--ff-view-manifest-waybill-width) !important; --ff-v26-sticky-select-left: 0px !important; --ff-v26-sticky-select-width: var(--ff-view-manifest-select-width) !important; --ff-view-manifests-grid-height-final: clamp(408px, calc(100dvh - 202px), 1508px) !important; --ff-view-manifests-rows-height-final: max(calc(22px * 8), calc(var(--ff-view-manifests-grid-height-final) - var(--ff-view-manifests-grid-chrome-height, 188px))) !important; --ff-view-manifests-row-height-final: 22px !important; --ff-view-manifest-action-width: 24px !important; --ff-view-manifest-key-width: 118px !important; --ff-view-manifest-select-width: 24px !important; --ff-view-manifest-waybill-width: 135px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid.ff-manifest-view-viewport-grid, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid.ff-manifest-view-viewport-grid > :is(.dx-datagrid, .dx-gridbase-container) { height: var(--ff-view-manifests-grid-height-measured, auto) !important; max-height: var(--ff-view-manifests-grid-height-measured, none) !important; min-height: var(--ff-view-manifests-grid-height-measured, auto) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container, .dx-datagrid-content-fixed) { height: var(--ff-view-manifests-rows-height-measured, var(--ff-standard-grid-effective-rows-height, auto)) !important; max-height: var(--ff-view-manifests-rows-height-measured, var(--ff-standard-grid-effective-rows-height, none)) !important; min-height: var(--ff-view-manifests-rows-height-measured, var(--ff-standard-grid-effective-rows-height, auto)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid.ff-manifest-view-viewport-grid .dx-datagrid-rowsview :is(.dx-scrollable-content, .dx-datagrid-content:not(.dx-datagrid-content-fixed)) { min-height: var(--ff-view-manifests-rows-height-measured, var(--ff-standard-grid-effective-rows-height, auto)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed { background: linear-gradient(to right, var(--surface, #fff) 0, var(--surface, #fff) calc(var(--ff-v26-sticky-key2-left) + var(--ff-v26-sticky-key2-width)), transparent calc(var(--ff-v26-sticky-key2-left) + var(--ff-v26-sticky-key2-width))) !important; background-color: transparent !important; border-right: 0 !important; box-shadow: none !important; display: block !important; isolation: isolate !important; max-width: none !important; min-width: 0 !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; z-index: 80 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-datagrid-table, table) { background: transparent !important; background-color: transparent !important; display: table !important; max-width: none !important; min-width: 0 !important; opacity: 1 !important; pointer-events: auto !important; visibility: visible !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th) { background: var(--primary, #347cf5) !important; background-color: var(--primary, #347cf5) !important; color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th) :is(.dx-datagrid-text-content, .dx-sort, .dx-sort-indicator, .dx-header-filter, .dx-column-indicators) { color: var(--on-primary, #fff) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-manifest-key-col, .ff-v26-sticky-key-col):empty::before { content: "Manifest #"; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-manifest-key-col, .ff-v26-sticky-key-col) .dx-datagrid-text-content:empty::before { content: "Manifest #"; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col):empty::before { content: "Waybill #"; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col) .dx-datagrid-text-content:empty::before { content: "Waybill #"; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select) { max-width: var(--ff-view-manifest-select-width) !important; min-width: var(--ff-view-manifest-select-width) !important; width: var(--ff-view-manifest-select-width) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { max-width: var(--ff-view-manifest-action-width) !important; min-width: var(--ff-view-manifest-action-width) !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-view-manifest-action-width) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-key-col, .ff-v26-sticky-key-col) { max-width: var(--ff-view-manifest-key-width) !important; min-width: var(--ff-view-manifest-key-width) !important; width: var(--ff-view-manifest-key-width) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th).ff-manifest-waybill-col { max-width: var(--ff-view-manifest-waybill-width) !important; min-width: var(--ff-view-manifest-waybill-width) !important; width: var(--ff-view-manifest-waybill-width) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select) { left: 0 !important; position: sticky !important; z-index: 48 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { left: var(--ff-v26-sticky-action-left) !important; overflow: visible !important; position: sticky !important; z-index: 47 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-key-col, .ff-v26-sticky-key-col) { left: var(--ff-v26-sticky-key-left) !important; position: sticky !important; z-index: 46 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { left: var(--ff-v26-sticky-key2-left) !important; position: sticky !important; z-index: 45 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col) { box-shadow: none !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { border-right: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; box-shadow: 1px 0 0 var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-headers .dx-header-row > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { background: var(--primary, #347cf5) !important; color: var(--on-primary, #fff) !important; z-index: 56 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-filter-row > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-filter-row > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { background: var(--surface, #fff) !important; z-index: 54 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-data-row > td, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td { block-size: var(--ff-grid-row-height) !important; box-sizing: border-box !important; font-size: var(--ff-standard-grid-font-size, 12px) !important; height: var(--ff-grid-row-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; max-height: var(--ff-grid-row-height) !important; min-height: var(--ff-grid-row-height) !important; overflow: hidden !important; padding-bottom: var(--ff-grid-cell-padding-y) !important; padding-top: var(--ff-grid-cell-padding-y) !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed, tbody) { border-spacing: 0 !important; line-height: var(--ff-standard-grid-cell-line-height) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(tr.dx-data-row, tr.dx-row.dx-data-row, .dx-row.dx-data-row, .dx-data-row) > td > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, .dx-link) { font-size: inherit !important; height: var(--ff-standard-grid-cell-line-height) !important; line-height: var(--ff-standard-grid-cell-line-height) !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: var(--ff-standard-grid-cell-line-height) !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; vertical-align: middle !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link { align-items: center !important; color: var(--primary, #347cf5) !important; display: flex !important; height: var(--ff-grid-row-height) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; padding: 0 !important; position: static !important; text-align: center !important; text-decoration: none !important; transform: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link .fa, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link .fa::before { align-items: center !important; color: var(--primary, #347cf5) !important; display: inline-flex !important; font-size: 16px !important; height: 18px !important; justify-content: center !important; line-height: 18px !important; margin: 0 !important; opacity: 1 !important; text-align: center !important; visibility: visible !important; width: 18px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer { min-height: var(--ff-standard-grid-total-footer-height) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-total-footer :is(.dx-row, .dx-row > td, .dx-datagrid-summary-item) { font-size: var(--ff-standard-grid-font-size, 12px) !important; height: var(--ff-standard-grid-total-footer-height) !important; line-height: 20px !important; max-height: var(--ff-standard-grid-total-footer-height) !important; min-height: var(--ff-standard-grid-total-footer-height) !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } /* Final View Manifests compact utility-column and 22px data-row guard. */ html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select) { max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; width: 24px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { max-width: 24px !important; min-width: 24px !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 24px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-row.dx-data-row, tr.dx-data-row), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-row.dx-data-row, tr.dx-data-row) > :is(td, th) { block-size: 22px !important; box-sizing: border-box !important; font-size: 12px !important; height: 22px !important; line-height: 20px !important; max-block-size: 22px !important; max-height: 22px !important; min-block-size: 22px !important; min-height: 22px !important; overflow: hidden !important; padding-bottom: 1px !important; padding-top: 1px !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr.dx-row.dx-data-row > :is(td, th) { block-size: 22px !important; font-size: 12px !important; height: 22px !important; line-height: 20px !important; max-block-size: 22px !important; max-height: 22px !important; min-block-size: 22px !important; min-height: 22px !important; padding-bottom: 1px !important; padding-top: 1px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-row.dx-data-row, tr.dx-data-row) > :is(td, th) > :is(.dx-template-wrapper, .dx-datagrid-text-content, .ff-grid-cell-value, .ff-grid-link, span, a, button, .btn, .label, .badge, .dx-link) { font-size: inherit !important; height: 20px !important; line-height: 20px !important; max-height: 20px !important; min-height: 0 !important; overflow: hidden !important; padding-bottom: 0 !important; padding-top: 0 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link { height: 20px !important; line-height: 20px !important; width: 24px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { background: var(--surface, #fff) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row.dx-row-alt > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { background: var(--surface-muted, #f5f5f5) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { background: var(--ff-view-manifests-selected-sticky-bg, #fff3b0) !important; background-clip: border-box !important; background-color: var(--ff-view-manifests-selected-sticky-bg, #fff3b0) !important; color: var(--text, #1f2933) !important; opacity: 1 !important; overflow: hidden !important; z-index: 64 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select) { z-index: 68 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { z-index: 67 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-manifest-key-col, .ff-v26-sticky-key-col) { z-index: 66 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col) { z-index: 65 !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(td, th):is(.dx-pointer-events-none, .dx-hidden-cell), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(td, th):is(.dx-pointer-events-none, .dx-hidden-cell) > * { color: transparent !important; font-size: 0 !important; line-height: 0 !important; opacity: 0 !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link .fa, html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-manifest-view-link .fa::before { font-size: 16px !important; height: 18px !important; line-height: 18px !important; width: 18px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid .dx-datagrid-rowsview :is(.dx-row.dx-data-row, tr.dx-row.dx-data-row, tr.dx-data-row) > :is(td, th) :is(.dx-checkbox, .dx-checkbox-container, .dx-select-checkbox, .dx-checkbox-icon, input[type="checkbox"]) { block-size: 16px !important; height: 16px !important; line-height: 16px !important; max-block-size: 16px !important; max-height: 16px !important; min-block-size: 0 !important; min-height: 0 !important; width: 16px !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) .dx-datagrid-content-fixed :is(.dx-row, tr) > :is(td, th):not(.dx-pointer-events-none):not(.dx-hidden-cell), html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-select-col, .ff-v26-sticky-select-col, .dx-command-select, .ff-manifest-command-col, .ff-v26-sticky-action-col, .dx-command-edit, .ff-manifest-key-col, .ff-v26-sticky-key-col, .ff-manifest-waybill-col, .ff-v26-sticky-key2-col):not(.dx-pointer-events-none):not(.dx-hidden-cell) { border-bottom: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; border-top: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--manifests.ff-view-manifests-native-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-manifest-waybill-col, .ff-v26-sticky-key2-col):not(.dx-pointer-events-none):not(.dx-hidden-cell) { border-right: 2px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; } /* Absolute-final Bulk Capture selector checkbox centering. This must sit after the shared v26 checkbox lift, which otherwise moves the native row selector out of the center of its sticky cell. */ html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) { overflow: visible !important; padding: 0 !important; position: sticky !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper { display: block !important; inset: 0 !important; margin: 0 !important; padding: 0 !important; position: absolute !important; } html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-all, input[type="checkbox"].ff-v26-native-select-checkbox), html body.ff-app.ff-app.ff-app .ff-bulk-capture.ff-bulk-capture.ff-v26-grid-blueprint #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--bulk-capture.ff-bulk-capture-native-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(td, th):is(.ff-bulk-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-all, .ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-all, input[type="checkbox"].ff-v26-native-select-checkbox) { display: block !important; height: 14px !important; left: 50% !important; margin: 0 !important; padding: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; vertical-align: top !important; width: 14px !important; } /* Generate Manifest selected-row delete toolbar state. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn:disabled { background: #f3f4f6 !important; border-color: #c9ced6 !important; color: #7a828e !important; cursor: not-allowed !important; opacity: 1 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn .fa, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn span { color: inherit !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn.ff-manifest-grid-delete-btn--active:not(:disabled) { background: #fff1f1 !important; border-color: #ff9b9b !important; color: #d9534f !important; cursor: pointer !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn.ff-manifest-grid-delete-btn--active:not(:disabled):hover, html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest .ff-manifest-grid-delete-btn.ff-manifest-grid-delete-btn--active:not(:disabled):focus { background: #ffe4e4 !important; border-color: #ff7f7f !important; color: #c9302c !important; } /* Receiver Master final cell-border continuity. DevExtreme renders the fixed and scrollable panes separately; keep both panes drawing the same grid lines so mid-grid columns do not lose row borders. */ html body.ff-app.ff-app.ff-app .ff-receivers.ff-receivers.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--receivers :is(.dx-datagrid-headers, .dx-datagrid-rowsview) :is(.dx-datagrid-content, .dx-datagrid-content-fixed) :is(.dx-datagrid-table, .dx-datagrid-table-fixed) > tbody > tr:not(.dx-virtual-row) > :is(td, th):not(.dx-hidden-cell):not(.dx-pointer-events-none) { border-bottom: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; border-right: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; box-sizing: border-box !important; } /* View Collections final fixed-pane guard. Saved layouts and the older viewport-grid CSS can otherwise widen the selector/action columns again after search or reload. */ html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections { --ff-collection-select-width-final: 30px !important; --ff-collection-action-width-final: 58px !important; --ff-view-collections-select-column-width: var(--ff-collection-select-width-final) !important; --ff-view-collections-id-column-width: var(--ff-standard-grid-id-width, 64px) !important; --ff-view-collections-command-column-width: var(--ff-collection-action-width-final) !important; --ff-view-collections-fixed-pane-width: calc(var(--ff-collection-select-width-final) + var(--ff-standard-grid-id-width, 64px) + var(--ff-collection-action-width-final)) !important; --ff-v26-sticky-select-width: var(--ff-collection-select-width-final) !important; --ff-v26-sticky-action-width: var(--ff-collection-action-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.dx-command-select, .ff-collection-select-col, .ff-v26-sticky-select-col) { box-sizing: border-box !important; max-width: var(--ff-collection-select-width-final) !important; min-width: var(--ff-collection-select-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-collection-select-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-collection-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { box-sizing: border-box !important; max-width: var(--ff-collection-action-width-final) !important; min-width: var(--ff-collection-action-width-final) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; width: var(--ff-collection-action-width-final) !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-collection-id-col, .ff-v26-sticky-key-col) { box-sizing: border-box !important; max-width: var(--ff-standard-grid-id-width, 64px) !important; min-width: var(--ff-standard-grid-id-width, 64px) !important; width: var(--ff-standard-grid-id-width, 64px) !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-total-footer) .dx-scrollable-container { overflow-x: hidden !important; scrollbar-gutter: auto !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-total-footer) :is(.dx-scrollbar-horizontal, .dx-scrollable-scrollbar-horizontal) { display: none !important; height: 0 !important; opacity: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-collection-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-collection-row-action-buttons { align-items: center !important; display: inline-flex !important; gap: 5px !important; height: 100% !important; justify-content: center !important; margin: 0 auto !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-collection-command-col, .ff-v26-sticky-action-col, .dx-command-edit) .ff-grid-row-action-button { align-items: center !important; background: transparent !important; border: 0 !important; color: var(--primary, #2f77f3) !important; display: inline-flex !important; height: 16px !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; min-height: 16px !important; min-width: 16px !important; padding: 0 !important; width: 16px !important; } /* View Collections uses strong status row colours, often applied inline. Keep those colours, but add a clear selection tint and row edge so selected rows remain visible on red/grey status backgrounds. */ html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) { outline: 2px solid rgba(0, 105, 255, .78) !important; outline-offset: -2px !important; } html body.ff-app.ff-app.ff-app .ff-view-collections.ff-view-collections #gridContainer#gridContainer:is(.ff-standard-grid, .ff-collections-viewport-grid) .dx-datagrid-rowsview .dx-data-row:is(.dx-selection, .ff-dx-row-selected) > :is(td, th) { box-shadow: inset 0 0 0 9999px rgba(0, 120, 255, .24), inset 0 2px 0 rgba(255, 255, 255, .78), inset 0 -2px 0 rgba(255, 255, 255, .78) !important; } /* Absolute-last v26 boolean checkbox parity. Boolean data cells are rendered differently from row selectors on a few pages, so size the actual DevExtreme checkbox pieces to the same square. */ html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-standard-grid-page { --ff-v26-data-check-size-final: var(--ff-standard-grid-check-size, 16px); } html body.ff-app.ff-app.ff-app .ff-view-payments.ff-query-grid-page, html body.ff-app.ff-app.ff-app .ff-view-payments.ff-standard-grid-page { --ff-v26-data-check-size-final: var(--ff-payments-check-size, var(--ff-standard-grid-check-size, 18px)); } html body.ff-app.ff-app.ff-app :is(.ff-v26-grid-blueprint.ff-standard-grid-page, .ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.dx-command-edit):not(.ff-v26-sticky-select-col):not(.ff-v26-sticky-action-col) :is(.ff-grid-boolean-checkbox, .dx-checkbox, .dx-checkbox-container, .dx-checkbox-wrapper, .dx-select-checkbox, .dx-checkbox-icon) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; justify-content: center !important; line-height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; margin: 0 auto !important; max-height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; max-width: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; min-height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; min-width: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; opacity: 1 !important; overflow: visible !important; padding: 0 !important; position: static !important; transform: none !important; vertical-align: middle !important; visibility: visible !important; width: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-v26-grid-blueprint.ff-standard-grid-page, .ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.dx-command-edit):not(.ff-v26-sticky-select-col):not(.ff-v26-sticky-action-col) :is(.ff-grid-boolean-checkbox .dx-checkbox-icon, .dx-checkbox-icon) { background-color: var(--ff-input-bg, var(--input-bg, var(--surface, #fff))) !important; border: 1px solid var(--ff-border, var(--border, #9aa4b2)) !important; border-radius: 3px !important; box-sizing: border-box !important; height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; min-height: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; min-width: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; position: relative !important; width: var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) !important; } html body.ff-app.ff-app.ff-app :is(.ff-v26-grid-blueprint.ff-standard-grid-page, .ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.dx-command-edit):not(.ff-v26-sticky-select-col):not(.ff-v26-sticky-action-col) .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app :is(.ff-v26-grid-blueprint.ff-standard-grid-page, .ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.dx-command-edit):not(.ff-v26-sticky-select-col):not(.ff-v26-sticky-action-col) .dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app :is(.ff-v26-grid-blueprint.ff-standard-grid-page, .ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):not(.dx-command-select):not(.dx-command-edit):not(.ff-v26-sticky-select-col):not(.ff-v26-sticky-action-col) .dx-checkbox-indeterminate .dx-checkbox-icon::before { color: var(--primary, #2f77f3) !important; font-size: calc(var(--ff-v26-data-check-size-final, var(--ff-standard-grid-check-size, 16px)) - 2px) !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Absolute-last v26 frozen edge divider. Keep the final fixed key column visibly separated while horizontal scrolling. */ html body.ff-app.ff-app.ff-app :is(.ff-view-waybills.ff-standard-grid-page, .ff-view-payments.ff-query-grid-page, .ff-view-payments.ff-standard-grid-page) :is(#gridContainer#gridContainer, #waybillGridContainer#waybillGridContainer).ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-waybill-key-col, .ff-v26-sticky-key-col), html body.ff-app.ff-app.ff-app .ff-v26-grid-blueprint.ff-v26-grid-blueprint.ff-standard-grid-page.ff-standard-grid-page :is(#gridContainer#gridContainer, #gridContainer1#gridContainer1, #gridContainer2#gridContainer2, #waybillGridContainer#waybillGridContainer).ff-standard-grid.ff-standard-grid :is(.dx-datagrid-headers, .dx-datagrid-filter-row, .dx-datagrid-rowsview, .dx-datagrid-total-footer) :is(td, th):is(.ff-v26-sticky-key2-col, .ff-v26-sticky-id-col) { border-right: 2px solid var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; box-shadow: inset -2px 0 0 var(--ff-v26-sticky-grid-line, var(--ff-tariffs-grid-line, var(--ff-crdr-sticky-grid-line, var(--ff-invoice-sticky-border, var(--border, #d9dde5))))) !important; } /* View Waybills: keep the heavier frozen-edge divider out of the totals strip. */ html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer :is(td, th):is(.ff-waybill-key-col, .ff-v26-sticky-key-col, .ff-v26-sticky-key2-col, .ff-v26-sticky-id-col), html body.ff-app.ff-app.ff-app .ff-view-waybills.ff-standard-grid-page.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid .dx-datagrid-total-footer .dx-datagrid-content-fixed :is(.dx-datagrid-table, .dx-datagrid-table-fixed, table) > tbody > tr > :is(td, th) { border-right: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; box-shadow: none !important; } /* Absolute-last invoice detail mode guard. The summary and detail toolbars can briefly coexist while the invoice waybill grid is rebuilt, so hide the summary controls from the explicit detail state instead of trusting the older toggle flags alone. */ html body.ff-app.ff-app.ff-app.ff-invoice-detail-active .ff-view-invoices.ff-view-invoices :is(.ff-invoice-summary-toolbar, .ff-invoice-summary-grid-row), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-invoice-detail-active :is(.ff-invoice-summary-toolbar, .ff-invoice-summary-grid-row), html body.ff-app.ff-app.ff-app.ff-invoice-detail-active .ff-view-invoices.ff-view-invoices > .container-fullw > .ff-grid-toolbar-row:has(#showvalueonly), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-invoice-detail-active > .container-fullw > .ff-grid-toolbar-row:has(#showvalueonly), html body.ff-app.ff-app.ff-app.ff-invoice-detail-active .ff-view-invoices.ff-view-invoices > .container-fullw > .ff-grid-result-row:has(#clientGridContainer), html body.ff-app.ff-app.ff-app .ff-view-invoices.ff-view-invoices.ff-invoice-detail-active > .container-fullw > .ff-grid-result-row:has(#clientGridContainer) { display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; pointer-events: none !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app.ff-invoice-detail-loading::before { background: rgba(255, 255, 255, 0.58) !important; bottom: 0 !important; content: "" !important; display: block !important; left: 0 !important; opacity: 1 !important; pointer-events: auto !important; position: fixed !important; right: 0 !important; top: 0 !important; visibility: visible !important; z-index: 100000 !important; } html body.ff-app.ff-app.ff-app.ff-invoice-detail-loading::after { animation: load1 1.1s infinite linear !important; background: transparent !important; border-bottom: 4px solid var(--text-muted, #7b8794) !important; border-left: 4px solid var(--primary, #2f77f3) !important; border-radius: 50% !important; border-right: 4px solid var(--text-muted, #7b8794) !important; border-top: 4px solid var(--text-muted, #7b8794) !important; box-sizing: border-box !important; content: "" !important; display: block !important; height: 56px !important; left: 50% !important; margin: -28px 0 0 -28px !important; opacity: 1 !important; pointer-events: none !important; position: fixed !important; top: 50% !important; transform-origin: center !important; visibility: visible !important; width: 56px !important; z-index: 100001 !important; } /* Generate Invoice detail row actions. The detail grid now uses row click for opening and keeps print/image/copy as compact explicit actions in the first column. */ html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid :is(td.ff-invoice-generate-waybill-action-col, th.ff-invoice-generate-waybill-action-col, .ff-invoice-generate-waybill-action-col) { max-width: 78px !important; min-width: 78px !important; overflow: visible !important; width: 78px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-invoice-generate-waybill-action-col, .ff-invoice-generate-command-col, .dx-command-edit) .ff-invoice-generate-row-action-buttons { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 2px !important; height: 22px !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-invoice-generate-waybill-action-col, .ff-invoice-generate-command-col, .dx-command-edit) .ff-grid-row-action-button { align-items: center !important; background: transparent !important; border: 0 !important; color: var(--ff-primary, var(--primary, #367bf5)) !important; display: inline-flex !important; flex: 0 0 22px !important; height: 22px !important; justify-content: center !important; line-height: 20px !important; max-height: 22px !important; max-width: 22px !important; min-height: 22px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; width: 22px !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page #waybillGridContainer#waybillGridContainer.ff-standard-grid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-invoice-generate-waybill-action-col, .ff-invoice-generate-command-col, .dx-command-edit) .ff-grid-row-action-button[disabled] { color: var(--ff-grid-muted, #9aa5b1) !important; cursor: default !important; opacity: 0.45 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page .ff-invoice-generate-selected-row, html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page .ff-invoice-generate-waybill-grid { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-generate-invoice.ff-standard-grid-page .ff-invoice-generate-selected-inner { min-height: 0 !important; padding-bottom: 2px !important; padding-top: 2px !important; } /* Final drilldown action-cell guard for migrated row-click grids. Older page-specific rules still pin command cells to eye/ellipsis widths. */ html body.ff-app.ff-app.ff-app .ff-generate-manifest.ff-generate-manifest #gridContainer#gridContainer { --ff-generate-manifest-action-cell-width: 54px !important; --ff-generate-manifest-action-button-size: 18px !important; --ff-generate-manifest-action-buttons-width: 40px !important; --ff-generate-manifest-command-column-width: var(--ff-generate-manifest-action-cell-width) !important; --ff-grid-command-column-width: var(--ff-generate-manifest-action-cell-width) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer :is(td, th, .ff-manifest-waybill-action-col).ff-manifest-waybill-action-col { max-width: var(--ff-generate-manifest-action-cell-width, 54px) !important; min-width: var(--ff-generate-manifest-action-cell-width, 54px) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; text-overflow: clip !important; width: var(--ff-generate-manifest-action-cell-width, 54px) !important; } html body.ff-app.ff-app.ff-app :is(.ff-view-manifests-simple, .ff-view-manifests) #gridContainer#gridContainer :is(td, th, .ff-manifest-waybill-action-col).ff-manifest-waybill-action-col, html body.ff-app.ff-app.ff-app .ff-consolidation #gridContainer#gridContainer :is(td, th, .ff-cons-waybill-action-col).ff-cons-waybill-action-col { max-width: 54px !important; min-width: 54px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 54px !important; } html body.ff-app.ff-app.ff-app .ff-view-manifest-routes #gridContainer#gridContainer :is(td, th, .ff-manifest-route-action-col).ff-manifest-route-action-col { max-width: 76px !important; min-width: 76px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 76px !important; } html body.ff-app.ff-app.ff-app .ff-debtors #gridContainer#gridContainer.ff-debtors-detail-grid :is(td, th, .ff-debtors-detail-command-col).ff-debtors-detail-command-col { max-width: 144px !important; min-width: 144px !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: 144px !important; } html body.ff-app.ff-app.ff-app :is(.ff-generate-manifest, .ff-view-manifest-routes, .ff-view-manifests-simple, .ff-view-manifests, .ff-consolidation, .ff-debtors) #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-waybill-action-col, .ff-manifest-route-action-col, .ff-cons-waybill-action-col, .ff-debtors-detail-command-col, .dx-command-edit) .ff-grid-row-action-buttons { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 2px !important; height: 22px !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: 22px !important; min-height: 22px !important; overflow: visible !important; padding: 0 !important; vertical-align: middle !important; width: auto !important; } html body.ff-app.ff-app.ff-app :is(.ff-generate-manifest, .ff-view-manifest-routes, .ff-view-manifests-simple, .ff-view-manifests, .ff-consolidation, .ff-debtors) #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-waybill-action-col, .ff-manifest-route-action-col, .ff-cons-waybill-action-col, .ff-debtors-detail-command-col, .dx-command-edit) .ff-grid-row-action-button { align-items: center !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--ff-primary, var(--primary, #367bf5)) !important; display: inline-flex !important; flex: 0 0 22px !important; font-size: 13px !important; height: 22px !important; justify-content: center !important; line-height: 20px !important; margin: 0 !important; max-height: 22px !important; max-width: 22px !important; min-height: 22px !important; min-width: 22px !important; overflow: visible !important; padding: 0 !important; width: 22px !important; } html body.ff-app.ff-app.ff-app :is(.ff-generate-manifest, .ff-view-manifest-routes, .ff-view-manifests-simple, .ff-view-manifests, .ff-consolidation, .ff-debtors) #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-waybill-action-col, .ff-manifest-route-action-col, .ff-cons-waybill-action-col, .ff-debtors-detail-command-col, .dx-command-edit) .ff-grid-row-action-button :is(.fa, .dx-icon) { color: inherit !important; font-size: 13px !important; height: 16px !important; line-height: 16px !important; margin: 0 !important; max-height: 16px !important; min-height: 0 !important; padding: 0 !important; width: auto !important; } html body.ff-app.ff-app.ff-app :is(.ff-generate-manifest, .ff-view-manifest-routes, .ff-view-manifests-simple, .ff-view-manifests, .ff-consolidation, .ff-debtors) #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-manifest-waybill-action-col, .ff-manifest-route-action-col, .ff-cons-waybill-action-col, .ff-debtors-detail-command-col, .dx-command-edit) .ff-grid-row-action-button[disabled] { color: var(--ff-grid-muted, #9aa5b1) !important; cursor: default !important; opacity: 0.45 !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col > :is(.dx-template-wrapper, .ff-grid-row-action-buttons), html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-buttons.ff-manifest-row-actions { align-items: center !important; display: inline-flex !important; flex-wrap: nowrap !important; gap: 4px !important; height: 22px !important; justify-content: center !important; left: auto !important; line-height: 1 !important; margin: 0 auto !important; max-height: 22px !important; max-width: var(--ff-generate-manifest-action-buttons-width, 40px) !important; min-height: 22px !important; min-width: var(--ff-generate-manifest-action-buttons-width, 40px) !important; overflow: visible !important; padding: 0 !important; position: static !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-generate-manifest-action-buttons-width, 40px) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col > .dx-template-wrapper { display: flex !important; height: 100% !important; max-width: 100% !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-button { align-items: center !important; appearance: none !important; background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--primary, var(--ff-primary, #367bf5)) !important; cursor: pointer !important; display: inline-flex !important; flex: 0 0 var(--ff-generate-manifest-action-button-size, 18px) !important; font-size: 0 !important; height: var(--ff-generate-manifest-action-button-size, 18px) !important; justify-content: center !important; line-height: 1 !important; margin: 0 !important; max-height: var(--ff-generate-manifest-action-button-size, 18px) !important; max-width: var(--ff-generate-manifest-action-button-size, 18px) !important; min-height: var(--ff-generate-manifest-action-button-size, 18px) !important; min-width: var(--ff-generate-manifest-action-button-size, 18px) !important; overflow: visible !important; padding: 0 !important; position: static !important; text-decoration: none !important; transform: none !important; width: var(--ff-generate-manifest-action-button-size, 18px) !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-button::before, html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-button::after { content: none !important; display: none !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-button :is(.fa, .dx-icon) { color: var(--primary, var(--ff-primary, #367bf5)) !important; display: block !important; font-family: FontAwesome !important; font-size: 14px !important; height: 14px !important; line-height: 14px !important; margin: 0 !important; max-height: 14px !important; max-width: 14px !important; min-height: 14px !important; min-width: 14px !important; overflow: visible !important; padding: 0 !important; text-align: center !important; width: 14px !important; } html body.ff-app.ff-app.ff-app .ff-generate-manifest #gridContainer#gridContainer .dx-datagrid-rowsview .dx-data-row > :is(td, th).ff-manifest-waybill-action-col .ff-grid-row-action-button[disabled] { color: var(--ff-grid-muted, #9aa5b1) !important; cursor: default !important; opacity: 0.45 !important; } /* Absolute-final shared boolean checkbox cell lock. The shared renderer marks data boolean cells so older page-specific text-cell alignment and 14px checkbox rules cannot leave read-only flags tiny or left. */ html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) { --ff-grid-data-checkbox-size-final: 18px !important; box-sizing: border-box !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) > .ff-grid-boolean-checkbox { align-items: center !important; box-sizing: border-box !important; display: flex !important; height: 100% !important; justify-content: center !important; line-height: 1 !important; margin: 0 auto !important; max-height: none !important; min-height: var(--ff-grid-data-checkbox-size-final, 18px) !important; overflow: visible !important; padding: 0 !important; text-align: center !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) .ff-grid-boolean-checkbox :is(.dx-checkbox, .dx-checkbox-container, .dx-checkbox-wrapper, .dx-select-checkbox, .dx-checkbox-icon, input[type="checkbox"]) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: var(--ff-grid-data-checkbox-size-final, 18px) !important; justify-content: center !important; left: auto !important; line-height: var(--ff-grid-data-checkbox-size-final, 18px) !important; margin: 0 auto !important; max-height: var(--ff-grid-data-checkbox-size-final, 18px) !important; max-width: var(--ff-grid-data-checkbox-size-final, 18px) !important; min-height: var(--ff-grid-data-checkbox-size-final, 18px) !important; min-width: var(--ff-grid-data-checkbox-size-final, 18px) !important; overflow: visible !important; padding: 0 !important; position: static !important; text-align: center !important; top: auto !important; transform: none !important; vertical-align: middle !important; width: var(--ff-grid-data-checkbox-size-final, 18px) !important; } html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) .ff-grid-boolean-checkbox .dx-checkbox-icon { background-color: var(--ff-input-bg, var(--input-bg, var(--surface, #fff))) !important; border: 1px solid var(--ff-border, var(--border, #9aa4b2)) !important; border-radius: 3px !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-checked .dx-checkbox-icon::before, html body.ff-app.ff-app.ff-app .ff-page .dx-datagrid .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-grid-boolean-cell, .ff-grid-boolean-col) .ff-grid-boolean-checkbox .dx-checkbox.dx-checkbox-indeterminate .dx-checkbox-icon::before { color: var(--primary, #2f77f3) !important; font-size: 14px !important; left: 50% !important; line-height: 1 !important; margin: 0 !important; position: absolute !important; top: 50% !important; transform: translate(-50%, -50%) !important; } /* Final capture text-selection contrast. Keep selected search text visible while typing in sender, receiver, origin, destination, service, and similar ui-select capture fields. */ html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(.ui-select-search, .ui-select-match-text, .ui-select-match-text *) { -ms-user-select: text !important; -webkit-user-select: text !important; user-select: text !important; } html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(input, textarea, .ui-select-search, .ui-select-match-text)::selection { background: var(--primary, #2f77f3) !important; color: #fff !important; -webkit-text-fill-color: #fff !important; } html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(input, textarea, .ui-select-search, .ui-select-match-text)::-moz-selection { background: var(--primary, #2f77f3) !important; color: #fff !important; } /* Capture ui-select open guard. ui-select briefly swaps the selected match button for the search input while opening. Keep the real control painted without overlaying text on top of the editable sender/receiver fields. */ html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(ui-select, .ui-select-container, .ui-select-bootstrap).open { background-color: var(--ff-input-bg, var(--input-bg, var(--surface, #fff))) !important; border-radius: 4px !important; box-sizing: border-box !important; min-height: var(--ff-control-h, 30px) !important; min-width: 0 !important; overflow: visible !important; position: relative !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(ui-select, .ui-select-container, .ui-select-bootstrap).open .ui-select-search:not(.ng-hide) { background-color: var(--ff-input-bg, var(--input-bg, var(--surface, #fff))) !important; box-sizing: border-box !important; caret-color: var(--text, #1f1f1f) !important; color: var(--text, #1f1f1f) !important; display: block !important; opacity: 1 !important; visibility: visible !important; -webkit-text-fill-color: var(--text, #1f1f1f) !important; width: 100% !important; } html body.ff-app.ff-app.ff-app :is(.ff-capture-page, .ff-stages-capture) :is(ui-select, .ui-select-container, .ui-select-bootstrap).open :is(.ui-select-match.ng-hide, ui-select-match.ng-hide) { display: block !important; height: var(--ff-control-h, 30px) !important; left: 0 !important; min-height: var(--ff-control-h, 30px) !important; opacity: 0 !important; pointer-events: none !important; position: absolute !important; right: 0 !important; top: 0 !important; visibility: hidden !important; width: 100% !important; z-index: 0 !important; } /* Absolute-final View Images viewport fit. The controller writes --ff-image-standard-rows-height-measured after rows bind; this fallback keeps first paint close while preserving page-level overflow. */ html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-effective-rows-height: var(--ff-image-standard-rows-height-measured, var(--ff-standard-grid-rows-max-height)) !important; --ff-standard-grid-rows-max-height: clamp(420px, calc(100dvh - 190px), 1180px) !important; } html body.ff-app.ff-app.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page, html body.ff-app.ff-app.ff-app:is([data-grid-density="compact"], .ff-grid-density-compact, [data-grid-font-size="small"]) .ff-imaging-list.ff-imaging-list.ff-standard-grid-page.ff-image-standard-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--images.ff-standard-grid-css-owned { --ff-standard-grid-rows-max-height: clamp(420px, calc(100dvh - 172px), 1180px) !important; } html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-image-results-visible .ff-grid-toolbar-row, html body.ff-app.ff-app.ff-app .ff-imaging-list.ff-imaging-list.ff-image-results-visible .ff-grid-toolbar-row > .ff-grid-toolbar-inner { margin-bottom: 0 !important; margin-top: 0 !important; min-height: 24px !important; padding-bottom: 0 !important; padding-top: 0 !important; } /* Absolute-final Town Master v26 grid fit and alignment. Keep this late so it wins over generic master-grid and v26 sticky rules. */ html body.ff-app.ff-app.ff-app .ff-town-master.ff-v26-grid-blueprint { --ff-town-action-column-width: 40px !important; --ff-town-key-column-width: 220px !important; --ff-v26-sticky-action-left: var(--ff-v26-sticky-select-width, 30px) !important; --ff-v26-sticky-action-width: var(--ff-town-action-column-width) !important; --ff-v26-sticky-key-left: calc(var(--ff-v26-sticky-select-width, 30px) + var(--ff-town-action-column-width)) !important; --ff-v26-sticky-key-width: var(--ff-town-key-column-width) !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-panel { margin-bottom: 4px !important; padding: 4px 8px 6px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-legend { align-items: center !important; display: inline-flex !important; gap: 6px !important; margin-bottom: 4px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-title-clear { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; min-height: 24px !important; min-width: 24px !important; padding: 0 !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-primary-row, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-secondary-row { align-items: flex-end !important; display: flex !important; flex-wrap: wrap !important; gap: 6px 8px !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-primary-row > [class*="col-"], html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-secondary-row > [class*="col-"] { float: none !important; min-width: 0 !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-panel label { margin-bottom: 2px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-panel :is(.form-control, .ui-select-container) { min-height: 28px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-town-field { flex: 0 1 260px !important; max-width: 260px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-postal-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-ring-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-zone-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-international-field { flex: 0 0 126px !important; max-width: 126px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-hub-field { flex: 0 1 240px !important; max-width: 240px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-main-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-regional-field { flex: 0 0 122px !important; max-width: 122px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-actions { align-items: center !important; display: flex !important; flex: 1 1 320px !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-keep-open { align-items: center !important; display: inline-flex !important; height: 30px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-keep-open .checkbox { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-close-filter { align-items: center !important; display: inline-flex !important; height: 30px !important; justify-content: center !important; min-width: 30px !important; padding-left: 0 !important; padding-right: 0 !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-search { height: 30px !important; min-width: 120px !important; } @media (max-width: 991px) { html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-town-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-hub-field { flex: 1 1 220px !important; max-width: none !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-postal-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-ring-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-zone-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-international-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-main-field, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-regional-field { flex: 1 1 126px !important; max-width: none !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-actions { flex: 1 1 100% !important; justify-content: flex-end !important; margin-left: 0 !important; } } @media (max-width: 520px) { html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-primary-row, html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-secondary-row { gap: 6px !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-panel :is(.ff-town-filter-town-field, .ff-town-filter-postal-field, .ff-town-filter-hub-field, .ff-town-filter-main-field, .ff-town-filter-regional-field, .ff-town-filter-international-field, .ff-town-filter-ring-field, .ff-town-filter-zone-field) { flex: 1 1 100% !important; max-width: none !important; } html body.ff-app.ff-app.ff-app .ff-town-master .ff-town-filter-actions { flex-wrap: wrap !important; justify-content: flex-start !important; } } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-panel { margin-bottom: 4px !important; padding: 4px 8px 6px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master #hubMasterGrid.ff-master-single-grid { min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-legend { align-items: center !important; display: inline-flex !important; gap: 6px !important; margin-bottom: 4px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-title-clear { align-items: center !important; display: inline-flex !important; height: 24px !important; justify-content: center !important; min-height: 24px !important; min-width: 24px !important; padding: 0 !important; width: 24px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-row { align-items: flex-end !important; display: flex !important; flex-wrap: wrap !important; gap: 6px 8px !important; margin-left: 0 !important; margin-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-row > [class*="col-"] { float: none !important; padding-left: 0 !important; padding-right: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-panel .form-group { margin-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-panel label { margin-bottom: 2px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-panel .form-control { min-height: 28px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-id-field, html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-code-field, html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-account-field, html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-cost-field { flex: 0 0 126px !important; max-width: 126px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-name-field { flex: 0 1 260px !important; max-width: 260px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-actions { align-items: center !important; display: flex !important; flex: 1 1 320px !important; gap: 8px !important; justify-content: flex-end !important; margin-left: auto !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-keep-open { align-items: center !important; display: inline-flex !important; height: 30px !important; margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-keep-open .checkbox { margin: 0 !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-close-filter { align-items: center !important; display: inline-flex !important; height: 30px !important; justify-content: center !important; min-width: 30px !important; padding-left: 0 !important; padding-right: 0 !important; width: 30px !important; } html body.ff-app.ff-app.ff-app .ff-hub-master .ff-hub-filter-search { height: 30px !important; min-width: 120px !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-standard-grid :is(td, th):is(.ff-town-command-col, .ff-v26-sticky-action-col, .dx-command-edit) { box-sizing: border-box !important; max-width: var(--ff-town-action-column-width, 40px) !important; min-width: var(--ff-town-action-column-width, 40px) !important; overflow: visible !important; padding-left: 0 !important; padding-right: 0 !important; text-align: center !important; width: var(--ff-town-action-column-width, 40px) !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-standard-grid .ff-town-row-action-buttons { align-items: center !important; display: flex !important; justify-content: center !important; margin: 0 auto !important; max-width: none !important; min-width: 0 !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-standard-grid .ff-town-row-map-button { margin: 0 auto !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-scrollable-content, html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content:not(.dx-datagrid-content-fixed), html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-v26-single-table-sticky-grid :is(.dx-datagrid-headers, .dx-datagrid-rowsview) .dx-datagrid-content:not(.dx-datagrid-content-fixed) :is(.dx-datagrid-table, table) { max-width: none !important; min-width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; width: var(--ff-v26-standard-grid-horizontal-width, 100%) !important; } html body.ff-app.ff-app.ff-app .ff-town-master #townMasterGrid#townMasterGrid.ff-v26-single-table-sticky-grid .dx-datagrid-rowsview .dx-datagrid-content:not(.dx-datagrid-content-fixed) .dx-datagrid-table > tbody > tr.dx-data-row > :is(td, th) { border-bottom: 1px solid var(--ff-v26-sticky-grid-line, var(--border, #d9dde5)) !important; } /* Absolute-final Query viewport, selector and pager fit. Query keeps native row scrolling, but the controller now writes the measured rows viewport into these variables so the page does not leave a blank band below the grid. */ html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-query-selector-size-final: 14px !important; --ff-standard-grid-check-size: var(--ff-query-selector-size-final) !important; --ff-standard-grid-effective-rows-height: var(--ff-query-standard-rows-height-measured, var(--ff-standard-grid-rows-max-height)) !important; --ff-standard-grid-min-rows-height: 300px !important; --ff-standard-grid-pager-height: 30px !important; --ff-standard-grid-row-height: 18px !important; --ff-standard-grid-rows-max-height: clamp(420px, calc(100dvh - 254px), 1180px) !important; --ff-standard-grid-total-footer-height: 24px !important; } html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page, html body.ff-app.ff-app.ff-app:not([data-grid-density="compact"]):not(.ff-grid-density-compact) .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned { --ff-standard-grid-min-rows-height: 340px !important; --ff-standard-grid-rows-max-height: clamp(420px, calc(100dvh - 274px), 1180px) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page .ff-grid-result-row, html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page .ff-grid-result-row > [class*="col-"] { margin-bottom: 0 !important; padding-bottom: 0 !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid, .dx-gridbase-container) { display: flex !important; flex-direction: column !important; min-height: calc( var(--ff-standard-grid-effective-rows-height) + var(--ff-standard-grid-header-height, 24px) + var(--ff-standard-grid-filter-height, 0px) + var(--ff-standard-grid-total-footer-height, 24px) + var(--ff-standard-grid-pager-height, 30px) ) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview { flex: 0 0 var(--ff-standard-grid-effective-rows-height) !important; height: var(--ff-standard-grid-effective-rows-height) !important; max-height: var(--ff-standard-grid-effective-rows-height) !important; min-height: var(--ff-standard-grid-effective-rows-height) !important; overflow: hidden !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview :is(.dx-datagrid-content, .dx-scrollable, .dx-scrollable-wrapper, .dx-scrollable-container) { height: 100% !important; max-height: 100% !important; min-height: 0 !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-scrollable-container { overflow-x: auto !important; overflow-y: auto !important; scrollbar-gutter: stable !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) { align-items: center !important; box-sizing: border-box !important; height: var(--ff-standard-grid-row-height, 18px) !important; line-height: var(--ff-standard-grid-row-height, 18px) !important; max-height: var(--ff-standard-grid-row-height, 18px) !important; min-height: var(--ff-standard-grid-row-height, 18px) !important; overflow: visible !important; padding: 0 !important; text-align: center !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper { align-items: center !important; display: flex !important; height: 100% !important; justify-content: center !important; line-height: var(--ff-standard-grid-row-height, 18px) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox), html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-datagrid-rowsview .dx-data-row > :is(td, th):is(.ff-query-select-col, .ff-v26-sticky-select-col, .dx-command-select) > .dx-template-wrapper > :is(.ff-v26-native-select-checkbox, input[type="checkbox"].ff-v26-native-select-checkbox) { height: var(--ff-query-selector-size-final) !important; line-height: var(--ff-query-selector-size-final) !important; margin: 0 auto !important; max-height: var(--ff-query-selector-size-final) !important; max-width: var(--ff-query-selector-size-final) !important; min-height: var(--ff-query-selector-size-final) !important; min-width: var(--ff-query-selector-size-final) !important; position: relative !important; top: -2px !important; transform: none !important; vertical-align: middle !important; width: var(--ff-query-selector-size-final) !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned :is(.dx-datagrid-pager.dx-pager, .dx-pager) { align-items: center !important; box-sizing: border-box !important; display: flex !important; flex: 0 0 var(--ff-standard-grid-pager-height, 30px) !important; flex-wrap: nowrap !important; gap: 4px !important; height: var(--ff-standard-grid-pager-height, 30px) !important; justify-content: flex-end !important; line-height: 24px !important; margin: 0 !important; max-height: var(--ff-standard-grid-pager-height, 30px) !important; min-height: var(--ff-standard-grid-pager-height, 30px) !important; overflow: visible !important; padding: 2px 10px !important; position: relative !important; top: auto !important; transform: none !important; width: 100% !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-pager :is(.dx-page-sizes, .dx-pages, .dx-info) { align-items: center !important; align-self: center !important; display: inline-flex !important; float: none !important; height: 24px !important; line-height: 24px !important; margin-bottom: 0 !important; margin-top: 0 !important; max-height: 24px !important; min-height: 24px !important; overflow: visible !important; padding-bottom: 0 !important; padding-top: 0 !important; position: static !important; transform: none !important; white-space: nowrap !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-pager .dx-page-sizes { gap: 2px !important; margin-left: auto !important; margin-right: 8px !important; order: 1 !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-pager .dx-pages { gap: 2px !important; justify-content: center !important; order: 2 !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-pager :is(.dx-page, .dx-page-size, .dx-navigate-button) { align-items: center !important; box-sizing: border-box !important; display: inline-flex !important; height: 22px !important; justify-content: center !important; line-height: 22px !important; margin: 0 !important; max-height: 22px !important; min-height: 22px !important; min-width: 20px !important; overflow: visible !important; padding: 0 4px !important; position: static !important; text-align: center !important; top: auto !important; transform: none !important; vertical-align: middle !important; } html body.ff-app.ff-app.ff-app .ff-query.ff-view-query.ff-standard-grid-page #gridContainer#gridContainer.ff-standard-grid.ff-standard-grid--queries.ff-standard-grid-css-owned .dx-pager :is(.dx-page.dx-selection, .dx-page-size.dx-selection) { height: 20px !important; line-height: 20px !important; min-height: 20px !important; padding: 0 7px !important; } /* Absolute-final toolbar checkbox busy state. Values Only and similar column-visibility toggles can take a moment while the grid rebuilds columns, so show a lightweight wait state after the checkbox paint and before the heavy work starts. */ @keyframes ff-grid-toolbar-busy-spin { from { transform: translate(-50%, -50%) rotate(0deg); } to { transform: translate(-50%, -50%) rotate(360deg); } } html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-toolbar-busy, html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer).ff-standard-grid.ff-grid-toolbar-busy { cursor: progress !important; position: relative !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-toolbar-busy::before, html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer).ff-standard-grid.ff-grid-toolbar-busy::before { background: rgba(255, 255, 255, 0.58) !important; background: color-mix(in srgb, var(--surface, #fff) 68%, transparent) !important; content: "" !important; display: block !important; inset: 0 !important; opacity: 1 !important; pointer-events: auto !important; position: absolute !important; visibility: visible !important; z-index: 120 !important; } html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-standard-grid-page .ff-standard-grid.ff-grid-toolbar-busy::before, html body.ff-app.ff-app.ff-app[data-theme="dark"] .ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer).ff-standard-grid.ff-grid-toolbar-busy::before { background: rgba(15, 17, 21, 0.62) !important; background: color-mix(in srgb, var(--surface, #151821) 70%, transparent) !important; } html body.ff-app.ff-app.ff-app .ff-standard-grid-page .ff-standard-grid.ff-grid-toolbar-busy::after, html body.ff-app.ff-app.ff-app .ff-standard-grid-page :is(#gridContainer, #gridContainer1, #gridContainer2, #gridContainer3, #clientGridContainer, #waybillGridContainer, #errorContainer, #integrationContainer).ff-standard-grid.ff-grid-toolbar-busy::after { animation: ff-grid-toolbar-busy-spin 0.75s linear infinite !important; background: transparent !important; border: 3px solid rgba(47, 119, 243, 0.24) !important; border-radius: 999px !important; border-top-color: var(--primary, #2f77f3) !important; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.16) !important; box-sizing: border-box !important; content: "" !important; display: block !important; height: 28px !important; left: 50% !important; margin: 0 !important; opacity: 1 !important; pointer-events: none !important; position: absolute !important; top: 50% !important; visibility: visible !important; width: 28px !important; z-index: 121 !important; } /* Password change confirmation feedback. */ .swal2-popup #ff-confirm-password.ff-password-confirm-mismatch { border-color: #d9534f !important; box-shadow: 0 0 0 1px rgba(217, 83, 79, 0.45) !important; } .swal2-popup .ff-password-confirm-warning { color: #d9534f !important; display: none !important; font-size: 12px !important; line-height: 16px !important; margin: -6px auto 0 !important; max-width: 20em !important; text-align: left !important; } .swal2-popup .ff-password-confirm-warning.ff-password-confirm-warning--visible { display: block !important; } /* Waybill capture ui-select: do not show an empty dropdown shell when no rows match. */ html body.ff-app.ff-app.ff-app .ff-waybill :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) .ui-select-no-choice:empty { border: 0 !important; box-shadow: none !important; display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; opacity: 0 !important; padding: 0 !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-waybill :is(.ui-select-container.open, .ui-select-bootstrap.open, ui-select.open) .ui-select-choices:not(:has(.ui-select-choices-row)) { border: 0 !important; box-shadow: none !important; display: none !important; height: 0 !important; margin: 0 !important; min-height: 0 !important; opacity: 0 !important; padding: 0 !important; visibility: hidden !important; } html body.ff-app.ff-app.ff-app .ff-waybill .ff-capture-ui-select-empty-dropdown .ui-select-no-choice, html body.ff-app.ff-app.ff-app .ff-waybill .ff-capture-ui-select-empty-dropdown .ui-select-choices, html body.ff-app.ff-app.ff-app .ff-waybill .ff-capture-ui-select-empty-dropdown .ui-select-dropdown { border: 0 !important; box-shadow: none !important; display: none !important; height: 0 !important; margin: 0 !important; max-height: 0 !important; min-height: 0 !important; opacity: 0 !important; overflow: hidden !important; padding: 0 !important; visibility: hidden !important; } /* Supplier invoice capture/import. */ .ff-supplier-invoice .ff-supplier-invoice-body { padding: 10px 14px 12px !important; } .ff-supplier-invoice .ff-si-section { background: var(--ff-surface, #fff); border: 1px solid var(--ff-border, #d8e0ea); border-radius: 8px; box-shadow: var(--ff-shadow-sm, 0 1px 2px rgba(0, 0, 0, 0.06)); margin: 0 0 8px; padding: 18px 14px 12px; position: relative; } .ff-supplier-invoice .ff-si-section-title { background: var(--ff-surface, #fff); border: 1px solid var(--ff-border, #d8e0ea); border-radius: 18px; color: var(--ff-muted, #606a78); font-size: 14px; font-weight: 800; left: 18px; letter-spacing: 1.8px; line-height: 20px; padding: 1px 12px; position: absolute; text-transform: uppercase; top: -12px; } .ff-supplier-invoice .ff-si-form-grid { align-items: end; display: grid; gap: 8px 10px; } .ff-supplier-invoice .ff-si-header-grid { grid-template-columns: minmax(280px, 2.2fr) 130px 128px 160px minmax(170px, 1fr) 188px 128px minmax(220px, 1.5fr); } .ff-supplier-invoice .ff-si-bulk-grid { grid-template-columns: 140px 170px 140px 130px 130px 88px minmax(260px, 1fr) 96px; } .ff-supplier-invoice .ff-si-field { min-width: 0; } .ff-supplier-invoice .ff-si-field label { color: var(--ff-text, #222); display: block; font-size: 13px; font-weight: 800; line-height: 16px; margin: 0 0 2px; } .ff-supplier-invoice .ff-si-field .form-control, .ff-supplier-invoice .ff-si-file-btn { height: 32px !important; min-height: 32px !important; } .ff-supplier-invoice .ff-si-comment, .ff-supplier-invoice .ff-si-paste-field { min-width: 0; } .ff-supplier-invoice .ff-si-paste-field textarea.form-control { height: 54px !important; min-height: 54px !important; resize: vertical; } .ff-supplier-invoice .ff-si-inline-action { display: grid; grid-template-columns: 1fr 38px; } .ff-supplier-invoice .ff-si-inline-action .form-control { border-bottom-right-radius: 0 !important; border-top-right-radius: 0 !important; } .ff-supplier-invoice .ff-si-inline-action .btn, .ff-supplier-invoice .ff-si-bulk-add .btn { height: 32px !important; line-height: 18px !important; min-height: 32px !important; } .ff-supplier-invoice .ff-si-inline-action .btn { border-bottom-left-radius: 0 !important; border-top-left-radius: 0 !important; padding: 5px 0 !important; } .ff-supplier-invoice .ff-si-bulk-add .btn { width: 100%; } .ff-supplier-invoice .ff-si-file-input { height: 0.1px; opacity: 0; overflow: hidden; position: absolute; width: 0.1px; z-index: -1; } .ff-supplier-invoice .ff-si-file-btn { align-items: center; display: flex; gap: 6px; justify-content: center; margin: 0; padding: 5px 10px !important; width: 100%; } .ff-supplier-invoice .ff-si-summary-row { align-items: center; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; } .ff-supplier-invoice .ff-si-pill, .ff-supplier-invoice .ff-si-total { align-items: center; border-radius: 6px; display: inline-flex; min-height: 32px; } .ff-supplier-invoice .ff-si-pill { background: var(--ff-primary, #3478f6); color: #fff; font-size: 14px; font-weight: 800; padding: 4px 12px; } .ff-supplier-invoice .ff-si-total { background: var(--ff-surface-2, #f2f5f8); border: 1px solid var(--ff-border, #d8e0ea); color: var(--ff-text, #222); gap: 8px; padding: 3px 10px; } .ff-supplier-invoice .ff-si-total span { color: var(--ff-muted, #606a78); font-size: 12px; font-weight: 700; text-transform: uppercase; } .ff-supplier-invoice .ff-si-total strong { font-size: 14px; } .ff-supplier-invoice .ff-si-grid-shell { border: 1px solid var(--ff-border, #d8e0ea); border-radius: 6px; overflow: hidden; } .ff-supplier-invoice .ff-supplier-invoice-grid { height: calc(100vh - 392px); min-height: 300px; } .ff-supplier-invoice .ff-supplier-invoice-grid .dx-datagrid-headers .dx-header-row > td, .ff-supplier-invoice .ff-supplier-invoice-grid .dx-datagrid-rowsview .dx-row > td { white-space: nowrap; } .ff-supplier-invoice .ff-enquiry-input::placeholder { color: #b8b8b8; } @media (max-width: 1500px) { .ff-supplier-invoice .ff-si-header-grid { grid-template-columns: minmax(260px, 2fr) 120px 124px 140px minmax(150px, 1fr) 170px 124px minmax(180px, 1.2fr); } .ff-supplier-invoice .ff-si-bulk-grid { grid-template-columns: 128px 150px 128px 122px 122px 78px minmax(230px, 1fr) 88px; } } @media (max-width: 1180px) { .ff-supplier-invoice .ff-si-header-grid, .ff-supplier-invoice .ff-si-bulk-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ff-supplier-invoice .ff-supplier-invoice-grid { height: 58vh; } }