/*BEGIN Dashboard*/
.e-dashboardlayout {
    padding: 10px;
}

.e-panel-header {
    padding: 10px;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, .03);
}


.panel-content {
    vertical-align: middle;
    font-size: 15px;
    font-size: 15px;
    font-weight: 500;   
}

.e-panel-content {
    height: calc(100% - 28px);
    width: 100%;
    display: block;
}

.e-panel .e-header-text {
    padding: 12px 0 12px 0;
}

.e-dashboardlayout.e-control .e-panel .e-panel-header {
    font-size: 15px;
    font-weight: 500;
    height: 37px;
    line-height: 30px;
    padding: 10px;
    vertical-align: middle;
    border-bottom: 0.5px solid #e3e3e3;
}

.mobile .e-control.e-lib.e-dashboardlayout.e-responsive {
    z-index: 0;
    overflow: scroll;
}

.e-control.e-lib.e-dashboardlayout.e-responsive {
    z-index: 0;
}

.bootstrap5 .e-dashboardlayout.e-control .e-panel .e-panel-header,
.bootstrap5-dark .e-dashboardlayout.e-control .e-panel .e-panel-header {
    line-height: 20px;
}
/*END Dashboard*/


/*Progress Message*/
.progress-text::after {
    content: var(--progress-message, "Starting...");
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: black;
    font-weight: bold;
}

.loading-progress {
    position: relative;
    display: block;
    width: 8rem;
    height: 8rem;
    margin: 20vh auto 1rem auto;
}

    .loading-progress circle {
        fill: none;
        stroke: #e0e0e0;
        stroke-width: 0.6rem;
        transform-origin: 50% 50%;
        transform: rotate(-90deg);
    }

        .loading-progress circle:last-child {
            stroke: #1b6ec2;
            stroke-dasharray: calc(3.141 * var(--blazor-load-percentage, 0%) * 0.8), 500%;
            transition: stroke-dasharray 0.05s ease-in-out;
        }

.loading-progress-text {
    /*position: absolute;*/
    text-align: center;
    font-weight: bold;
    inset: calc(20vh + 3.25rem) 0 auto 0.2rem;
}

    .loading-progress-text:after {
        content: var(--blazor-load-percentage-text, "Loading");
    }

/*Linear progress*/
.linear-progress {
    background: silver;
    width: 50vw;
    margin: 20% auto;
    height: 1rem;
    border-radius: 10rem;
    overflow: hidden;
    position: relative;
}

    .linear-progress:after {
        content: '';
        position: absolute;
        inset: 0;
        background: #1b6ec2;
        scale: var(--blazor-load-percentage, 0%) 100%;
        transform-origin: left top;
        transition: scale ease-out 0.5s;
    }

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}






.gridLink {
    text-decoration: underline !important;
    cursor: pointer !important;
}

    .gridLink:hover {
        cursor: pointer !important;
    }

table.k-grid-table td a.gridLink {
    color: #58a6ff !important;
    text-decoration: underline !important;
}

a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
    color: #58a6ff !important;
}
/* Enter custom CSS rules for your application here */
.panel .panel-container .panel-content {
    /* padding: 1rem 1rem; */
    padding: 0rem 0rem;
}

.voffset1 {
    margin-top: 5px;
}

.voffset2 {
    margin-top: 10px;
}

.voffset3 {
    margin-top: 20px;
}

.voffset4 {
    margin-top: 40px;
}

.hidden {
    display: none;
}

.mod-skin-dark:not(.mod-skin-light) .panel-hdr, .mod-skin-dark:not(.mod-skin-light) .accordion:not(.accordion-clean) .card .card-header {
    background-color: #1a1b1d;
}

.alertInElement {
    margin-bottom: 0rem !important;
}

.k-popup.k-reset {
    transition: none !important;
    /* to just make animations faster than normal use the following line INSTEAD */
    /* transition-duration: 100ms !important; */
}

.vh-50 {
    height: 50vh;
}

.vh-40 {
    height: 40vh;
}

.flexibleContent {
    flex: 1 1 auto
}

.flexibleHeader {
    flex: 0 1 auto;
}

.indentedTab {
    padding-left: 10px;
}



.blazored-toast-container {
    display: flex;
    flex-direction: column;
    position: fixed;
    z-index: 999;
}

.position-topleft {
    top: 3rem;
    left: 2rem;
}

.position-topright {
    top: 3rem;
    right: 2rem;
}

.position-topcenter {
    top: 3rem;
    left: 50%;
    transform: translate(-50%, 0%);
}

.position-bottomleft {
    bottom: 2rem;
    left: 2rem;
}

.position-bottomright {
    bottom: 2rem;
    right: 2rem;
}

.position-bottomcenter {
    bottom: 2rem;
    left: 50%;
    transform: translate(-50%, 0%);
}

.blazored-toast {
    width: 30rem;
    border-radius: .25rem;
}

.blazored-toast {
    display: flex;
    position: relative;
    flex-direction: row;
    animation: fadein 1.5s;
    margin-bottom: 1rem;
    /*padding: 1rem 1.25rem;*/
    padding: 1rem .25rem 1rem 1.25rem;
    color: #1D1D1B;
    /*  width: 20rem;*/
    border-radius: .25rem;
    box-shadow: rgba(0,0,0,0.30) 0px 10px 30px 2px;
    background-color: #fff;
    border-top: 6px solid #fff;
}

.blazored-toast-component {
    display: initial;
    padding: 0 0 0 0;
    border-top: none;
}

.blazored-toast-info {
    border-top: 6px solid #2563eb;
}

    .blazored-toast-info .blazored-toast-icon {
        color: #2563eb;
    }

.blazored-toast-success {
    border-top: 6px solid #16a34a;
}

    .blazored-toast-success .blazored-toast-icon {
        color: #16a34a;
    }

.blazored-toast-warning {
    border-top: 6px solid #eab308;
}

    .blazored-toast-warning .blazored-toast-icon {
        color: #eab308;
    }

.blazored-toast-error {
    border-top: 6px solid #dc2626;
}

    .blazored-toast-error .blazored-toast-icon {
        color: #dc2626;
    }

.blazored-toast-icon {
    display: flex;
    flex-direction: column;
    justify-content: start;
    padding: 0 1rem 0 0;
    font-size: 1.5rem;
}

.blazored-toast .blazored-toast-message {
    flex-grow: 1;
    margin-bottom: 0;
    font-weight: 500;
    font-size: 0.875rem;
    overflow-wrap: break-word;
    word-wrap: break-word;
    word-break: break-word;
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}

.blazored-toast .blazored-toast-close {
    display: flex;
    flex-direction: column;
    justify-content: start;
    /* padding: 0 0 0 1rem;*/
    background-color: transparent;
    border: 0;
    -webkit-appearance: none;
    color: #94a3b8;
    font-size: 0.9rem;
}

    .blazored-toast .blazored-toast-close:hover {
        color: inherit;
    }

.blazored-toast .blazored-toast-progressbar {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 6px;
    border-bottom-left-radius: .375rem;
    border-bottom-right-radius: .375rem;
}

    .blazored-toast .blazored-toast-progressbar > span {
        position: absolute;
        filter: brightness(75%);
        height: 6px;
        border-bottom-left-radius: .375rem;
        background-image: linear-gradient(rgba(0, 0, 0, 0.1) 0 0);
        transition: all .1s linear;
    }

.blazored-toast-action {
    cursor: pointer;
}

@keyframes fadein {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}


.heightCap450 {
    max-height: 450px;
}

.fillRemainingHeight {
    height: calc(100vh - 210px);
}

.footer {
    position: fixed;
    height: 100px;
    bottom: 0;
    width: 100%;
}

.checkboxLabel{
    vertical-align: middle;
}

.loading-splash{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 10000;
    background-color: #fff;
}

.boldRow {
    font-weight: bold !important;
}

.e-row.boldRow > td.e-active {
    font-weight: bold !important;
}

.e-confirm-dialog.e-primary {
    float: right;
}

.grid-goal-property {
    font-weight: bold;
}

#Grid table.e-table > tbody > tr.grid-row-goal-alert td {
    background-color: rgb(from var(--bs-success) r g b / 0.3);
}

#Grid table.e-table > tbody > tr.grid-row-goal-alert:hover td {
    background-color: rgb(from var(--bs-success) r g b / 0.5);
}

#Grid table.e-table > tbody > tr.grid-row-threshold-alert {
    background-color: rgb(from var(--bs-danger) r g b / 0.3);
}

#Grid table.e-table > tbody > tr.grid-row-threshold-alert:hover td {
    background-color: rgb(from var(--bs-danger) r g b / 0.5);
}

.report-subheading {
    color: var(--bs-heading-color);
    opacity: .5;
}

.panel-content-toolbar {
    border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}

/*Dashboard Widgets - BEGIN*/

e-tooltip-wrap .e-arrow-tip.e-tip-bottom {
    display: none;
}

/* To customize the arrow tip at top */
.e-tooltip-wrap .e-arrow-tip.e-tip-top {
    display: none;
}

/* To customize the arrow tip at left */
.e-tooltip-wrap .e-arrow-tip.e-tip-left {
    display: none;
}

/* To customize the arrow tip at right */
.e-tooltip-wrap .e-arrow-tip.e-tip-right {
    display: none;
}


.e-btn:hover {
    background-color: #0b6a0b;
}


.noBorderButton {
    border: none !important;
}

.menuPopupButton {
    width: 100%;
    border-radius: 0 !important;
    text-align: left;
}

.noBorderButton:hover {
    background: var(--primary-300) !important;
    color: white;
}

.menuCloseButton:hover {
    background: var(--primary-300) !important;
    color: white;
}

.menuPopupButton:hover {
    width: 100%;
    border-radius: 0 !important;
}

.menuPopupButtonDiv:hover {
    background: var(--primary-300);
    color: white;
}

.menuPopupButtonDiv:hover {
    background: var(--primary-300);
    color: white;
}

.menuPopupButtonDiv:hover {
    background: var(--primary-300);
    color: white;
}

.menuPopupButtonDiv .fa-duotone {
    --fa-primary-color: var(--bs-primary);
    --fa-secondary-color: var(--bs-primary-200);
}

    .menuPopupButtonDiv .fa-duotone :hover {
        --fa-primary-color: white;
        --fa-secondary-color: white;
    }

.menuPopupButtonDiv:hover .fa-duotone {
    --fa-primary-color: white;
    --fa-secondary-color: white;
}

.menuPopupButtonDiv .fa-regular {
    color: var(--bs-primary);
}

    .menuPopupButtonDiv .fa-regular :hover {
        color: white;
    }

.menuPopupButtonDiv:hover .fa-regular {
    color: white;
}

.widgetHeaderIcon-Green {
    color: green;
}

.widgetHeaderIcon-Blue {
    color: deepskyblue;
}

/*Dashboard Widgets - END*/