:root {
    --mud-palette-table-lines: #E5E5E5 !important;
    --gray-disabled: #a0a0a0;
}

html {
    height: 100%;
    background-color: white !important;
}

body, div#app {
    height: 100%;
}

/* No Layout */
.page_root.page_root_no_layout {
    /*justify-content: center;*/
    height: 100%;
}

.page_root.page_root_no_layout:has(#consumer-track-trace) {
    /*justify-content: flex-start;*/
}

.mud-main-content:has(.page_root.page_root_no_layout) {
    height: 100%;
}

.mud-main-content {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

div.page_root {
    padding: 24px;
    display: flex;
    flex-direction: column;
    /*justify-content: space-between;*/
}

.width100 {
    width: 100%;
}

a:hover,
a:active {
    color: #B09038;
}

.nav-link {
    color: #ebf1f3
}

#side-nav-menu .mud-nav-link {
    padding: 6px;
}

#side-nav-menu .mud-nav-link .mud-nav-link-text {
    margin-left: 4px;
    margin-inline-start: 4px;
    display: flex;
    align-items: center;
}

#side-nav-menu .mud-nav-link .mud-nav-link-text .navText {
    margin-left: 10px;
}

.mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(.mud-nav-link-disabled) {
    color: #B09038;
    background-color: var(--mud-palette-action-default-hover)
}

.mud-nav-link {
    color: #ebf1f3
}

    .mud-nav-link.active:not(.mud-nav-link-disabled) {
        font-weight: 500 !important;
        color: #ebf1f3;
    }

.mud-input.mud-input-outlined {
    border-color: #31576F;
    border-width: 1px;
}

.mud-chip-filled {
    background-color: white;
}

.mud-button {
    text-transform: none;
}

.mud-table-header {
    background-color: #31576F;
}

    .mud-table-header .mud-table-cell {
        color: white !important;
    }

.selectedrowtable {
    background-color: #31576F !important;
}

    .selectedrowtable > td {
        color: white !important;
    }

        .selectedrowtable > td .mud-input {
            color: white !important;
        }

.cursorpointer {
    cursor: pointer
}

.breadcrumb-container {
    padding: 0px;
    margin-bottom: -5px;
    font-size: small;
}

.mud-breadcrumbs .mud-breadcrumb-item:last-child > a {
    color: darkgray;
}

.feedback-popup-button {
    background-color: transparent !important;
    border: none !important;
    color: var(--mud-palette-action-default) !important;
}

    .feedback-popup-button:hover {
        background-color: var(--mud-palette-action-default-hover) !important;
        color: #31576F !important;
    }

.background-color-d9 {
    background-color: #ebf1f3;
}

.background-color-white {
    background-color: white;
}

.color-headings {
}

/* Color: #31576F for svg */
img.svg.primary-filter {
    filter: invert(30%) sepia(19%) saturate(1137%) hue-rotate(160deg) brightness(85%) contrast(91%);
}

/* Color: #31576F for png */
img.png.primary-filter {
    filter: invert(30%) sepia(19%) saturate(1137%) hue-rotate(160deg) brightness(40%) contrast(91%);
}

img.png.white-filter {
    filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(300deg) brightness(102%) contrast(103%);
}

img.png.black-filter {
    filter: invert(0%) sepia(100%) saturate(0%) hue-rotate(300deg) brightness(102%) contrast(103%);
}

a:hover img,
a.active img {
    filter: invert(53%) sepia(50%) saturate(518%) hue-rotate(6deg) brightness(99%) contrast(89%) !important;
}

.table-btn-action {
    min-width: 50px;
    min-height: 50px;
    width: 50px;
    height: 50px;
    padding: 12px;
    border-radius: 50%;
}

/* Tables */
.ftp-table {
    background-color: white;
}

    .ftp-table .mud-toolbar {
        height: auto;
    }

    .ftp-table .mud-table-root .mud-table-head .mud-table-cell {
        font-weight: 600;
    }

.input-bottom-border .mud-input {
    border: none;
    border-bottom: 1px solid var(--mud-palette-primary);
}

/* Readonly Inputs */
.readonly-text-field .mud-input,
.readonly-numeric-field .mud-input,
.readonly-date-picker .mud-input {
    border-color: var(--gray-disabled);
    color: var(--gray-disabled);
}
.readonly-numeric-field .mud-input-numeric-spin {
    display: none !important;
}

.readonly-checkbox .mud-checkbox span,
.readonly-checkbox .mud-checkbox p {
    color: var(--gray-disabled);
}

.readonly-expand-panel {
    border-color: var(--gray-disabled);
}

.readonly-date-picker .mud-input .mud-input-adornment {
    display: none;
}

.no-hover-background:hover, .no-hover-background:focus-visible {
    background-color: transparent !important;
}

.items-flex-0-1-250 > div {
    flex: 0 1 250px !important;
}


/* Design of sort arrows on tables, and the span that contains the arrow*/
span.mud-button-root.mud-table-sort-label{
    width: 100%;
    justify-content: space-between;
}

.mud-svg-icon.mud-table-sort-label-icon.mud-direction-asc,
.mud-svg-icon.mud-table-sort-label-icon.mud-direction-desc,
.mud-svg-icon.mud-table-sort-label-icon {
    background-color: var(--mud-palette-success);
    border-radius: 50%;
    color: white;
}

/* Culture dropdown */
#culture_wrapper {
    box-shadow: none;
    padding: 6px 8px;
}

#culture_wrapper .mud-select,
#culture_wrapper .mud-input {
    margin: 0;
}

#culture_wrapper .mud-input-slot {
    padding: 0;
}

.mud-breadcrumb-item.mud-disabled {
    opacity: 0.5;
}

.mud-select .mud-input-label, 
.mud-picker .mud-input-label {
    color: #31576F !important;
}