:root {
    --selected-row-color: #B3D9FF;
}

.brand-logo {
    display: flex;
    align-items: stretch;
    height: 100%;
    width: 100%;
    color: white;
}

.w-100 {
    width: 100%;
}

.h-100 {
    height: 100%
}

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

.overflow-wrap-anywhere {
    overflow-wrap: anywhere;
}

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

.breadcrumb-items a {
    color: white;
}

ul.breadcrumb-items > li.mud-breadcrumb-separator > span {
    color: white;
    font-size: 1.7rem;
    font-weight: bold;
}

ul.breadcrumb-items > li.mud-breadcrumb-item.mud-disabled > a {
    color: lightgray;
}

.mud-form .mud-input-control {
    margin-top: 1.5rem;
}

/* ------------------------- Drawer button ------------------------------- */
#right-drawer-toggle-button {
    position: fixed;
    bottom: 1rem;
    right: 1rem;
}

/* ------------------------- Authentication info footer ------------------------------- */
.navigation-footer {
    position: relative;
    margin-top: 5vh;

}

.container-left-border {
    border-left: 1vh solid #004A96;
    height: 100vh;
}

.container-left-drawer {
    position: absolute;
    top: 81vh;
    z-index: 1;
    width: 4vh;
    background: #004A96;
    border-radius: 0 30% 30% 0;
}

.mud-nav-item > a {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}

.mud-nav-link .mud-nav-link-text {
    margin-left: 0;
    margin-inline-start: 0;
    text-align: center;
}

.mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(.mud-nav-link-disabled) {
    margin-left: 0;
    margin-inline-start: 0;
    text-align: center;
    color: white;
}


/* ------------------------- Mud Table customization ------------------------------- */
/* ------------------------- Make sort icon always visible ------------------------------- */
.mud-table-sort-label .mud-table-sort-label-icon {
    opacity: 20%;
}

.mud-table-search > .mud-input-control-input-container > .mud-input > input {
    padding: 4px;
}

.dashboard-button {
}

.dashboard-button:hover {
    opacity: 1
}

.mud-table-dense * .mud-table-row .mud-table-cell {
    padding: 4px 24px 4px 16px;
}

.wizard-timeline-footer {
    position: fixed;
    bottom: 0;
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding-right: 5%
}

/* ------------------------- Material Pickup Request Pages ------------------------------- */
#wizard-timeline-component .wizard-timeline-nav-button {
    width: 30rem;
}

#selected-materials-overview .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
    margin-top: 0;
    width: 6rem;
}

#materials-for-pickup-table .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
    margin-top: 0;
}

/* ------------------------- Picklist Page ------------------------------- */
#claim-button * {
    width: 100%;
}

/* ------------------------- Picklist Dtails Page ------------------------------- */
#back-to-picklist{
    top: 0rem;
    height: 4rem;
}

#picklist-details tr td:first-child {
    font-weight: bold;
}

.my-mud-date-range-picker ~ input {
    font-size: .8rem;
}

.table-header-titles-info-color table thead th {
    color: var(--mud-palette-primary-lighten);
    font-weight: bold;
    font-size: 1rem;
}

/* ------------------------- Picklist Overview Page ------------------------------- */
#picklist-details-table thead th {
    color: var(--mud-palette-primary-lighten);
    font-weight: bold;
    font-size: 1rem;
}

#picklist-handling-overview-table thead th {
    color: var(--mud-palette-primary-lighten);
    font-weight: bold;
    font-size: 1rem;
}

/* ------------------------- Picklist Handling Page ------------------------------- */
#picklist-details table tbody tr td:first-child {
    color: var(--mud-palette-primary-lighten);
    
    font-size: 1rem
}

#picklist-handling-overview-table .mud-input-control > .mud-input-control-input-container > div.mud-input.mud-input-text {
    margin-top: 0;
}

#picklist-handling-overview-table .mud-input-number-control input {
    height: 1px;
}

#picklist-handling-overview-table .mud-input-number-control {
    
    width: 6rem;
}

#picklist-handling-overview-table .picklist-handling-overview-table-comment-column .mud-input-control-input-container {
    /*max-width: 18rem;*/
    /*border: solid 1px red;*/
}

#picklist-handling-overview-table .picklist-handling-overview-table-comment-column .mud-input-control-input-container input {
    /*border: solid 1px blue;*/
    height: 1rem;
}

    #picklist-handling-overview-table .picklist-handling-overview-table-comment-column .mud-input-control-input-container .mud-input-slot {
        padding: .7rem;
    }

/*#picklist-handling-overview-table * .mud-table-row .mud-table-cell {
    padding: 3px 3px 3px 3px;
     padding-inline-start: 16px; 
     padding-inline-end: 24px; 
}*/

#table-action-button .mud-button {
    padding: 0 0px 0 0px !important;
    min-width: 24.5px !important;
}

.table-enum-filter-popover {
    width: auto !important;
    max-width: initial !important;
}

.item-invalid {
    border-bottom: solid 3px var(--mud-palette-error);
}

.item-partial {
    border-bottom: solid 3px var(--mud-palette-warning);
}

.item-valid {
    border-bottom: solid 3px var(--mud-palette-success);
}