/* Scoped to small layouts. Desktop ExtJS styling remains the baseline. */
#acp-responsive-navigation {
    display: none; position: fixed; left: 12px; bottom: 12px;
    bottom: max(12px, env(safe-area-inset-bottom)); z-index: 8000;
    min-height: 44px; padding: 8px 18px; border: 1px solid #365c88;
    border-radius: 6px; color: #fff; background: #365c88; font: bold 16px Arial, sans-serif;
    box-shadow: 0 2px 6px rgba(0,0,0,.2); cursor: pointer;
}
#acp-responsive-navigation:focus {outline: 3px solid #e6a900; outline-offset: 2px;}
.acp-compact .x-grid3-scroller, .acp-compact .x-panel-body, .acp-compact .x-toolbar {
    -webkit-overflow-scrolling: touch;
}
.acp-compact .x-grid3-cell-inner {padding-top: 12px; padding-bottom: 12px;}
.acp-compact .x-toolbar {overflow-x: auto; overflow-y: hidden;}
.acp-compact .x-toolbar .x-toolbar-ct {min-width: 100%; width: max-content;}
.acp-compact .x-toolbar-left, .acp-compact .x-toolbar-right {white-space: nowrap;}
.acp-phone .x-window .x-panel-body.x-form {overflow-y: auto !important;}
.acp-phone .x-form .x-column {float: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important;}
.acp-phone .x-form-item {margin-bottom: 12px;}
.acp-phone .x-form-item-label {float: none; width: auto !important; display: block; padding-bottom: 4px;}
.acp-phone .x-form-element {padding-left: 0 !important; max-width: 100%;}
.acp-phone .x-form .x-form-field-wrap {max-width: 100%;}
.acp-phone .x-form input.x-form-text, .acp-phone .x-form textarea.x-form-field {
    box-sizing: border-box; max-width: 100%; min-height: 34px; font-size: 16px;
}
.acp-phone .x-form fieldset {box-sizing: border-box; max-width: 100%;}
.acp-phone .x-window .x-btn button, .acp-phone .x-toolbar .x-btn button {min-height: 32px;}
.acp-phone .x-tree-node a span {display: inline-block; padding-top: 10px; padding-bottom: 10px;}
.acp-phone .x-combo-list-item {padding-top: 10px; padding-bottom: 10px;}
.acp-phone .x-tab-strip span.x-tab-strip-text {padding-top: 10px; padding-bottom: 10px;}

.acp-phone .x-form .x-column-inner {width: 100% !important;}
.acp-phone .x-form .x-panel-body {max-width: 100% !important;}
.acp-phone .x-form .x-column > .x-panel-bwrap > .x-panel-body {
    width: 100% !important; box-sizing: border-box;
}

/* Lists use content widths and horizontal scrolling instead of clipping values. */
.acp-content-grid .x-grid3-cell-inner,.acp-content-grid .x-grid3-hd-inner {white-space:nowrap;}

/* Preserve the existing small raster icons when browser zoom or HiDPI enlarges
   them. Limit pixel-preserving scaling to UI artwork, not document images. */
.x-btn button,
.x-tree-node-icon, .x-tree-ec-icon, .x-tree-node-indent img,
.x-panel-icon, .x-panel-inline-icon, .x-menu-item-icon,
.x-tab-with-icon .x-tab-strip-text,
.x-tool, .x-form-trigger, .x-grid3-row-expander, .x-grid3-row-checker,
.x-grid3-sort-icon, .x-date-left a, .x-date-right a,
img[src*="/icons/"], img[src*="/dots/"], img[src*="/types/"],
.docPENDING, .docEXPERT, .docACCOUNTED, .docRETURNED, .docLOCKED, .docCANCELLED, .docmCANCELLED,
.docmPENDING, .docmEXPERT, .docmACCOUNTED, .docmRETURNED, .docmLOCKED,
.docINCOME, .docEXPENSE, .docBANK, .docSTAFF {
    image-rendering: crisp-edges;
    image-rendering: pixelated;
}

/* Report headings and values remain visible when all columns share the viewport. */
.acp-report-grid .x-grid3-hd-inner {
    white-space: normal; overflow-wrap: anywhere; word-wrap: break-word;
    text-overflow: clip; line-height: 14px; padding-top: 4px; padding-bottom: 4px;
}
.acp-report-grid .x-grid3-hd {vertical-align: middle;}
.acp-fit-report .x-grid3-cell-inner {
    white-space: normal; overflow-wrap: anywhere; word-wrap: break-word; text-overflow: clip;
}
.acp-report-grid .x-panel-header-text {white-space: normal;}