* {
    margin: 0;
    padding: 0;
}

html, body, #app {
    font-family: Roboto, sans-serif;
    height: 100%;
    margin: 0;
    padding: 0;
}

.main-toolbar {
    background-color: var(--mud-palette-primary);
}

.main-toolbar h1, h2, h3, h4 {
    color: var(--mud-palette-primary-text);
}

.main-drawer {
    height: 100%;
    margin: 0;
    padding: 0;
}

.k-drawer-container {
    min-height: 90vh;
}

.dialog.k-form .k-form-buttons {
    justify-content: flex-end;
}

.k-tilelayout-item-header {
    background-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}

/*** controls ***/

/* breadcrumbs */
.mud-breadcrumbs {
    padding-left: 0;
}

.mud-breadcrumb-separator {
    padding: 0 8px;
}

.mud-breadcrumb-item a, .mud-breadcrumb-separator > span {
    color: inherit;
}

.mud-breadcrumb-item:last-child {
    font-size: 1.5rem;
    font-weight: 300;
}

.mud-breadcrumb-item {
    font-size: .8rem;
    font-weight: 300;
}


/* grid */
.k-grid td {
    padding: 5px 24px;
}

.k-grid tbody > tr:not(.k-detail-row):hover,
.k-grid tbody > tr:not(.k-detail-row).k-hover {
    background-color: var(--mud-palette-secondary-hover);
    color: var(--mud-palette-black);
}

.k-grid td.k-selected, .k-grid tr.k-selected {
    background-color: var(--mud-palette-primary);
    color: var(--mud-palette-primary-text);
}

/* ** configuration tree view */
/* non-integrated */
.k-drawer-content .tile-layout-size {
    height: 95vh;
}

.tile-layout-size {
    height: 100vh;
}

.card-title-icon {
    margin-right: 10px;
}

.configuration-tree-grid .configuration-item-value {
    align-self: center;
    max-height: 20px;
    vertical-align: central;
    text-overflow: ellipsis;
    white-space: normal;
    padding: 0;
}

.configuration-tree-grid .configuration-item-value-inherited {
    color: var(--mud-palette-grey-default);
    align-self: center;
    max-height: 20px;
    vertical-align: central;
    text-overflow: ellipsis;
    white-space: normal;
    padding: 0;
}

.configuration-tree-grid .configuration-item-inherited-from {
    padding-left: 5px;
}

.configuration-tree-grid .k-grid-filter-popup {
    border: 1px solid rgba(0, 0, 0, 0.12)
}

/* edit configuration */ 
.edit-configuration-parameter-textarea textarea {
    max-height: 800px;
}

.edit-configuration-parameter-inherited-value {
    color: var(--mud-palette-grey-default);
    margin-left: 5px;
}

/* messages */
.message-section {
    text-align: center;
    height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.message-section .mdi {
    align-self: center;
    color: var(--mud-palette-primary);
}

.message-section h2 {
    color: var(--mud-palette-primary);
}

.message-section .message-button {
    width: 120px;
    align-self: center;
    margin-top: 10px;
}

.loader-dot {
    height: 20px;
    width: 20px;
    border-radius: 50%;
    color: var(--mud-palette-primary);
    display: inline-block;
    -webkit-animation: grow 2.1s infinite ease-in-out both;
    animation: grow 2.1s infinite ease-in-out both;
}

.loader-dot.dot1 {
    -webkit-animation-delay: -0.96s;
    animation-delay: -0.96s;
}

.loader-dot.dot2 {
    -webkit-animation-delay: -0.48s;
    animation-delay: -0.48s;
}

@-webkit-keyframes grow {
    0%, 80%, 100% {
        -webkit-transform: scale(0)
    }

    40% {
        -webkit-transform: scale(1.0)
    }
}

.color-inverted.mud-input-control > .mud-input-control-input-container > .mud-input-label-inputcontrol.mud-disabled {
    color: var(--mud-palette-primary-text);
    background: var(--mud-palette-primary);
}

.color-inverted .mud-input.mud-input-outlined.mud-disabled .mud-input-outlined-border {
    border-color: var(--mud-palette-primary-text);
    border: 2px solid var(--mud-palette-primary-text);
}

.color-inverted .mud-input.mud-input-outlined.mud-disabled .mud-input-slot {
    color: var(--mud-palette-primary-text);
}