/* 
 This file contains overrides for variables that are not available in Sencha Themer 
*/

/* Icon Corrections */

.x-tool-tool-el {
    overflow: visible;
}

.x-accordion-hd .x-tool-refresh {
    background-image: none;
}

.add-trigger:before {
    content: "\f067";
}

.map-trigger:before {
    content: "\f3c5";
}

.x-window-header .x-tool-img:before {
    color: #444; /* IE Fallback */
    color: var(--base-color);
}

.esp-colorPicker .x-form-trigger-default:before,
.x-form-arrow-trigger:before,
.x-form-time-trigger:before {
    content: '\f107';
}

.x-desktop .esp-fieldListContainer > .x-field .x-form-checkbox-default {
    font-size: 24px !important;
}

.x-desktop .esp-fieldListContainer > .x-field:not(.x-form-cb-checked):not(.esp-expandableListField) .x-form-checkbox-default,
.x-desktop .esp-expandable-list__row > div > div > .x-field:not(.x-form-cb-checked) .x-form-checkbox-default:before {
    transform: scaleX(-100%);
}

.x-desktop .esp-fieldListContainer > .x-field:not(.x-form-cb-checked) .x-form-checkbox-default:before {
    content: '\f205' !important;
    color: #b1b1b1 !important;
}

.x-desktop .esp-fieldListContainer > .x-field.x-form-cb-checked .x-form-checkbox-default:before,
.x-desktop .esp-expandable-list__row > div > div > .x-field.x-form-cb-checked .x-form-checkbox-default:before {
    content: '\f205' !important;
    color: #14AE5C !important;
}

.x-form-radio {
    font-size: 16px;
    width: 18px;
    height: 20px;
    border-radius: 0px;
}

.x-form-radio-default:before {
    content: '\f111';
    font-family: 'Font Awesome 5 Free Regular';
}

.x-form-cb-checked .x-form-radio-default:before {
    content: '\f192';
}

.x-form-cb-label-default.x-form-cb-label-after {
    padding-left: 25px;
}

/* Animation Changes */

.x-form-type-text .x-form-text-default, .x-form-type-password .x-form-text-default {
    -webkit-transition-duration: 0s !important;
    transition-duration: 0s !important;
}

/* Field Masks */

.esp-fieldMask {
    background: none;
}

.esp-fieldMask .x-mask-msg-text {
    padding-top: 17px;
}

/* Windows and Popups */

.x-window:not(.x-window-maximized) {
    border-radius: 10px;
}

.x-message-box .x-toolbar {
    padding-right: 10px !important;
}

.x-tip {
    user-select: none;
}

.x-tip,
.x-css-shadow:not(:has(+ .x-tip)) {
    box-shadow: 0px 0px 10px #00000022, 1px 1px 2px #00000022 !important;
    border-radius: 0px;
}

.x-css-shadow:has(+ .x-tip) {
    box-shadow: none !important;
}

.x-css-shadow:has(+ .x-window) {
    display: none !important;
}

/* Toolbars */

.esp-bigger-toolbar {
    padding-top: 5px;
    padding-bottom: 5px;
}

.esp-bigger-toolbar span {
    font-size: 17px;
}

.esp-bigger-toolbar .x-btn-inner {
    font-size: 14px;
}

.esp-bigger-toolbar .x-btn-icon-el {
    width: 17px;
    height: 17px;
}

.esp-bigger-toolbar .x-box-menu-after {
    margin-right: 0px;
}

.esp-bigger-toolbar .x-box-menu-after {
    padding: 8px 9px 8px 8px !important;
}

.esp-bigger-toolbar .x-box-menu-after .x-btn-icon-el {
    width: 13px;
    height: 17px;
    font-size: 16px;
}

.esp-bigger-toolbar .x-btn-arrow-right:after {
    content: '\f107' !important;
    font: 13px / 1 'Font Awesome 5 Free' !important;
}

.esp-colored-toolbar a {
    border-radius: 8px;
    border: 1px solid transparent !important;
    padding: 6px 8px !important;
    overflow: visible !important;
}

.esp-colored-toolbar a:is(.x-btn, .x-btn-focus) span,
.x-keyboard-mode .esp-colored-toolbar a:is(.x-btn, .x-btn-focus) span.x-btn-inner,
.esp-colored-toolbar a:is(.x-btn, .x-btn-focus) span:before,
.esp-colored-toolbar a:is(.x-btn, .x-btn-focus) span:after {
    color: #000000aa !important;
}

.esp-colored-toolbar a.x-btn-pressed:not(.x-btn-focus) {
    background: #444 !important;
}

.esp-colored-toolbar a.x-btn-pressed:not(.x-btn-focus) span,
.x-keyboard-mode .esp-colored-toolbar a.x-btn-pressed:not(.x-btn-focus):is(.x-btn, .x-btn-focus) span.x-btn-inner,
.esp-colored-toolbar a.x-btn-pressed:not(.x-btn-focus) span:before,
.esp-colored-toolbar a.x-btn-pressed:not(.x-btn-focus) span:after {
    color: #ffffff !important;
}

.esp-colored-toolbar a.x-btn-focus {
    border-color: #666 !important;
}

.esp-colored-toolbar a.x-btn-focus.x-box-menu-after,
.esp-colored-toolbar a.x-btn-menu-active.x-box-menu-after {
    background: #e5e5e5 !important;
}

.esp-colored-toolbar a.x-btn-disabled {
    opacity: 0.5 !important;
}

.esp-colored-toolbar a:before {
    content: '';
    position: absolute;
    top: -1px;
    left: -1px;
    bottom: -1px;
    right: -1px;
    background: black;
    opacity: 0;
    transition: opacity 0.1s ease;
    pointer-events: none;
    border-radius: 8px;
}

.esp-colored-toolbar a.x-btn-over:before {
    opacity: 0.07;
}

/* Grouped toolbar buttons (only bigger+colored implemented for now) */

.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--first,
.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--first:before {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--middle,
.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--middle:before {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
}

.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--last,
.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--last:before {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

.esp-bigger-toolbar.esp-colored-toolbar :is(.esp-groupedBtn--first, .esp-groupedBtn--middle):has(+ a[style*="none"]),
.esp-bigger-toolbar.esp-colored-toolbar :is(.esp-groupedBtn--first, .esp-groupedBtn--middle):has(+ a[style*="none"]):before {
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
}

.esp-bigger-toolbar.esp-colored-toolbar a:is(.esp-groupedBtn--first, .esp-groupedBtn--middle, .esp-groupedBtn--last) {
    padding-left: 10px !important;
    padding-right: 10px !important;
}

.esp-bigger-toolbar.esp-colored-toolbar .esp-groupedBtn--first:not(:first-child) {
    margin-left: 6px;
}

.esp-bigger-toolbar.esp-colored-toolbar :is(.esp-groupedBtn--middle, .esp-groupedBtn--last) {
    margin-left: -6px;
}

/* Bigger Submit Buttons */

.x-btn.esp-toolbar-big-button,
.x-btn.esp-toolbar-big-arrow {
    min-height: 30px;
    max-height: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.x-btn.esp-toolbar-big-arrow + a,
.x-btn.esp-toolbar-big-button + a:not(.esp-toolbar-big-arrow) {
    margin-left: 5px;
}

.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow).x-btn-disabled {
    opacity: 0.33 !important;
    filter: saturate(0);
}

.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow).x-btn-over,
.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow).x-btn-disabled {
    background: linear-gradient(to bottom, hsl(216 28% 46% / 1), hsl(217 27% 42% / 1));
}

.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow):is(.x-btn-active, .x-btn-menu-active, .x-btn-pressed, .x-btn-focus) {
    background: hsl(216 25% 58% / 1) !important;
}

.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow):is(.x-btn-active, .x-btn-menu-active, .x-btn-pressed, .x-btn-focus) span,
.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow):is(.x-btn-active, .x-btn-menu-active, .x-btn-pressed, .x-btn-focus) span:before,
.x-btn:is(.esp-toolbar-big-button, .esp-toolbar-big-arrow):is(.x-btn-active, .x-btn-menu-active, .x-btn-pressed, .x-btn-focus) span:after {
    color: white !important;
}

.x-btn.esp-toolbar-big-arrow.x-btn-over:before {
    background: rgba(0, 0, 0, 0);
}

.esp-toolbar-big-button span,
.esp-toolbar-big-button span:before,
.esp-toolbar-big-button span:after,
.esp-toolbar-big-arrow span,
.esp-toolbar-big-arrow span:before,
.esp-toolbar-big-arrow span:after {
    color: white !important;
    text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.25);
}

.esp-toolbar-big-button {
    background: linear-gradient(to bottom, #5F7BA5, #587198);
    border-radius: 100px;
    padding: 8px;
    margin-right: 0px !important;
    border: none !important;
}

.esp-toolbar-big-button--hasArrow {
    border-radius: 100px 0px 0px 100px;
}

.esp-toolbar-big-button span {
    font-size: 16px;
}

.esp-toolbar-big-arrow {
    background: linear-gradient(to bottom, #5F7BA5, #587198);
    border-radius: 0px 100px 100px 0px;
    padding: 0px 11px 0px 8px;
    margin-left: -1px !important;
    border-top: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-left: 1px solid hsl(216 0% 73% / 1) !important;
}

.esp-toolbar-big-arrow .x-btn-inner {
    display: none;
}

.esp-toolbar-big-arrow .x-btn-wrap-default-small.x-btn-arrow-right:after {
    font: 13px / 1 'Font Awesome 5 Free';
    content: '\f107';
    width: 12px;
}

.x-toolbar-more-icon {
    margin-top: -3px;
}

/* Form Fields */

.esp-fieldContainer:not(:has(.esp-fieldHeadText:empty, .esp-fieldHead.esp-forceHide)):has(.esp-fieldHead) .x-form-text-wrap:not(:has(> textarea)) {
    height: 200%;
}

.esp-fieldContainer .x-form-type-text .x-form-text-default,
.esp-fieldContainer .x-form-type-password .x-form-text-default,
.esp-fieldContainer .x-form-type-text .x-form-trigger-default,
.esp-fieldContainer .x-form-type-password .x-form-trigger-default {
    border: none !important;
    font-size: 13px;
}

.esp-fieldContainer:not(:has(.esp-fieldHeadText:empty, .esp-fieldHead.esp-forceHide)) > .esp-field:nth-child(2) > .esp-fieldListContainer > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]),
.esp-fieldContainer:not(:has(.esp-fieldHeadText:empty, .esp-fieldHead.esp-forceHide)) > .esp-field:nth-child(2) > .esp-fieldListContainer > .x-field.x-form-type-password > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]) {

    /* Keep values aligned to bottom of field, even with a multi-line label */
    height: 100%;
    padding-bottom: 28px;
}

.esp-fieldContainer > .esp-field > .esp-fieldListContainer > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]),
.esp-fieldContainer > .esp-field > .esp-fieldListContainer > .x-field.x-form-type-password > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]),
.esp-fieldContainer .esp-expandableListField:not(.gettingHeights) .esp-expandable-list__row > div > div > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]),
.esp-fieldContainer .esp-expandableListField:not(.gettingHeights) .esp-expandable-list__row > div > div > .x-field.x-form-type-password > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > input:not([type="hidden"]){
    padding-left: 12px !important;
    padding-right: 12px;
}

.esp-fieldContainer > .esp-field > .esp-fieldListContainer > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap:has(> .x-form-text-wrap > textarea:not([type="hidden"])),
.esp-fieldContainer .esp-expandableListField:not(.gettingHeights) .esp-expandable-list__row > div > div > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap:has(> .x-form-text-wrap > textarea:not([type="hidden"])) {
    position: relative;
}

.esp-fieldContainer > .esp-field > .esp-fieldListContainer > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap:has(> textarea:not([type="hidden"])),
.esp-fieldContainer .esp-expandableListField:not(.gettingHeights) .esp-expandable-list__row > div > div > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap:has(> textarea:not([type="hidden"])) {
    overflow: visible;
}

.esp-fieldContainer > .esp-field > .esp-fieldListContainer > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > textarea:not([type="hidden"]) {
    padding: 0px 12px !important;
    margin-left: -12px;
    margin-right: -12px;
    width: calc(100% + 24px);
}

.esp-fieldContainer .esp-expandableListField:not(.gettingHeights) .esp-expandable-list__row > div > div > .x-field.x-form-type-text > .x-form-item-body > .x-form-trigger-wrap > .x-form-text-wrap > textarea:not([type="hidden"]) {
    padding: 4px 12px !important;
}

.x-form-item-body-default.x-form-checkboxgroup-body {
    padding-left: 0px;
    padding-right: 0px;
}

.x-form-check-group, .x-form-radio-group {
    padding-bottom: 6px !important;
}

.x-form-check-group > .x-field, .x-form-radio-group > .x-field {
    margin: 4px 15px 4px 0px !important;
}

.x-form-radio-default, .x-form-checkbox-default {
    color: #cccccc !important;
}

.x-checkboxgroup-form-item input.x-form-field.x-form-text-default {
    border-bottom: 1px solid var(--form-border-color, #d1d8e0) !important;
}

.x-form-cb-checked .x-form-checkbox,
.x-keyboard-mode .x-form-checkbox-focus.x-form-checkbox-default,
.x-form-cb-checked .x-form-radio,
.x-keyboard-mode .x-form-checkbox-focus.x-form-radio-default {
    color: var(--form-color, #196eb3) !important;
}

/* System-wide Fields (including form fields)  */

input::placeholder,
textarea::placeholder {
    color: var(--form-grey-color, #919191);
    letter-spacing: 0.25px;
}

.x-field-focus .x-form-text-default, .x-field-focus .x-form-trigger-default {
    border-color: #111 !important; /* IE Fallback */
    border-color: var(--base-focused-color) !important;
}

.x-form-invalid .x-form-text-default, .x-form-invalid .x-form-trigger-default {
    border-color: #c62828 !important; /* IE Fallback */
    border-color: var(--alert-color) !important;
}

.x-form-text-wrap:has(.x-form-invalid-field) + .x-form-trigger {
    border-color: #c62828 !important; /* IE Fallback */
    border-color: var(--alert-color) !important;
}

.x-form-spinner-up-default {
    line-height: 0.5em !important;
}

.esp-multiTree,
.CodeMirror,
.x-html-editor-wrap > div {
    overflow: hidden;
}

.esp-multiTree .x-tree-panel,
.esp-multiTree .x-tree-panel .x-panel-body,
.esp-multiTree .x-tree-view,
.esp-multiTree .x-grid-item-container,
.esp-multiTree .x-grid-item-container table {
    width: 100% !important;
    background: transparent !important;
}

.esp-multiTree .x-tree-view > .x-scroller-spacer {
    display: none;
}

.esp-multiTree div.x-grid-cell-inner-treecolumn {
    white-space: normal;
    word-break: break-word;
}

.esp-fieldContainer .esp-multiTree div.x-grid-cell-inner-treecolumn {
    padding: 4px 12px;
}

:not(.esp-fieldContainer) > .esp-field .esp-multiTree div.x-grid-cell-inner-treecolumn {
    padding: 4px 12px;
    white-space: normal;
    word-break: break-word;
}

.esp-multiTree table {
    margin-top: 2px;
}

.esp-multiTree > .x-form-item-body.x-form-text-grow {
    min-width: 100%;
    max-width: 100%;
}

.esp-multiTree-trigger:before {
    display: none;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger {
    padding: 5px 0px;
    width: 45px;
    cursor: default;
    position: absolute;
    top: 0;
    right: 0;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger .fa-plus {
    font-size: 14px !important;
    margin-top: -1px;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger .fa-pencil {
    font-size: 15px !important;
    margin-left: 8px;
    margin-right: 7px;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger > * {
    padding: 0px !important;
    border-bottom: none;
    cursor: pointer;
    height: 19px;
}

.esp-fieldContainer--disabled .esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger > * {
    cursor: default;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default.esp-multiTree-trigger > .esp-multiTree-trigger-popout {
    position: relative;
    left: 1px;
    top: 1px;
}

.esp-multiTree.x-form-type-text .x-form-trigger-default > *:before {
    opacity: 1;
}

.esp-fieldContainer--searchItemSelector .esp-fieldHead,
.esp-fieldContainer--multiTree .esp-fieldHead {
    padding-right: 20px;
}

.esp-fieldContainer--multiTree .esp-field:not(.esp-field--popout):not(:has(table.x-grid-item)):before,
.esp-fieldContainer--searchItemSelector .esp-field:not(.esp-field--popout):has(.x-container:nth-child(3) ul:empty):before {
    content: '(No Items Selected)';
    pointer-events: none;
    position: absolute;
    z-index: 15;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: var(--form-grey-color, #919191);
    font-size: 12px;
}

.esp-fieldContainer--multiTree .esp-field:not(.esp-field--popout):not(:has(table.x-grid-item)):before {
    top: 10px;
    left: 0px;
    bottom: 0px;
    right: 0px;
}

.esp-fieldContainer--searchItemSelector .esp-field:not(.esp-field--popout):has(.x-container:nth-child(3) ul:empty):before {
    top: 30px;
    left: 50%;
    bottom: 0;
    right: 0;
}

.esp-fieldContainer--searchItemSelector .esp-fieldHead {
    position: relative;
    z-index: 11;
}

.esp-field:not(.esp-field--popout) .esp-fieldListContainer .esp-searchItemSelector {
    margin-top: -21px;
    margin-right: -12px;
    margin-left: -12px;
}

.esp-field:not(.esp-field--popout) .esp-fieldListContainer .esp-multiTree [style*="width"] {
    min-width: 100% !important;
}

.esp-searchItemSelector :is(.x-box-layout-ct, .x-box-inner, .x-box-target):not(.x-toolbar) {
    min-width: 100%;
}

.esp-field:not(.esp-field--popout) .esp-searchItemSelector .x-form-fieldcontainer {
    min-width: 50%;
    max-width: 50%;
}

.esp-field:not(.esp-field--popout) .esp-searchItemSelector .x-form-fieldcontainer [style*="width"]:not(.x-toolbar) {
    min-width: 100%;
}

.esp-field:not(.esp-field--popout) .esp-searchItemSelector .x-container:nth-child(3) {
    left: 50% !important;
}

.esp-field:not(.esp-field--popout) .esp-searchItemSelector li.x-boundlist-item {
    border: none;
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 4px;
    padding-bottom: 4px;
    line-height: 14px;
}

.esp-field:not(.esp-field--popout) .esp-searchItemSelector .x-tool-after-title {
    top: -16px !important;
}

.esp-searchItemSelector .x-mask {
    display: none;
}

.x-form-trigger-wrap {
    height: inherit;
    min-height: inherit;
}

.x-form-text-field-body-default {
    min-width: 100px;
    max-width: none;
}

.x-form-type-text .x-form-text-default, .x-form-type-password .x-form-text-default {
    box-sizing: border-box !important;
}

.x-form-item-no-label > label {
    display: none;
}

.x-grid-editor .x-form-item-body {
    padding: 0px;
}

.x-datepicker-date {
    padding: 0px !important;
}

.esp-fieldListContainer .x-field-body {
    width: 0;
    height: 0;
    overflow: hidden;
    position: absolute;
    opacity: 0;
    z-index: -99;
}

div.x-form-cb-wrap-default {
    height: auto;
}

div.x-grid-cell-inner-treecolumn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

div.x-grid-cell-inner-treecolumn > i.clickable {
    margin-left: 2px;
    position: relative;
    z-index: 2;
}

.x-field.x-form-readonly.x-form-type-checkbox .x-form-field {
    color: #888;
}

/* Tabs */

.x-tab-bar {
    padding-top: 3px;
    background: #e1e1e1;
}

.x-tab {
    border-radius: 8px 8px 0px 0px !important;
}

.x-tab-bar-body > div.x-box-inner,
.x-tab-bar-body > div.x-box-inner > div.x-box-target,
.x-tab-bar-body > div.x-box-inner > div.x-box-target > a.x-tab {
    min-height: 100%;
}

.x-tab:not(.x-tab-active):not(:has(+ .x-tab-active)):not(:last-child):after {
    content: '';
    position: absolute;
    top: 5px;
    bottom: 5px;
    right: -3px;
    width: 2px;
    background: #ccc;
    border-radius: 10px;
}

.x-tab-bar-body > div.x-box-inner > div.x-box-target {
    margin-left: 8px;
}

.x-tab.x-tab-active:before {
    content: '';
    position: absolute;
    bottom: 0px;
    left: -15px;
    width: 16px;
    height: 16px;
    pointer-events: none;
    background: radial-gradient(transparent 60%, var(--alt-background-color) 0%);
    mask: linear-gradient(-45deg, black 30%, transparent 30%);
}

.x-tab.x-tab-active:after {
    content: '';
    position: absolute;
    bottom: 0px;
    right: -15px;
    width: 16px;
    height: 16px;
    pointer-events: none;
    background: radial-gradient(transparent 60%, var(--alt-background-color) 0%);
    mask: linear-gradient(45deg, black 30%, transparent 30%);
}

.x-tab-wrap {
    table-layout: fixed;
}

/* Small Tabs */

.esp-tab-small.x-tab {
    padding-top: 13px;
}

.esp-tab-small.x-tab .x-tab-close-btn {
    top: 3px;
    font-size: 10px;
}

/* Grids */

.x-grid-with-row-lines .x-grid-item:first-child {
    border-top: 0px !important;
}

td.x-grid-cell-row-numberer {
    background-color: transparent;
}

.x-grid-row .x-grid-cell-selected {
    background-color: transparent;
}

.x-grid-row .x-grid-cell-selected > div,
.x-grid-cell-selected:before{
    background-color: #88888850;
    background-color: var(--selected-background-color);
}

.x-grid-cell-selected:before {
    content: '';
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0.75;
    z-index: 0;
}

.x-grid-cell-selected ~ .x-grid-cell-selected:before {
    display: none;
}

.x-grid-row {
    position: relative;
}

.x-grid-cell {
    position: initial;
}

.x-grid-cell > div {
    position: relative;
    z-index: 1;
}

.x-grid-drop-indicator {
    background: none !important;
    border-top: 1px dashed #aaa;
}

.x-grid-drop-indicator-left,
.x-grid-drop-indicator-right {
    display: none !important;
}

/* Grids - Inline Editor */

.x-grid-cell .x-form-trigger.fa-search {
    display: none;
}

.x-grid-cell .fa-search.clickable {
    margin-right: 2px;
}

.x-grid-cell .x-form-trigger {
    vertical-align: middle;
    padding-bottom: 2px;
}

.x-form-trigger-spinner {
    vertical-align: middle;
    padding-bottom: 2px;
}

.x-grid-cell .x-form-spinner {
    background: transparent;
}

/* Trees */

.esp-multitreepanel--flattened .x-tree-view .x-tree-icon,
.esp-multitreepanel--flattened .x-tree-view .x-tree-elbow-img {
    display: none;
}

.x-tree-view .x-tree-icon,
.x-tree-view .x-tree-elbow-img {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    min-width: 12px;
    margin-right: 6px !important;
    position: relative;
    z-index: 2;
}

.x-tree-view .x-tree-checkbox:not(.esp-dot-indicator):before,
.x-tree-view .x-tree-icon:not(.esp-dot-indicator):before,
.x-tree-view .x-tree-elbow-img:not(.esp-dot-indicator):before {
    color: #666 !important;
}

.x-tree-view tr.x-grid-row.x-grid-tree-node-expanded .x-tree-expander:before {
    content: '\f107' !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
}

.x-tree-view tr.x-grid-row:not(.x-grid-tree-node-expanded) .x-tree-expander:before {
    content: '\f105' !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
}

.x-tree-view .x-tree-checkbox {
    font-size: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-top: -3px;
    max-width: 14px;
    margin-right: 3px;
    position: unset;
}

.x-tree-view .x-tree-checkbox:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
}

.x-tree-view .x-tree-checkbox.x-tree-checkbox-checked:before {
    content: '\f14a' !important;
    font-family: 'Font Awesome 5 Free' !important;
    font-weight: 900 !important;
    color: #4793d1 !important;
}

.x-tree-view .x-tree-checkbox:not(.x-tree-checkbox-checked):before {
    content: '\f0c8' !important;
    font-family: 'Font Awesome 5 Free Regular' !important;
    font-weight: 400 !important;
}

/* Menus */

.x-menu-item-default.x-menu-item-separator {
    border-top-color: var(--divider-color);
    margin-top: 2px !important;
    padding-top: 5px !important;
}

.x-menu-item-icon.esp-smallerMenuIcon {
    font-size: 13px;
}

/* Tooltips */

.x-tip-form-invalid,
.x-css-shadow:has(+ .x-tip-form-invalid) {
    display: none !important; /* Error tooltips are handled differently. See QuickTip.js updateContent override. */
}

.x-tip hr {
    border-top: none;
    border-left: none;
    border-right: none;
    border-bottom: 1px solid var(--divider-color);
    margin: 4px 0px;
}

.x-tip .esp-error-list {
    color: var(--alert-color, #c62828);
    font-weight: bold;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.x-tip .esp-error-list:not(:first-child) {
    margin-top: 10px;
}

.x-tip .esp-error-list > i {
    margin-right: 5px;
    margin-top: 2px;
}

/* Splitters */

.x-splitter.x-splitter-active {
    z-index: 999;
}