/**/
.force-width-150 {
    width: 150px;
    max-width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.force-width-75 {
    width: 75px;
    max-width: 85px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.small-font {
    font-size: 12px;
    width: 300px;
}

.my-class .mud-table-cell {
    font-size: 0.675rem; /* ~10.8px instead of 8px */
    max-width: 100px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mybutton .mud-button-outlined .mud-icon-button {
    padding-top: 15px;
}
/* Keep your row height compact */
.my-table .mud-table-row {
    height: 18px;
}

.my-class.my-table {
    width: 100%;
    overflow-x: auto;
}

.my-class .mud-table-head .mud-table-cell {
    font-weight: bold;
}
.my-class .mud-table-row button{
    padding:0;
    margin-right:3px;
}
.my-class .mud-table-row button svg {
    width: 10px;
    height: 10px;
    margin: 3px;
}
.my-class.mud-table-dense * .mud-table-row .mud-table-cell {
    padding: 0;
    padding-inline-start: 0;
    padding-inline-end: 0;
}
.my-class .mud-input > input.mud-input-root.mud-input-root-filled, div.mud-input-slot.mud-input-root.mud-input-root-filled {
    padding: 22px 11px 4px;
    font-size: 0.7rem;
}
.my-class .mud-input-label,
.mud-input > .mud-input-label,
.mud-select > .mud-input-label,
.mud-datepicker > .mud-input-label,
.mud-timepicker > .mud-input-label {
    color: var(--mud-palette-primary) !important; /* Replace with your desired color value */
}

.my-dialog .mud-input > textarea.mud-input-root {
    height: calc(100vh - 220px);
}
.login-container {
    position: relative;
    width: 100%;
    max-width: 400px;
}

    .login-container::after {
        content: '';
        position: absolute;
        top: -2px;
        left: -2px;
        right: -2px;
        bottom: -2px;
        border-radius: 10px;
        background: linear-gradient(90deg, transparent, var(--mud-palette-primary), transparent);
        background-size: 200% 200%;
        z-index: -1;
        opacity: 0.6;
        animation: lightLine 3s infinite linear;
    }

@keyframes lightLine {
    0% {
        background-position: 0% 0%;
    }

    100% {
        background-position: 200% 200%;
    }
}

@media (max-width: 600px) {
    .my-class .mud-table-cell {
        font-size: 0.675rem; /* ~10.8px instead of 8px */
        max-width: 96vw;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .mud-layout .pa-4 {
        padding: 0 2vw 0 2vw !important;
    }
    .my-dialog .mud-input > textarea.mud-input-root {
        height: 500px;
    }
}
.disable-chart-clicks .mud-chart-line-series {
    pointer-events: none !important;
}