/*Override the checkbox style*/
.e-check {
    color: white !important;
    background-color: var(--mid-blue) !important;
}

/*#region Accordion header and collapse button*/
/*Override accordion header */
.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state > .e-acrdn-header,
.e-accordion .e-acrdn-item.e-select.e-expand-state > .e-acrdn-header {
    background-color: #f7f7f7;
    color: black;
}

.e-acrdn-header-content{
    color:var(--mid-blue) !important;
}

.e-accordion .e-acrdn-item .e-acrdn-header .e-toggle-icon {
    display: table;
    font-size: 1rem;
    height: 3rem;
    min-height: 38px;
    min-width: 22px;
    position: absolute;
    /*transform: rotate(90deg);*/
    top: 0;
    font-weight: bold;
    color: black;
    left: 0.5rem;
}

div.e-acrdn-header-content > div {
    color: black;
    font-weight: bolder;
    margin-left: 1rem;
}

/*Need to remove the overflow from the accordion, this is messing with the dropdowns, you cant use position absolute if this is set*/
.e-accordion .e-acrdn-item.e-selected.e-select.e-active .e-acrdn-panel,
.e-accordion .e-acrdn-item.e-selected.e-select.e-active .e-acrdn-panel .e-acrdn-content > *,
.e-accordion .e-acrdn-item.e-selected.e-select.e-active .e-acrdn-panel .e-acrdn-content {
    overflow: unset;
}

/*Expand */
.e-accordion .e-tgl-collapse-icon.e-expand-icon {
    transform: rotate(360deg);
    font-weight: bold;
}

/*Collapse*/
.e-accordion .e-tgl-collapse-icon:not(.e-expand-icon) {
    transform: rotate(270deg);
    font-weight: bold;
}

.e-accordion .e-acrdn-item.e-selected.e-select > .e-acrdn-header {
    background: inherit;
}

/*#endregion*/

/*Override select selected text value*/
.e-ddl > .e-input-value {
    padding: .3em;
}

/*#region buttons*/
/*Buttons with class e-flat  add hover effect */

/*@keyframes colorChange {*/
/*    0% {*/
/*        border-color: #004463;*/
/*    }*/
/*    25% {*/
/*        border-color: #4fa9d1;*/
/*    }*/
/*    50% {*/
/*        border-color: #007cb4;*/
/*    }*/
/*    75% {*/
/*        border-color: #002f51;*/
/*    }*/
/*    100% {*/
/*        border-color: #004463;*/
/*    }*/
/*}*/

/*.e-flat:not([disabled]):hover,*/
/*.e-flat:not([disabled]):focus{*/
/*    color:initial!important;*/
/*    background: inherit!important;*/
/*    border: .1em solid transparent;*/
/*    box-shadow: 0 0 0 1px rgba(130,138,145,.5)!important;*/
/*    animation: colorChange 3s linear infinite;*/
/*}*/

/*.e-footer-content .e-btn.e-flat:not([DISABLED]),*/
/*.e-btn.e-flat:disabled,*/
/*.e-control.e-btn.e-lib.e-flat.e-flat.e-filter-popup.e-excelfilter,*/
/*.e-footer-content .e-control.e-btn.e-lib.e-flat.e-flat*/
/*{*/
/*    color:inherit;*/
/*    background:inherit;*/
/*    border: .1em solid transparent;*/
/*    min-height: 1.7rem;*/
/*}*/

/*.e-control.e-btn.e-lib.e-flat.e-flat.e-filter-popup.e-excelfilter:hover,*/
/*.e-footer-content .e-control.e-btn.e-lib.e-flat.e-flat:hover*/
/*{*/
/*    color:initial!important;*/
/*    background: inherit!important;*/
/*    border: .1em solid transparent;*/
/*    box-shadow: 0 0 0 1px rgba(130,138,145,.5)!important;*/
/*    animation: colorChange 3s linear infinite;*/
/*}*/

/*OLD*/
/*
.e-btn.e-flat:hover, .e-css.e-btn.e-flat:hover,
.e-upload .e-upload-browse-btn:hover,
.e-file-upload-btn .e-css .e-btn .e-flat .e-primary:hover,
.e-btn.e-flat.e-primary:hover, .e-css.e-btn.e-flat.e-primary:hover,
.e-btn.e-flat.e-primary:active:hover,
.e-btn.e-flat.e-primary.e-active:hover,
.e-css.e-btn.e-flat.e-primary:active:hover,
.e-css.e-btn.e-flat.e-primary.e-active:hover,
.e-btn.e-flat:focus, .e-css.e-btn.e-flat:focus{
  background: inherit;
  border: none;
}

.e-contextmenu-wrapper ul .e-menu-item .e-menu-url,
.e-contextmenu-container ul .e-menu-item .e-menu-url,
.e-btn.e-flat, .e-css.e-btn.e-flat,
.e-btn.e-flat:active,
.e-btn.e-flat:focus,
.e-footer-content .e-btn.e-flat:not([DISABLED]),
.e-upload .e-file-select-wrap .e-btn, .e-upload .e-upload-actions .e-btn, .e-bigger.e-small .e-upload .e-file-select-wrap .e-btn, .e-bigger.e-small .e-upload .e-upload-actions .e-btn,
.e-file-upload-btn .e-css .e-btn .e-flat .e-primary,
.e-btn.e-flat.e-primary,
.e-css.e-btn.e-flat.e-primary,
.e-btn.e-flat.e-primary:active,
.e-btn.e-flat.e-primary.e-active,
.e-css.e-btn.e-flat.e-primary:active,
.e-css.e-btn.e-flat.e-primary.e-active,
.e-btn.e-flat.e-primary:focus, .e-css.e-btn.e-flat.e-primary:focus,
.e-btn.e-flat.e-primary:disabled, .e-css.e-btn.e-flat.e-primary:disabled,
.e-btn.e-flat:focus, .e-css.e-btn.e-flat:focus
{
  background: none;
  box-shadow: none;
  border: none;
  padding-bottom: 4px;
  background-image: linear-gradient(#000 0 0);
  background-position: 0 100%; 
  background-size: 0% 2px;
  background-repeat: no-repeat;
  transition: background-size 0.3s,
  background-position 0s 0.3s; 
}

.e-contextmenu-wrapper ul .e-menu-item .e-menu-url:hover,
.e-contextmenu-container ul .e-menu-item .e-menu-url:hover,
.e-btn.e-flat:hover,
.e-css.e-btn.e-flat:hover,
.e-footer-content .e-btn:hover.e-flat:not([DISABLED]):hover,
.e-upload .e-upload-browse-btn:hover,
.e-file-upload-btn .e-css .e-btn .e-flat .e-primary:hover,
.e-btn.e-flat.e-primary:hover,
.e-css.e-btn.e-flat.e-primary:hover,
.e-btn.e-flat.e-primary:active:hover,
.e-btn.e-flat.e-primary.e-active:hover,
.e-css.e-btn.e-flat.e-primary:active:hover,
.e-css.e-btn.e-flat.e-primary.e-active:hover,
.e-btn.e-flat:focus, .e-css.e-btn.e-flat:focus{
  background-position: 100% 100%!important; 
  background-size: 100% 2px;
  background-image: linear-gradient(var(--mid-blue) 0 0);
  background-repeat: no-repeat;
  color: inherit;
}

.e-footer-content .e-btn:hover.e-flat:not([DISABLED]):hover {
  background: none;
  background-position: 100% 100%!important;
  background-size: 100% 2px;
  background-image: linear-gradient(var(--mid-blue) 0 0);
  background-repeat: no-repeat;
  color: var(--mid-blue) !important;
}

//Upload button
.e-upload .e-upload-browse-btn {
  color: var(--mid-blue) !important;
}

.e-btn.e-flat.e-primary:focus, .e-css.e-btn.e-flat.e-primary:focus,
.e-btn.e-flat.e-primary:disabled, .e-css.e-btn.e-flat.e-primary:disabled {
  color: black;
}
*/

/*#endregion*/

/*.e-btn.e-flat:disabled, .e-css.e-btn.e-flat:disabled {*/
/*    background: inherit;*/
/*    opacity: .5;*/
/*}*/

/*.e-btn.e-flat:disabled:hover,*/
/*.e-css.e-btn.e-flat:disabled:hover {*/
/*    background: inherit;*/
/*}*/

/*.e-btn.e-flat {*/
/*    width: auto;*/
/*}*/
/*.e-btn.e-flat label:hover{*/
/*    cursor: pointer;*/
/*}*/

/*#endregion*/

/*#region splitter*/
#split-main-container .e-pane.e-pane-horizontal {
    overflow: hidden;
}

/* default split bar color */
.e-splitter .e-split-bar.e-split-bar-horizontal {
    background-color: var(--light-grey);
}

.e-splitter .e-split-bar.e-split-bar-horizontal:not(.e-resizable-split-bar) {
    background-color: var(--top-bar-red);
}

/* split bar color in hover and active state */
.e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-hover,
.e-splitter .e-split-bar.e-split-bar-horizontal.e-split-bar-active {
    background-color: var(--light-grey);
}

/* default split bar resize handle color */
.e-splitter .e-split-bar.e-split-bar-horizontal .e-resize-handler {
    height: 3rem;
    width: 1rem !important;
    visibility: visible !important;
}

/*#endregion*/

/*#region  treeview*/

/*Override the selected state color*/
.e-treeview .e-list-item.e-active > .e-fullrow,
.e-treeview .e-list-item.e-active > .e-fullrow:hover {
    color: white;
    background-color: var(--mid-blue);
}

.e-splitter .e-split-bar.e-split-bar-horizontal.e-resizable-split-bar,
.e-splitter .e-split-bar.e-split-bar-horizontal.e-resizable-split-bar::after {
    cursor: e-resize;
}

.e-treeview .e-list-item.e-active.e-hover > .e-fullrow, .e-treeview .e-list-item.e-active.e-node-focus > .e-fullrow {
    color: white;
    background-color: var(--mid-blue);
}

/*#endregion*/

/*#region  Badge*/
.e-badge.e-badge-primary:not(.e-badge-ghost):not([href]), .e-badge.e-badge-primary[href]:not(.e-badge-ghost) {
    background-color: var(--mid-blue);
}

/*#endregion*/

/*#region  Toast*/
.e-toast-container .e-toast .e-toast-progress {
    background-color: var(--mid-blue);
}

/*#endregion*/

/*#region  tooltip*/
.e-tip-content:has(.cevi-tooltip) {
    padding: 0;
    overflow-x: hidden;
    color: black;
}

.e-tooltip-wrap.e-popup:has(.cevi-tooltip) {
    padding: .8rem;
    font-size: .8rem;
    display: inline-block;
    border-radius: 10px;
    width: 100% !important;
    z-index: 1002;
    filter: drop-shadow(rgba(0, 0, 0, 0.3) 0 2px 10px);
    box-shadow: rgba(0, 0, 0, 0.3) 0 2px 10px;
    background: linear-gradient(135deg,
    rgba(220, 220, 220, 0.8),
    rgba(240, 240, 240, 0.7));
    color: black;
    border: 1px solid rgba(255, 255, 255, 0.75);
    backdrop-filter: blur(10px);
    animation: fadeIn 500ms;
}

/*#endregion*/

.e-grid .e-focused:not(.e-menu-item) {
    box-shadow: none!important;
    -webkit-user-select: none; /* Safari */
    -ms-user-select: none; /* IE 10 and IE 11 */
    user-select: none; /* Standard syntax */
}

/*Dropdown set ellipsis when the text is to long for the dropdown*/
.e-ddl.e-input-group .e-input-value {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.e-tab .e-tab-header .e-toolbar-item .e-icons.e-tab-icon::before{
    display: none;
}

.no-margin-label {
    margin-bottom: 0;
}

/*#region buttons*/
/*FAB Button override class */

.e-fab.e-btn,
.e-fab.e-btn:active,
.e-fab.e-btn:focus-visible,
.e-fab.e-btn:focus
{
    bottom: 0 !important;
    left: 0 !important;
    min-height: 1.5rem!important;
    color:inherit;
    position: relative;
    background: none;
    box-shadow: none;
    border: none;
    padding:0;
    background-image: linear-gradient(#000 0 0);
    background-position: 0 100%;
    /*OR bottom left*/
    background-size: 0% 2px;
    background-repeat: no-repeat;
    transition: background-size 0.3s, background-position 0s 0.3s;
    z-index: inherit;
    /*change after the size immediately*/
}

.e-fab.e-btn:hover{
    background: inherit!important;
    border: none;
    box-shadow:inherit!important;
}

.e-fab.e-btn:hover,
.e-fab.e-btn:active,
.e-fab.e-btn:focus-visible{
    background-position: 100% 100%!important;
    background-size: 100% 2px!important;
    background-image: linear-gradient(var(--mid-blue) 0 0)!important;
    background-repeat: no-repeat!important;
    color: inherit;
}

.e-speeddial-popup{
    z-index: 100 !important;
    background: #f8f9fa;
    pointer-events: auto;
    border-radius: 4px;
    border:1px solid lightgray;
    box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.68);
    -webkit-box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.68);
    -moz-box-shadow: 0 0 5px -2px rgba(0, 0, 0, 0.68);
}

.e-speeddial-li{
    z-index: 100 !important;
}

.e-speeddial-li-icon{
    background: inherit!important;
}

.e-speeddial-li-text{
    box-shadow: none!important;
    border: none!important;
    background: inherit!important;
}

.e-speeddial-li:hover .e-speeddial-li-text,
.e-speeddial-li-icon:hover,
.e-speeddial-popup .e-speeddial-li:not(.e-disabled):hover{
    color: var(--mid-blue);
}

.e-speeddial-li-text
{
    background: none!important;
    box-shadow: none!important;
    border: none!important;
    padding-bottom: 10px!important;
    background-image: linear-gradient(#000 0 0, transparent)!important;
    background-position: 0 100%!important;
    background-size: 0 2px!important;
    background-repeat: no-repeat!important;
    transition: background-size 0.3s, background-position 0s 0.3s!important;
    color: inherit!important;
}

.e-speeddial-li:hover .e-speeddial-li-text,
.e-speeddial-li-text:hover,
.e-speeddial-li-icon:hover
{
    background-position: 0 100%!important;
    background-size: 100% 2px!important;
    background-image: linear-gradient(var(--mid-blue) 0 0)!important;
    background-repeat: no-repeat!important;
    color: var(--mid-blue) !important;
    background-color: inherit!important;
}

