.docs-search-bar .mud-input {
    height: 42px;
}

.docs-search-bar.mud-input-control {
    background-color: rgba(255, 255, 255, .15);
    margin-bottom: 5px;
    height: 42px;
    border-radius: var(--mud-default-borderradius);
}

    .docs-search-bar.mud-input-control .mud-input-root, .docs-search-bar.mud-input-control .mud-icon-default {
        color: #fafafa;
    }

.docs-search-bar .mud-input.mud-input-outlined .mud-input-outlined-border {
    border: none;
    border-radius: var(--mud-default-borderradius);
}

.docs-search-bar .mud-icon-button-label {
    color: white;
}

.mudblazor-appbar-band {
    background-repeat: no-repeat;
    background-position: top right;
    overflow: hidden;
}

.mudblazor-appbar-band-dev {
    background-image: url(../img/AppBarCornerDev.svg) !important;
}

.mudblazor-appbar-band-test {
    background-image: url(../img/AppBarCornerTest.svg) !important;
}

.mudblazor-appbar-band-staging {
    background-image: url(../img/AppBarCornerStaging.svg) !important;
}

.mudblazor-appbar-band-production {
    background-image: url(../img/AppBarCorner.svg) !important;
}

.color-white {
    color: white;
}
/*change cursor to hand*/
.cursor-hand {
    cursor: pointer;
}

.cursor-text {
    cursor: text;
}

.cursor-normal {
    cursor: default;
}

.text-break {
    word-break: break-all;
}

.text-break-word {
    word-break: break-word;
}

*[id] {
    scroll-margin-top: 150px;
}

.title-tooltip {
    max-width: 60vw;
}

.position-relative {
    position: relative;
}

.tile-badge {
    position: absolute;
    top: -7px;
    right: -12px;
}

.background-tile {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.display-above-tile {
    z-index: 2;
}

.width-250 {
    width: 250px;
}

.width-170 {
    width: 170px;
}

.dashboard-custom-component {
    min-height: 120px;
    height: 100%;
}

.dashboard-custom-tile-icon {
    width: 54px;
    height: 54px;
}

.red-strong-title {
    color: #F44336;
}

.orange-strong-title {
    color: #FF9800;
}

.custom-warning-orange-color {
    color: #FFA726;
}

.scrollable-dialog {
    max-height: 450px;
    overflow-y: scroll;
}

.dashboard-chart .mud-chart-pie {
    max-width: 200px;
    max-height: 200px;
}

.custom-table .mud-table-container {
    overflow-x: unset !important;
}

.mud-chip-transparent {
    background-color: transparent !important;
}

.hover-highlight:hover {
    outline: 1px solid grey;
}

@media only screen and (max-width: 768px) {
    .title-tooltip {
        max-width: 35vw;
    }
}