/* Custom global CSS */
.column-header {
    font-size: 0.8rem;
    line-height: 0.8rem;
}

.mud-table-cell {
    padding: 0.5rem;
    font-size: 0.7rem;
    align-items: center;
}

    .mud-table-cell .mud-typography {
        font-size: 0.7rem;
    }

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

.table-cell-button {
    height: fit-content;
    width: fit-content;
    align-self: center;
    justify-self: center;
}

.h-full {
    height: 100%;
}

.w-full {
    width: 100%;
}

.navbar-box {
    flex: 1;
    display: flex;
}

    .navbar-box.left {
        justify-content: left;
    }

    .navbar-box.center {
        justify-content: center;
    }

    .navbar-box.right {
        justify-content: right;
    }

    .navbar-box:first-child {
        margin-right: auto;
    }

    .navbar-box:last-child {
        margin-left: auto;
    }

/* Override table pagination toolbar's responsiveness (from 480px tp 600px) */
@media (max-width: 600px) {
    .mud-table .mud-table-pagination .mud-table-pagination-toolbar {
        flex-wrap: wrap;
        padding-top: 16px;
        padding-right: 16px;
        padding-inline-end: 16px;
        padding-inline-start: unset;
        min-height: 100px;
    }

        .mud-table .mud-table-pagination .mud-table-pagination-toolbar .mud-table-pagination-actions {
            margin-left: auto;
            margin-right: -14px;
            margin-inline-start: auto;
            margin-inline-end: -14px;
        }
}

.mud-table-pagination-select .mud-input .mud-input-root {
    max-width: fit-content;
}

/* Fix top margin for search bar text fields */
.search-bar {
    margin-top: 0;
}

    .search-bar > .mud-input-control-input-container > div.mud-input.mud-input-text {
        margin-top: 0;
    }

/* Classes for table row styling */
.dark-mode-row-even {
    background-color: #3b3b44;
}

.dark-mode-row-odd {
    background-color: #373740;
}

.dark-mode-hover:hover {
    background-color: #35353d;
}

.light-mode-row-even {
    background-color: #ffffff;
}

.light-mode-row-odd {
    background-color: #fafafa;
}

.light-mode-hover:hover {
    background-color: #f5f5f5;
}