/*
    CSS used to override DevEx CSS located in dx.light.compact.css
*/

@import url("./color.css");

/* =====================================================
	          DevEx Tabs, Buttons, etc.
======================================================== */

.dx-multiview-wrapper {
    padding: 20px;
    min-height: 100px;
}

.dx-tabpanel.dx-state-focused .dx-multiview-wrapper {
    border: 1px solid var(--slate);
}

.dx-tabpanel.dx-state-focused .dx-tab-selected:after {
    border-top: 1px solid var(--slate);
    border-right: 1px solid var(--slate);
    border-left: 1px solid var(--slate);
}

.dx-tabpanel.dx-state-focused .dx-tab:not(.dx-tab-selected):before {
    border-bottom: 1px solid var(--slate);
}

.dx-tabpanel {
    width: 100%;
}

.tab-panel-content {
    padding: 20px;
}

.dx-tab {
    border-right: 1px solid var(--cool-grey);
    border-left: 1px solid var(--cool-grey);
    padding: 9px;
}

.dx-tab.dx-tab-selected, .dx-tabpanel>.dx-tabpanel-tabs .dx-tab.dx-tab-selected .dx-tab-content {
  background-color: var(--cogency-blue);
  color: white;
}

.dx-menu-item {
    color: white;
}

    .dx-menu-item.dx-state-hover {
        color: var(--slate);
    }

.dx-menu-item-expanded, .dx-submenu .dx-menu-item {
    color: var(--slate);
}

.dx-button-content {
    white-space: pre-wrap;
}

.dx-dropdownlist-popup-wrapper .dx-list-item-content {
    word-wrap: normal;
    overflow: visible;
    text-overflow: unset;
    white-space: pre-wrap;
    display: block;
}

.dx-template-wrapper {
    padding-top: 0;
    margin-top: 0;
}

.dx-nav-item.dx-state-focused,
.dx-rtl .dx-nav-item.dx-state-focused {
    -webkit-box-shadow: inset 0 0 0 1px var(--cogency-blue);
    box-shadow: inset 0 0 0 1px var(--cogency-blue);
}

/* =====================================================
	                 DevEx DataGrid
======================================================== */

.dx-datagrid .dx-link {
    text-decoration: none;
    margin: 0 3px;
    color: var(--cogency-blue);
}

    .dx-datagrid .dx-link:hover {
        opacity: 0.8;
    }

.dx-datagrid-save-button {
    background-color: var(--success);
}

.dx-button.dx-state-disabled.dx-widget .dx-icon {
    color: white;
}

.col-buttons {
    text-align: center;
}

.dx-datagrid-rowsview .dx-select-checkboxes-hidden > tbody > tr > td > .dx-select-checkbox {
    display: block;
}

tr.dx-header-row > td.dx-datagrid-action {
    text-align: left !important;
}

    tr.dx-header-row > td.dx-datagrid-action > div.dx-column-indicators {
        float: right !important;
    }

.dx-datagrid .dx-header-filter {
    color: var(--cogency-blue);
}

.dx-datagrid .dx-header-filter-empty {
    color: rgba(149, 149, 149, 0.5);
}

.dx-datagrid-search-text,
.dx-treelist-search-text,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field.dx-state-active,
.dx-filterbuilder .dx-filterbuilder-group .dx-filterbuilder-text.dx-filterbuilder-item-field:focus {
    background-color: var(--cogency-blue);
}

.dx-datagrid-filter-panel .dx-datagrid-filter-panel-clear-filter,
.dx-datagrid-filter-panel .dx-datagrid-filter-panel-text,
.dx-datagrid-filter-panel .dx-icon-filter,
.dx-treelist-filter-panel .dx-icon-filter,
.dx-treelist-filter-panel .dx-treelist-filter-panel-clear-filter,
.dx-treelist-filter-panel .dx-treelist-filter-panel-text {
    color: var(--cogency-blue);
}

.dx-datagrid-drop-highlight > td {
    background-color: var(--cogency-blue);
}

.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td {
    background-color: rgba(var(--skylight-rgb), .3);
    color: var(--slate);
}

    .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td.dx-datagrid-group-space,
    .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td.dx-datagrid-group-space,
    .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td.dx-datagrid-group-space,
    .dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td.dx-datagrid-group-space {
        border-right-color: rgba(var(--skylight-rgb), .3);
    }

.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > td {
    border-bottom: 1px solid rgba(var(--skylight-rgb), .3);
    border-top: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > tr:first-child > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > tr:first-child > td {
    border-top: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > tr:last-child > td,
.dx-datagrid-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > tr:last-child > td {
    border-bottom: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-rtl .dx-datagrid-rowsview .dx-selection.dx-row > td:not(.dx-focused).dx-datagrid-group-space,
.dx-rtl .dx-datagrid-rowsview .dx-selection.dx-row > tr > td:not(.dx-focused).dx-datagrid-group-space,
.dx-rtl .dx-datagrid-rowsview .dx-selection.dx-row:hover > td:not(.dx-focused).dx-datagrid-group-space,
.dx-rtl .dx-datagrid-rowsview .dx-selection.dx-row:hover > tr > td:not(.dx-focused).dx-datagrid-group-space {
    border-left-color: rgba(var(--skylight-rgb), .3);
}

/* Removes the DevEx scrollbars and just uses browser scrollbars */

.dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content, .dx-scrollbar-horizontal.dx-scrollbar-hoverable, .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll, .dx-scrollbar-horizontal.dx-scrollbar-hoverable .dx-scrollable-scroll .dx-scrollable-scroll-content, .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll.dx-state-invisible .dx-scrollable-scroll-content, .dx-scrollbar-vertical.dx-scrollbar-hoverable, .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll, .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll .dx-scrollable-scroll-content, .dx-scrollbar-vertical.dx-scrollbar-hoverable .dx-scrollable-scroll {
    transition: none;
}

.dx-scrollable-scroll-content, .dx-scrollbar-hoverable.dx-state-hover, .dx-scrollbar-hoverable.dx-scrollable-scrollbar-active, .dx-scrollbar-hoverable.dx-scrollable-scrollbar-active .dx-scrollable-scroll-content {
    background-color: transparent;
    box-shadow: none;
    transition: none;
}

/* =====================================================
	          DevEx Popups and Notifications
======================================================== */

.dx-overlay-content {
    overflow: auto;
}

.dx-popup-content {
    padding: 20px;
}

.popup-alert-warning .dx-popup-title .dx-closebutton,
.popup-alert-warning .dx-popup-title .dx-closebutton .dx-icon {
  color: var(--slate);
}

.dx-popup-title .dx-closebutton, .dx-popup-title .dx-closebutton .dx-icon {
    color: white;
}

    .dx-popup-title .dx-closebutton:hover, .dx-popup-title .dx-closebutton:hover .dx-icon {
        color: var(--cool-grey);
    }

.dx-datagrid-column-chooser .dx-overlay-content .dx-popup-title {
    color: var(--slate);
    padding: 7px 10px 9px 10px;
}

    .dx-datagrid-column-chooser .dx-overlay-content .dx-popup-title .dx-closebutton .dx-icon {
        color: var(--slate);
    }

.dx-popup-title.dx-toolbar {
    background-color: var(--cogency-blue);
    color: white;
    overflow: visible;
    padding: 10px 20px;
}

.popup-alert .dx-toolbar-before .fa-solid {
  font-size: 24px;
}

.popup-alert.popup-alert-warning .dx-popup-title.dx-toolbar {
  background-color: var(--warning);
  color: var(--slate);
}

.popup-alert.popup-alert-error .dx-popup-title.dx-toolbar {
    background-color: var(--danger);
}

.dx-toast-warning .dx-toast-icon,
.dx-toast-error .dx-toast-icon,
.dx-toast-info .dx-toast-icon,
.dx-toast-success .dx-toast-icon {
  background: none;
}

.dx-toast-icon {
  font-size: 12px;
  padding-right: 40px;
}

.dx-toast-content {
  font-weight: normal;
}

.dx-toast-content>.dx-template-wrapper {
  width: auto;
}

/* =====================================================
	                   DevEx Forms
======================================================== */
.dx-field,
.dx-field:last-of-type {
  color: var(--slate);
  margin: 5px;
}

.dx-field-label {
  font-size: 12px;
  color: var(--slate);
}

.dx-placeholder {
    color: rgba(var(--slate-rgb), .4);
}

.dx-fieldset {
    margin: 8px 0 0 0;
    width: 100%;
    display: inline-block;
    padding: 5px;
}

.dx-fieldset-border {
  border: 1px solid var(--cogency-blue);
  border-radius: 5px;
  background-color: var(--white-smoke);
}

.dx-field-item-label {
  margin-bottom: 3px;
}

.dx-field-label {
  overflow: visible;
  white-space: normal;
  float: none;
  width: auto;
  color: var(--slate);
  cursor: default;
}

.dx-field-label-location-left {
  float: left;
  width: 30vw;
  padding: 5px 10px 5px 0;
}

.dx-fieldset-header {
    font-weight: 700;
    color: var(--cogency-blue);
    margin: 0 0 0 10px;
}

.field-disabled.dx-state-disabled.dx-widget, .field-disabled.dx-state-disabled .dx-widget {
    opacity: .8;
}

.dx-scrollable-container {
    overflow: auto;
}

.dx-texteditor.dx-state-readonly.dx-editor-filled.dx-state-hover {
    background-color: rgba(var(--cogency-blue-rgb), .07);
}

.dx-texteditor.dx-state-hover {
    border-color: rgba(var(--cogency-blue-rgb), .4);
}

    .dx-texteditor.dx-state-hover.dx-editor-filled {
        background-color: rgba(var(--cogency-blue-rgb), .1);
    }

.dx-texteditor.dx-state-focused .dx-texteditor-label,
.dx-texteditor.dx-state-focused.dx-state-hover .dx-texteditor-label {
    color: var(--cogency-blue);
}

.dx-texteditor.dx-state-active.dx-editor-filled,
.dx-texteditor.dx-state-active.dx-editor-outlined,
.dx-texteditor.dx-state-active.dx-editor-underlined,
.dx-texteditor.dx-state-focused.dx-editor-filled,
.dx-texteditor.dx-state-focused.dx-editor-outlined,
.dx-texteditor.dx-state-focused.dx-editor-underlined {
    border-color: var(--cogency-blue);
}

.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-radiobutton-icon::before,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-checkbox-icon,
.dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-radiobutton-icon::before {
    border: 1px solid var(--cogency-blue);
}

.dx-editor-filled .dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-editor-filled .dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon,
.dx-editor-filled.dx-dropdowneditor-button.dx-state-active .dx-dropdowneditor-icon,
.dx-editor-filled.dx-dropdowneditor.dx-dropdowneditor-active .dx-dropdowneditor-icon {
    background-color: rgba(var(--cogency-blue-rgb), .3);
}

.dx-list-slide-menu-button-menu,
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused,
.dx-fa-button.dx-fa-button-main .dx-overlay-content {
    background-color: var(--cogency-blue);
}

    .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused.dx-list-item-selected {
        background-color: rgba(var(--cogency-blue-rgb), .7);
    }

.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active,
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-list-slide-item-content {
    background-color: var(--cogency-blue);
}

.dx-device-mobile .dx-list-item.dx-list-item-ghost-reordering.dx-state-focused.dx-state-hover,
.dx-list-item.dx-list-item-ghost-reordering.dx-state-focused.dx-state-hover {
    border-top: 1px solid rgba(var(--cogency-blue-rgb), .5);
    border-bottom: 1px solid rgba(var(--cogency-blue-rgb), .5);
}

.dx-device-mobile .dx-list-slide-menu-button-menu,
.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused.dx-list-item-selected {
    background-color: rgba(var(--cogency-blue-rgb), .7);
}

.dx-device-mobile .dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-checkbox-icon,
.dx-device-mobile .dx-list.dx-list-select-decorator-enabled .dx-list-item.dx-state-focused .dx-radiobutton-icon::before,
.dx-device-mobile .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-checkbox-icon,
.dx-device-mobile .dx-list.dx-list-select-decorator-enabled .dx-list-select-all.dx-state-focused .dx-radiobutton-icon::before,
.dx-sortable-placeholder {
    border: 1px solid var(--cogency-blue);
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active .dx-list-slide-item-content,
.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-active,
.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-state-focused {
    background-color: var(--cogency-blue);
}

.field-disabled.dx-state-disabled.dx-widget .dx-texteditor-input, .field-disabled.dx-state-disabled .dx-widget .dx-texteditor-input {
    background: var(--cool-grey)ddd;
    border-radius: 4px;
    color: #000;
    cursor: inherit;
    display: inline-block;
    font-weight: normal;
    margin: 0px;
    max-width: 100%;
    min-height: 26px;
    padding: 4px 5px;
    text-align: left;
    white-space: pre-wrap;
    width: 100%;
    word-wrap: break-word;
}

.dx-list-item-content {
    word-wrap: normal;
    overflow: visible;
    text-overflow: unset;
    white-space: pre-wrap;
    display: block;
}

.dx-list-item,
.dx-dropdownlist-popup-wrapper .dx-list-item {
    border-top: 1px solid rgba(var(--slate-rgb), .08);
}

    .dx-list-item:first-of-type {
        border-top: none;
    }

.dx-datagrid .dx-list-item, .dx-datagrid .dx-dropdownlist-popup-wrapper .dx-list-item {
    border-top: none;
}

.dx-device-mobile .dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected,
.dx-list:not(.dx-list-select-decorator-enabled) .dx-list-item.dx-list-item-selected {
    background-color: rgba(var(--skylight-rgb), 0.3);
    color: var(--slate);
}

.dx-badge {
  background-color: var(--cogency-blue);
}

/* DevExtreme Radio Button */
.dx-radiobutton-icon {
  width: 18px;
  height: 18px;
  border-radius: 50%;
}

.dx-radiobutton-icon.dx-radiobutton-icon-checked {
  border: 1px solid var(--cogency-blue);
}

.dx-radiobutton-icon-checked .dx-radiobutton-icon-dot {
  background: var(--cogency-blue);
}

.dx-radiobutton.dx-state-hover .dx-radiobutton-icon::before {
  border-color: rgba(var(--cogency-blue-rgb), .4);
}

.dx-radiobutton.dx-state-focused:not(.dx-state-active) .dx-radiobutton-icon::before {
  border: 1px solid var(--cogency-blue);
}

.dx-radiobutton-icon .dx-radiobutton-icon-dot {
  border: 2px solid white;
}

.dx-radiobutton.dx-state-focused .dx-radiobutton-icon {
  border-color: var(--cogency-blue);
}

/* DevExtreme Checkbox */
.dx-checkbox.dx-state-focused .dx-checkbox-icon {
  border: 1px solid var(--cool-grey);
}

.dx-checkbox-icon {
  width: 18px;
  height: 18px;
  border-radius: 5px;
  background-color: #fff;
}

.dx-checkbox-checked .dx-checkbox-icon {
  background-color: var(--cogency-blue);
  color: white;
}

.dx-checkbox-container {
  overflow: hidden;
  white-space: nowrap;
  height: 100%;
  width: 100%;
  vertical-align: middle;
  display: inline-flex;
  align-items: center;
  text-overflow: clip;
}

.dx-checkbox-text {
  text-align: left;
  white-space: pre-wrap;
  word-wrap: break-word;
  line-height: normal;
  padding-left: 5px;
}

/*  DevExtreme Datepicker   */
.dx-calendar-navigator-next-month.dx-button .dx-icon,
.dx-calendar-navigator-next-view.dx-button .dx-icon,
.dx-calendar-navigator-previous-month.dx-button .dx-icon,
.dx-calendar-navigator-previous-view.dx-button .dx-icon,
.dx-calendar-navigator .dx-calendar-caption-button.dx-button .dx-button-content,
.dx-checkbox-indeterminate .dx-checkbox-icon {
  color: var(--cogency-blue);
}

.dx-calendar-cell.dx-calendar-selected-date.dx-calendar-contoured-date span {
  box-shadow: 0 0 0 2px var(--cool-grey);
}

.dx-calendar-cell.dx-calendar-selected-date span {
  background-color: var(--cogency-blue);
  border-color: var(--cogency-blue);
}

/*  DevExtreme Validation Summary   */

.dx-validationsummary-item::before {
    content: '\2022';
    margin-right: 10px;
}

.dx-validationsummary-item-content {
    border: none;
    margin: 3px 0;
}

    .dx-validationsummary-item-content:hover, .dx-validationsummary-item-content:active {
        border-bottom: 1px dotted var(--danger);
    }

/*  DevExtreme Tooltip   */

i.dx-icon-info {
  color: var(--skylight);
}

.dx-popup-content .dx-template-wrapper {
  font-size: 14px;
}

.dx-tooltip-wrapper .dx-overlay-content {
  max-width: 95%;
}

.dx-tooltip-wrapper .dx-overlay-content .dx-popup-content {
  white-space: pre-wrap;
  max-width: 500px;
  text-align: initial;
}

/*  DevExtreme Switch   */

.dx-switch {
  width: 70px;
  cursor: pointer;
  overflow: visible;
  height: auto;
}

.dx-switch-container {
  height: 25px;
  border: 1px solid var(--cool-grey);
  border-radius: 80px;
  background-color: var(--slate);
  transition: 0.15s ease-out;
  transition-property: opacity background;
}

.dx-switch.dx-state-hover .dx-switch-container {
  background-color: var(--slate);
  border-color: var(--slate);
}

.dx-switch-on-value.dx-switch.dx-state-hover .dx-switch-container {
  background-color: var(--cogency-blue);
  border-color: var(--cogency-blue);
}

.dx-switch-off, .dx-switch-on {
  font-size: 14px;
  color: white;
  line-height: 23px;
  font-weight: normal;
  text-transform: uppercase;
}

.dx-switch-on-value .dx-switch-container {
  background-color: var(--cogency-blue);
}

.dx-switch-success.dx-switch-on-value .dx-switch-container {
  background-color: var(--success);
}

.dx-switch-off-value .dx-switch-container {
  background-color: var(--slate);
}

.dx-switch-handle {
  flex-basis: 19px;
  margin-top: 1.5%;
}

.dx-switch-handle:before {
  font: 1.5em 'FontAwesome';
  content: '\f111';
  color: white;
  border-radius: 0px;
  background-color: transparent;
}

.dx-switch-no-text.dx-switch,
.dx-switch-no-text.dx-switch .dx-switch-container {
  width: 40px;
  height: 18px;
}

.dx-switch-no-text.dx-switch .dx-switch-handle {
  flex-basis: 14px;
}

.dx-switch-no-text.dx-switch .dx-switch-handle:before {
  font-size: 1em;
}

.dx-switch.dx-state-focused .dx-switch-handle:before,
.dx-switch.dx-state-hover .dx-switch-handle:before,
.dx-switch.dx-state-active .dx-switch-handle:before,
.dx-switch.dx-state-hover.dx-state-active .dx-switch-handle:before,
.dx-switch.dx-state-focused.dx-state-active .dx-switch-handle:before,
.dx-switch-on-value .dx-switch-handle:before {
  background-color: transparent;
}

.dx-switch-success.dx-switch-on-value.dx-switch.dx-state-hover .dx-switch-container {
  background-color: var(--success);
  border-color: var(--success);
}

.dx-switch.dx-switch.dx-state-active .dx-switch-container {
  border-color: var(--slate);
  background-color: #60606033;
}

/* Custom Switch/Radio */
.combined-switch .dx-radio-value-container {
  display: none !important;
}

.combined-switch .dx-widget.dx-collection {
  width: 210px;
  justify-content: center;
  column-gap: 0;
  padding: 2px 0;
  border-radius: 50vh;
  border: 1px solid var(--cogency-blue);
  position: relative;
}

.combined-switch .dx-radiobutton {
  padding: 8px 30px;
  border-radius: 50vh;
}

.combined-switch .dx-item-selected {
  background-color: var(--cogency-blue);
  color: white;
}

/*  Number Box  */

.number-box-dollar .dx-texteditor-container:before {
    content: '$';
    padding-left: 10px;
}

.number-box-dollar .dx-texteditor-input {
    width: 82%;
    padding-left: 10px;
}

/* File Uploader */

.dx-fileuploader-wrapper {
  padding: 0;
  background: white;
}

.dx-fileuploader-input-wrapper,
.dx-fileuploader-dragover .dx-fileuploader-input-wrapper {
  border: 1px dashed var(--cool-grey);
  padding: 20px;
}

.dx-fileuploader-input-container .dx-field, .dx-fileuploader-input-container .dx-fileuploader-input-label {
    margin: 10px auto;
}

.dx-fileuploader-dragover .dx-fileuploader-input {
    display: flex;
    padding: 0;
    margin: 0;
}

.dx-fileuploader-dragover .dx-fileuploader-input-container {
    display: flex;
    width: auto;
    border: none;
}

.dx-fileuploader-input-container {
  overflow: visible;
  flex: 1;
  display: flex;
  width: auto;
  margin-top: 10px;
}

.dx-fileuploader-input {
    min-height: 40px;
}

.dx-fileuploader .dx-fileuploader-input-wrapper>.dx-fileuploader-button {
  background: var(--cogency-blue);
  border-color: var(--cool-grey) !important;
  border-radius: 40px;
  box-sizing: border-box;
  color: #fff;
  cursor: pointer;
  display: inline-block;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5em;
  margin: 10px 6px;
  min-width: 125px;
  padding: 8px 15px;
  text-align: center;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  transition: all .4s ease !important;
  user-select: none;
  vertical-align: middle;
  -webkit-font-smoothing: antialiased;
  -webkit-user-select: none !important;
}

.fileuploader.dropzone {
  border: 1px dashed var(--cool-grey);
  padding: 20px;
}

.fileuploader.dropzone .dropzone-icon {
  font-size: 3em;
}

.fileuploader.dropzone .formats-text {
  color: #A0AEC0;
}

.fileuploader.dropzone.dropzone-leave {
  background-color: white;
}

.fileuploader.dropzone.dropzone-enter,
.dx-fileuploader-dragover .dx-fileuploader-wrapper {
  background-color: var(--white-smoke);
}

.dx-fileuploader-dragover .dx-fileuploader-input-label {
  text-align: inherit;
  border: none;
  padding: 5px 4px;
}

/* When custom dropzone is used, input is hidden. */
.dx-fileuploader-hidden .dx-fileuploader-input-wrapper {
  display: none;
}

/* File Queue */
.dx-fileuploader-file-container {
  border: 1px solid var(--cool-grey);
  box-shadow: 0 1px 3px rgba(var(--slate-rgb), .32);
  margin: 8px 0;
  padding: 0;
}

.dx-fileuploader-file {
  padding: 10px 10px 5px 10px;
}

.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button {
  border: none;
  box-shadow: none;
}

.dx-fileuploader-file-container .dx-button:not(.dx-toolbar .dx-button, .card-body .dx-button, .dx-dropdownbutton .dx-button).dx-fileuploader-button {
  margin: 10px 3px;
}

.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button:hover,
.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button:active,
.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button.dx-state-hover {
  filter: none;
  background-color: transparent;
}

.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button:hover .dx-icon-close:before,
.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button:active .dx-icon-close:before,
.dx-button.dx-fileuploader-button.dx-fileuploader-cancel-button.dx-state-hover .dx-icon-close:before {
  color: var(--cool-grey);
}

.dx-fileuploader-file-container .dx-fileuploader-button-container .dx-fileuploader-button .dx-icon-close:before {
  content: '\f057';
  font-size: 18px;
}

/* =====================================================
	            DevEx Tree List / Tree View
======================================================== */

.dx-treelist-rowsview {
    overflow: auto;
}

    .dx-treelist-rowsview .dx-treelist-collapsed span, .dx-treelist-rowsview .dx-treelist-expanded span {
        font: 1.2em 'FontAwesome';
    }

        .dx-treelist-rowsview .dx-treelist-collapsed span:before {
            content: '\f0da';
        }

        .dx-treelist-rowsview .dx-treelist-expanded span:before {
            content: '\f0d7';
        }

.dx-treelist-container {
    background-color: transparent;
}

    .dx-treelist-container .dx-toolbar {
        background-color: transparent;
    }

.dx-treelist-column-chooser .dx-overlay-content .dx-popup-title {
    background-color: var(--cogency-blue);
}

.dx-treelist-header-panel {
    border-bottom: none;
    overflow: visible;
    margin-left: 10px;
    padding-right: 10px;
}

.dx-toolbar {
    background-color: transparent;
}

.dx-treelist {
    height: 100%;
    max-height: 100%;
    width: 90%;
}

.tree-list .dx-row > td {
    padding-top: 10px;
}

    .tree-list .dx-row > td.dx-treelist-cell-expandable {
        padding-top: 5px;
    }

.tree-list .dx-toolbar-before {
    padding-left: 5px;
}

.dx-treelist {
    height: 100%;
    max-height: 100%;
    width: 90%;
}

    .dx-treelist .dx-row > td {
        padding-top: 10px;
    }

        .dx-treelist .dx-row > td.dx-treelist-cell-expandable {
            padding-top: 5px;
        }

    .dx-treelist .dx-toolbar-before {
        padding-left: 5px;
    }

.dx-treeview-node.dx-state-focused > .dx-treeview-item,
.dx-treeview-node.dx-state-selected > .dx-treeview-item,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td {
    background-color: rgba(var(--skylight-rgb), .3);
    color: var(--slate);
}

    .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > td.dx-treelist-group-space,
    .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused) > tr > td.dx-treelist-group-space,
    .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > td.dx-treelist-group-space,
    .dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover > tr > td.dx-treelist-group-space {
        border-right-color: rgba(var(--skylight-rgb), .3);
    }

.dx-treeview-item-with-checkbox.dx-state-focused > .dx-checkbox .dx-checkbox-icon {
    border: 1px solid var(--cogency-blue);
}

.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > td {
    border-bottom: 1px solid rgba(var(--skylight-rgb), .3);
    border-top: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > tr:first-child > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > tr:first-child > td {
    border-top: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):hover:not(.dx-row-lines) > tr:last-child > td,
.dx-treelist-rowsview .dx-selection.dx-row:not(.dx-row-focused):not(.dx-row-lines) > tr:last-child > td {
    border-bottom: 1px solid rgba(var(--skylight-rgb), .3);
}

.dx-rtl .dx-treelist-rowsview .dx-selection.dx-row > td:not(.dx-focused).dx-treelist-group-space,
.dx-rtl .dx-treelist-rowsview .dx-selection.dx-row > tr > td:not(.dx-focused).dx-treelist-group-space,
.dx-rtl .dx-treelist-rowsview .dx-selection.dx-row:hover > td:not(.dx-focused).dx-treelist-group-space,
.dx-rtl .dx-treelist-rowsview .dx-selection.dx-row:hover > tr > td:not(.dx-focused).dx-treelist-group-space {
    border-left-color: rgba(var(--skylight-rgb), .3);
}

.dx-treeview .dx-scrollable-container {
    padding: 10px
}

.dx-state-focused > .dx-treeview-item,
.dx-state-selected:not(.dx-state-focused) > .dx-treeview-item.dx-state-hover {
    background-color: rgba(0, 0, 0, .1);
    color: var(--slate);
}

.dx-state-selected > .dx-treeview-item {
    background-color: var(--cogency-blue);
    color: white;
}

.dx-treeview-search {
    margin: 10px;
}

.dx-treeview-with-search > .dx-scrollable .dx-scrollable-container {
    padding-top: 0;
}

/* =====================================================
	                DevEx Accordion
======================================================== */

.dx-accordion-item-title {
    color: var(--slate);
    padding: 5px 0 0 0;
}

.dx-accordion-item:last-child, .dx-accordion-item {
    border: none;
}

.dx-state-focused.dx-accordion-item {
    border-color: var(--cogency-blue);
}

.dx-accordion-item-title:before {
    content: "\f014";
}

.dx-accordion-item.dx-state-hover > .dx-accordion-item-title {
    background-color: transparent;
}

.dx-accordion-item-opened > .dx-accordion-item-title:before {
    content: "\f016";
}

/* =====================================================
	        DevExtreme Loading / Progress Bar
======================================================== */
.dx-loadpanel-message {
  padding-top: 10px;
}

.dx-progressbar-container {
    margin-top: 10px;
}

.dx-progressbar-status {
  width: 100%;
  margin-top: 10px;
  text-align: center;
}

/* === Branded Loading Indicator Styles === */

.loadmodal .dx-popup-content {
  text-align: center;
  font-size: var(--14px);
}

.loadmodal .animated-loading-wrapper {
  margin-block: 20px;
}

.long-loading-container {
  background-color: white;
  width: 400px;
  text-align: center;
  font-size: var(--14px);
}

.long-loading-container .image-wrapper {
  margin-block-start: 40px;
  margin-block-end: 25px;
  height: 41px;
}

.long-loading-container .image-wrapper embed {
  width: 35px;
  display: inline-block;
  animation-name: grow;
  animation-duration: 7s;
  animation-iteration-count: infinite;
}

@keyframes grow {
  0% {
    transform: scale(1);
  }

  43% {
    transform: scale(2.2);
  }

  50% {
    transform: scale(2.2);
  }

  100% {
    transform: scale(1);
  }
}

/* =====================================================
	    DevExtreme Icon Overrides with FontAwesome
======================================================== */

.dx-dropdowneditor-icon:before {
    font-family: 'FontAwesome';
    content: '\f0d7';
}

.dx-datebox-calendar .dx-dropdowneditor-icon:before {
    font-family: 'FontAwesome';
    content: "\f073";
}

.dx-icon-column-chooser:before {
    font-family: 'FontAwesome';
    content: "\f0ce";
}

.dx-datagrid-export-button .dx-icon-export-excel-button:before, .dx-datagrid-export-button .dx-icon-export-to::before, .dx-icon-xlsxfile:before {
    font-family: 'FontAwesome';
    content: "\f1c3";
}

.dx-datagrid .dx-sort-up::before {
    font-family: 'FontAwesome';
    content: "\f176";
    padding: 0 3px;
}

.dx-datagrid .dx-sort-down:before {
    font-family: 'FontAwesome';
    content: "\f175";
    padding: 0 3px;
}

.dx-datagrid .dx-header-filter:before {
    font-family: 'FontAwesome';
    content: "\f0b0";
}

.dx-icon-close:before {
    font-family: 'FontAwesome';
    content: "\f00d";
}

.dx-icon-chevronleft:before {
    font-family: 'FontAwesome';
    content: "\f053";
}

.dx-icon-chevronright:before {
    font-family: 'FontAwesome';
    content: "\f054";
}

.dx-checkbox-checked .dx-checkbox-icon:before {
    font-family: 'FontAwesome';
    content: "\f00c";
}

.dx-toast-warning .dx-toast-icon:before,
.dx-toast-error .dx-toast-icon:before,
.dx-toast-info .dx-toast-icon:before,
.dx-toast-success .dx-toast-icon:before {
  padding-left: 10px;
  font-size: 2em;
  font-family: 'FontAwesome';
}

.dx-toast-warning .dx-toast-icon:before {
    content: "\f071";
}

.dx-toast-error .dx-toast-icon:before,
.dx-toast-error .dx-icon-close:before {
  color: var(--danger);
}

.dx-toast-info .dx-toast-icon:before,
.dx-toast-info .dx-icon-close:before {
  color: var(--bright-blue);
}

.dx-toast-success .dx-toast-icon:before,
.dx-toast-success .dx-icon-close:before {
  color: var(--success);
}

.dx-toast-error .dx-toast-icon:before {
    content: "\f06a";
}

.dx-toast-info .dx-toast-icon:before {
  content: "\f05a";
}

.dx-toast-success .dx-toast-icon:before {
  content: "\f058";
}

.dx-numberbox-spin-up-icon:before {
    font-family: 'FontAwesome';
    content: "\f0d8";
}

.dx-numberbox-spin-down-icon:before {
    font-family: 'FontAwesome';
    content: "\f0d7";
}

.dx-icon-clear:before {
    font-family: 'FontAwesome';
    content: "\f057";
}

.dx-accordion-item-title:before {
    font-family: 'FontAwesome';
    content: "\f078";
}

.dx-accordion-item-opened > .dx-accordion-item-title:before {
    font-family: 'FontAwesome';
    content: "\f077";
}

.dx-searchbox .dx-icon-search:before {
    font-family: 'FontAwesome';
    content: "\f002";
}

.dx-datagrid-save-button .dx-icon-edit-button-save:before {
    font-family: 'FontAwesome';
    content: "\f0c7";
}

.dx-datagrid-cancel-button .dx-icon-edit-button-cancel:before {
    font-family: 'FontAwesome';
    content: "\f0e2";
}

.dx-icon-spindown:before {
    font-family: 'FontAwesome';
    content: "\f0d7";
}

.dx-icon-spindown {
    margin-top: -2px;
}

.dx-icon-trash:before {
  font-family: 'FontAwesome';
  content: "\f1f8";
}

.dx-icon-upload:before {
  font-family: 'FontAwesome';
  content: "\f093";
}