* {
    margin: 0;
    padding: 0;
}


.selected {
    background-color: #594ae2 !important;
    color: white !important;
}

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

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

.align-right input {
    text-align: right;
}

.align-right .me-auto {
    margin-inline-end: initial !important;
    margin-inline-start: auto;
}

.mud-text-style{
    font-size:18px !important;
}

.mud-icon-style {
    display: flex !important;
    justify-content: center !important;
}

.mud-input-root {
    font-size: 14px !important; /* Ajusta el tamaño de fuente según tus necesidades */
}

.mud-avatar.mud-avatar-medium {
    width: 35px;
    height: 34px;
    font-size: 1.25rem;
}

/*actualizacion*/

.mud-input-control.mud-input-control-margin-dense {
    background-color: white;
}

.mud-table-toolbar {
    /*background-color: #594ae2;*/
    background-color: #004bb9;
    color: white;
}

.monto {
    text-align:right!important;
}

.loader {
    width: fit-content;
    font-weight: bold;
    font-family: monospace;
    font-size: 16px;
    color: #0000;
    background: linear-gradient(90deg,#594ae2 calc(50% + 0.5ch),#000 0) right/calc(200% + 1ch) 100%;
    -webkit-background-clip: text;
    background-clip: text;
    animation: l7 2s infinite steps(11);
}

    .loader:before {
        content: ""
    }

@keyframes l7 {
    to {
        background-position: left
    }
}

.loaderUser {
    width: 48px;
    height: 24px;
    color: #594ae2;
    background: currentColor;
    border-radius: 50% 50% 0 0;
    position: relative;
    display: block;
    margin: 60px auto 0;
    box-sizing: border-box;
    animation: animloader 4s linear infinite;
}

    .loaderUser::after {
        content: '';
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 28px;
        height: 28px;
        border-radius: 50%;
        background: currentColor;
        top: -34px;
        box-sizing: border-box;
        animation: animloader1 4s linear infinite;
    }

@keyframes animloader {
    0% {
        box-shadow: 0 0 0 -2px, 0 0 0 -2px, 0 0 0 -5px, 0 0 0 -5px;
    }

    20% {
        box-shadow: 40px -1px 0 -2px, 0 0 0 -2px, 40px -1px 0 -5px, 0 0 0 -5px;
    }

    40% {
        box-shadow: 40px -1px 0 -2px, -40px -1px 0 -2px, 40px -1px 0 -5px,-40px -1px 0 -5px;
    }

    60% {
        box-shadow: 40px -1px 0 -2px, -40px -1px 0 -2px, 23px -29px 0 -5px,-40px -1px 0 -5px;
    }

    80%, 95% {
        box-shadow: 40px -1px 0 -2px, -40px -1px 0 -2px, 23px -29px 0 -5px, -23px -29px 0 -5px;
    }

    100% {
        box-shadow: 40px -1px 0 -2px rgba(255, 255, 255, 0), -40px -1px 0 -2px rgba(255, 255, 255, 0), 23px -29px 0 -5px rgba(255, 255, 255, 0), -23px -29px 0 -5px rgba(255, 255, 255, 0);
    }
}

@keyframes animloader1 {
    0% {
        box-shadow: 0 0 0 -2px, 0 0 0 -2px, 0 0 0 -5px, 0 0 0 -5px;
    }

    20% {
        box-shadow: 40px 2px 0 -2px, 0 0 0 -2px, 40px 2px 0 -5px, 0 0 0 -5px;
    }

    40% {
        box-shadow: 40px 2px 0 -2px, -40px 2px 0 -2px, 40px 2px 0 -5px, -40px 2px 0 -5px;
    }

    60% {
        box-shadow: 40px 2px 0 -2px, -40px 2px 0 -2px, 23px -23px 0 -5px, -40px 2px 0 -5px;
    }

    80%, 95% {
        box-shadow: 40px 2px 0 -2px, -40px 2px 0 -2px, 23px -23px 0 -5px, -23px -23px 0 -5px;
    }

    100% {
        box-shadow: 40px 2px 0 -2px rgba(255, 255, 255, 0), -40px 2px 0 -2px rgba(255, 255, 255, 0), 23px -23px 0 -5px rgba(255, 255, 255, 0), -23px -23px 0 -5px rgba(255, 255, 255, 0);
    }
}

.loaderSpiner {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    border: 3px solid;
    border-color: #594ae2 #594ae2 transparent transparent;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

    .loaderSpiner::after,
    .loaderSpiner::before {
        content: '';
        box-sizing: border-box;
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 0;
        margin: auto;
        border: 3px solid;
        border-color: transparent transparent #FF4081 #FF4081;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        box-sizing: border-box;
        animation: rotationBack 0.5s linear infinite;
        transform-origin: center center;
    }

    .loaderSpiner::before {
        width: 32px;
        height: 32px;
        border-color: #594ae2 #594ae2 transparent transparent;
        animation: rotation 1.5s linear infinite;
    }

@keyframes rotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes rotationBack {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}
/* ------------------------- loading intercativo -------------------------------- */
@keyframes scaleAnimation {
    0% {
        transform: scale(1.05);
    }

    50% {
        transform: scale(1);
    }

    100% {
        transform: scale(1.05);
    }
}

.loading-element {
    animation: scaleAnimation 1s infinite;
}
/* ------------------------- loading intercativo -------------------------------- */

@keyframes scaleAnimation2 {
    0% {
        transform: scale(1.05);
        opacity: 0.2;
    }


    25% {
        transform: scale(1);
        opacity: 0.8;
    }

    50% {
        transform: scale(1);
        opacity: 0.8;
    }

    75% {
        transform: scale(1);
        opacity: 0.2;
    }

    100% {
        transform: scale(1.05);
        opacity: 0.8;
    }
}

.loading-element2 {
    animation: scaleAnimation2 1s infinite;
}
/* ------------------------- loading intercativo -------------------------------- */

/* HTML: <div class="loader"></div> */
.loader {
    width: 15px;
    aspect-ratio: 1;
    border-radius: 50%;
    animation: l5 1s infinite linear alternate;
}

@keyframes l5 {
    0% {
        box-shadow: 20px 0 #000, -20px 0 #0002;
        background: #000
    }

    33% {
        box-shadow: 20px 0 #000, -20px 0 #0002;
        background: #0002
    }

    66% {
        box-shadow: 20px 0 #0002,-20px 0 #000;
        background: #0002
    }

    100% {
        box-shadow: 20px 0 #0002,-20px 0 #000;
        background: #000
    }
}