html, body, #app {
    width: 100%;
    height: 100%
}

.main-container {
    display: flex !important;
    flex-direction: column !important
}

.mud-table-dense * .mud-table-row .mud-table-cell {
    padding: 6px 0px 6px 0px !important;
    pointer-events: auto;
    /*pointer-events: none;*/
    /*margin: 6px 6px 6px 4px;*/
    padding-inline-start: 6px !important;
    padding-inline-end: 4px !important;
    font: 400 14px/16px Roboto,sans-serif
}

.mud-table-row {
    display: table-row !important;
    justify-content: space-evenly !important
}

.mud-table-cell {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    user-select: none;
    -webkit-user-select: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none
}

.fit-grid {
    height: 100%;
    display: flex !important;
    flex-flow: column !important
}

.maxHeight{
    height:100%
}

.fit-grid .mud-table-container {
    /*flex-grow: 1 !important*/
    overflow: auto !important;
    width: 100% !important;
}

@media(min-width:2560px) {
    .mud-container-maxwidth-xxl {
        max-width: 100% !important
    }
}

.grid-selected {
    background-color: var(--mud-palette-primary-hover) !important
}

.grid-selected > td {
    color: var(--mud-palette-primary) !important
}

.grid-selected > td .mud-input {
    color: var(--mud-palette-primary) !important
}

.grid-selection > td {
    color: var(--mud-palette-primary) !important;
}

.item-disabled {
    font-style: italic !important
}

.item-disabled:not(.grid-selected) {
    color: var(--mud-palette-text-disabled) !important
}

.item-disabled:not(.grid-selected) .mud-table-cell {
    color: var(--mud-palette-text-disabled) !important
}

.cancel-loading {
    opacity: 0;
    animation: opacityOn 2s normal 5s forwards step-end;
    animation-timing-function: ease-in
}

@keyframes opacityOn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.fixed-tooltip-position {
    position: fixed
}

.mud-popover {
    position: fixed !important
}

.grid-summary-footer .mud-table-row .footer-cell {
    background-color: var(--mud-palette-dark) !important;
    color: var(--mud-palette-dark-text)
}

th button.filtered svg {
    fill: var(--mud-palette-primary) !important
}

.max-item-size-300 .mud-grid-item {
    max-width: 300px
}

.min-item-size-120 .mud-grid-item {
    min-width: 120px
}

.min-item-size-140 .mud-grid-item {
    min-width: 140px
}

.core-team-1 td {
    color: #002fff !important;
    color: var(--mud-palette-info-darken) !important
}

.core-team-2 td {
    color: #2fb441 !important;
    color: var(--mud-palette-success-darken) !important
}

.rowcolor-over td {
    color: #f00 !important
}

.rowdata-undefined {
    font-style: italic;
    color: #8d8d8d
}

.rowcolor-over .rowdata-undefined {
    color: #f00 !important
}

.mud-input {
    font-size: .875rem !important
}

.mud-input-label {
    font-size: .805rem !important;
    line-height: 16px !important
}

.mud-checkbox p {
    font-size: .875rem !important
}

.mud-toolbar.mud-toolbar-gutters.mud-picker-toolbar.mud-theme-primary.mud-picker-timepicker-toolbar {
    max-width: unset !important
}

td button svg {
    font-size: 1rem !important
}

.mud-table-cell-custom-group {
    font-weight: 500
}

.mud-table-cell-custom-group-footer {
    padding-bottom: 50px;
    text-align: right
}

.floating-update-button {
    position: fixed;
    right: 2rem;
    bottom: 2rem;
    padding: 1rem 1.5rem;
    animation: fadein 2s ease-out;
    background-color: var(--mud-palette-primary);
    border-radius: 3px;
    z-index: 9999
}

@keyframes fadein {
    from {
        right: -100%
    }

    to {
        right: 2rem
    }
}

.fieldcontainer .mud-input-slot {
    padding: 4.825px 8px 4.825px 8px !important;
    height: unset !important;
    min-height: unset !important
}

.mud-tab {
    text-transform: none !important
}

.mud-disabled.autohide-tabitem {
    display: none !important
}

.mud-tab-active.autohide-tabitem {
    border-bottom: 2px solid var(--mud-palette-primary)
}

.table-menu-options {
    cursor: pointer;
    font-weight: bold;
    font-style: italic;
    box-shadow: black 1px
}

.table-menu-options .options {
    opacity: 0
}

.table-menu-options:hover .options {
    animation: 1s fadeIn;
    animation-fill-mode: forwards
}

@keyframes fadeIn {
    0% {
        opacity: 0
    }

    100% {
        opacity: 100
    }
}

.sticky-groupheader th:first-child {
    position: sticky;
    top: 40px;
    width: 100%
}

.mark-text-red {
    color: var(--mud-palette-primary) !important
}

.contextmenu {
    min-width: 200px
}

    .contextmenu svg {
        color: var(--mud-palette-primary) !important
    }

.customchipset .mud-chipset {
    max-width: 90% !important;
    width: -moz-available !important;
    width: -webkit-fill-available !important
}

.customchipset .mud-shrink input {
    max-width: 80px !important;
    padding-left: 2px !important;
    padding-right: 0 !important;
    border-left: solid 1px var(--mud-palette-primary)
}

.OverLayMaxHeight .mud-overlay-content {
    height: 100%
}

.MyInvisibleClass {
    display: none !important;
}
.fixedTableWidth table{
    table-layout:fixed
}

:root {
    --aproved-row-bgcolor: #eafce2;
    --aproved-row-bgcolor-odd: #defcd2;
    --warning1-row-bgcolor: #fffddd;
    --warning1-row-bgcolor-odd: #fffcc1;
    --warning2-row-bgcolor: #ffe4c6;
    --warning2-row-bgcolor-odd: #ffd5a7;
    --tablerow-hover: var(--mud-palette-action-default-hover)
}

.dark {
    --aproved-row-bgcolor: rgb(51,183,13,.15);
    --aproved-row-bgcolor-odd: rgb(51,183,13,.18);
    --warning1-row-bgcolor: rgb(255,242,0,.15);
    --warning1-row-bgcolor-odd: rgb(255,242,0,.18);
    --warning2-row-bgcolor: rgb(251,71,3,.15);
    --warning2-row-bgcolor-odd: rgb(251,71,3,.18);
    --tablerow-hover: var(--mud-palette-dark-lighten)
}
.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");
    }