* {
    transition: all ease-in-out 250ms;
}

@keyframes scale-in {
    from {
        transform: scale(0.5);
        opacity: 0;
    }

    to {
        transform: scale(1);
        opacity: 1;
    }
}

.h-100 {
    height: 100%;
}

.w-100 {
    width: 100%;
}

#content > .mud-toolbar {
    position: sticky;
    top: 0;
    z-index: 100;
    border-bottom: 1px solid var(--mud-palette-lines-default);
}

.text-right {
    text-align: right;
}

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

.text-secondary {
    color: var(--mud-palette-text-secondary);
}

.mud-disabled .text-secondary {
    color: var(--mud-palette-text-disabled);
}

.mud-alert-message {
    flex-grow: 1;
}

.mud-alert-outlined-normal {
    background-color: rgba(var(--mud-palette-text-primary-rgb), 0.1);
}

.mud-alert-outlined-primary {
    background-color: rgba(var(--mud-palette-primary-rgb), 0.1);
}

.mud-alert-outlined-secondary {
    background-color: rgba(var(--mud-palette-secondary-rgb), 0.1);
}

.mud-alert-outlined-tertiary {
    background-color: rgba(var(--mud-palette-tertiary-rgb), 0.1);
}

.mud-alert-outlined-info {
    background-color: rgba(var(--mud-palette-info-rgb), 0.1);
}

.mud-alert-outlined-success {
    background-color: rgba(var(--mud-palette-success-rgb), 0.1);
}

.mud-alert-outlined-warning {
    background-color: rgba(var(--mud-palette-warning-rgb), 0.1);
}

.mud-alert-outlined-error {
    background-color: rgba(var(--mud-palette-error-rgb), 0.1);
}

.mud-alert-outlined-dark {
    background-color: rgba(var(--mud-palette-dark-rgb), 0.1);
}

.nowrap {
    white-space: nowrap;
}

.truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.flex-0 {
    flex: 0 0 auto;
}

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.flip-horizontal {
    -moz-transform: scaleX(-1);
    -webkit-transform: scaleX(-1);
    transform: scaleX(-1);
    -ms-filter: "FlipH";
}

.flip-vertical {
    -moz-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    -ms-filter: "FlipV";
}

.hover-visibility-root {
    &:hover,
    &:focus-within,
    &.active,
    &:has(.mud-menu-activator[aria-expanded]),
    &:has(.mud-input-root[aria-expanded="true"]) {
        & .hover-root-show {
            display: inherit;
        }

        & .hover-root-hide {
            display: none !important;
        }
    }

    &:not(
        :hover,
        :focus-within,
        .active,
        :has(.mud-input-root[aria-expanded="true"]),
        :has(.mud-menu-activator[aria-expanded])
    ) {
        & .hover-root-show {
            display: none !important;
        }

        & .hover-root-hide {
            display: inherit;
        }
    }
}

.bg-transparent {
    background: transparent;
}

.bg-checkerboard {
    background: repeating-conic-gradient(var(--mud-palette-dark) 0 25%, var(--mud-palette-gray-lighter) 0 50%) 50% / 20px 20px;
}

.bg-light {
    background-color: var(--mud-palette-gray-lighter);
}

.bg-dark {
    background-color: var(--mud-palette-dark);
}

.bg-darker {
    background-color: var(--mud-palette-dark-darken);
}

.bg-light-darker-striped {
    background: linear-gradient(
        -45deg,
        var(--mud-palette-gray-lighter) 50%,
        var(--mud-palette-dark-darken) 50%
    );
}

.mud-border-divider {
    border-color: var(--mud-palette-divider);
}

.mud-toolbar .mud-button-root:disabled {
    color: var(--custom-palette-appbar-text-disabled) !important;
}

.mud-dialog-title {
    border-bottom: 1px solid var(--mud-palette-divider);
}

.mud-dialog-actions:not(:empty) {
    border-top: 1px solid var(--mud-palette-divider);
}

.mud-dialog .mud-dialog-content {
    background-color: var(--custom-palette-dialog-content);
    margin: 0;
    padding: 24px;
}

.mud-dialog-actions:empty {
    padding: 0;
}

.mud-link-underline-always .mud-typography {
    text-decoration: underline;
}

.mud-link-underline-hover:hover .mud-typography {
    text-decoration: underline;
}

.components-reconnect-dialog {
    background-color: var(--mud-palette-surface) !important;
}

.outline {
    outline: 1px solid var(--mud-palette-lines-default);
}

.outline-3px {
    outline-width: 3px;
}

.outline-surface {
    outline-color: var(--mud-palette-surface);
}

.bg-dark .outline-surface,
.outline-dark {
    outline-color: var(--mud-palette-dark);
}

.bg-darker .outline-surface,
.outline-darker {
    outline-color: var(--mud-palette-dark-darken);
}

.border-surface {
    border-color: var(--mud-palette-surface);
}

.bg-dark .border-surface,
.border-dark {
    border-color: var(--mud-palette-dark);
}

.bg-darker .border-surface,
.border-darker {
    border-color: var(--mud-palette-dark-darken);
}

#components-reconnect-modal {
    color: rgb(55 55 64);
}

.mud-main-content {
    padding-bottom: 24px;
}

.mud-paper > .mud-table:first-child,
.mud-paper > :first-child > .mud-table:first-child {

    tbody > tr:first-child > th:first-child {
        border-top-left-radius: var(--mud-default-borderradius);
    }

    tbody > tr:first-child > :last-child {
        border-top-right-radius: var(--mud-default-borderradius);
    }
}

.mud-paper > .mud-table:last-child,
.mud-paper > :last-child > .mud-table:last-child {

    tbody > tr:last-child > :first-child {
        border-bottom-left-radius: var(--mud-default-borderradius);
    }

    tbody > tr:last-child > :last-child {
        border-bottom-right-radius: var(--mud-default-borderradius);
    }
}

.mud-expand-panel {
    &:not(:first-of-type) {
        border-top-left-radius: 0 !important;
        border-top-right-radius: 0 !important;
    }

    &:not(:last-of-type) {
        border-bottom-left-radius: 0 !important;
        border-bottom-right-radius: 0 !important;
    }

}

.mud-expand-panel.mud-panel-expanded {
    border-top: 1px solid var(--mud-palette-lines-default);
    border-bottom: 1px solid var(--mud-palette-lines-default);
    margin: 0;

    & + .mud-expand-panel.mud-panel-expanded {
        border-top: 0;
    }
}