.mi-barra-titulo {
    background-color: #5cb85c;
    color: black; /* Color del texto */
    padding: 10px; /* Espaciado interno para que se vea mejor */
    font-weight: bold; /* Opcional: negrita para el texto del título */
}

.div-title {
    position: relative;
    color: black; /* Texto en blanco */
    border-radius: 3px !important; /* Bordes redondeados */
}

.div-division {
    position: relative;
    color: black; /* Texto en blanco */
    border-radius: 3px !important; /* Bordes redondeados */
}
    .div-division:after {
        content: "";
        position: absolute;
        top: -6px;
        left: 8px;
        right: 100px;
        width: 98%;
        height: 2px; /* Altura del contorno inferior */
        background: linear-gradient(135deg,#6f10e8, #b788f3 ); /* Degradado solo en la parte inferior */
        border-radius: 3px 3px 0px 0px; /* Bordes redondeados solo en la parte inferior */
    }

.div-title:after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 2px; /* Altura del contorno inferior */
    background: linear-gradient(135deg,#6f10e8, #b788f3 ); /* Degradado solo en la parte inferior */
    border-radius: 3px 3px 0px 0px; /* Bordes redondeados solo en la parte inferior */
}

.row > .div-file {
    margin-bottom: 15px;
}
.bg-custom-purple {
    background-color: #6610f2 !important;
}

.badge-small {
    padding: 2px 6px; /* Ajusta el tamaño del padding según sea necesario */
    font-size: 0.75rem; /* Ajusta el tamaño del texto si es necesario */
}

.custom-popup-titleAlert {
    background-color: #d9534f; /* Cambia el color de fondo del título */
    color: white; /* Cambia el color del texto del título */
    padding: 10px; /* Añade un poco de padding */
    border-bottom: 2px solid #e0e0e0; /* Añade una línea divisoria */
    font-weight: bold; /* Cambia el peso de la fuente */
}

.custom-popup-titleInformation {
    background-color: #5cb85c; /* Cambia el color de fondo del título */
    color: white; /* Cambia el color del texto del título */
    padding: 10px; /* Añade un poco de padding */
    border-bottom: 2px solid #e0e0e0; /* Añade una línea divisoria */
    font-weight: bold; /* Cambia el peso de la fuente */
}

#toastContainer {
    width: auto !important; /* Asegúrate de que el ancho sea automático */
    display: inline-block; /* Asegura que el ancho se ajuste al contenido */
    padding: 0; /* Elimina cualquier padding adicional */
    margin: 0; /* Elimina cualquier margin adicional */
    box-sizing: border-box; /* Asegura que el tamaño del cuadro se mida de forma correcta */
}

.dx-fileuploader-upload-button.dx-button-has-text {
    position: absolute;
    top: 6px;
    left: 300px;
}

.dx-fileuploader-file-container {
    text-align: right;
}

/* Mover otros botones (como el botón de eliminación) a la derecha */
.dx-fileuploader-buttons-container {
    text-align: right;
}

.file-uploader-container {
    border: 2px dashed #ccc;
    padding: 20px;
    border-radius: 5px;
    flex-shrink: 0;
}

.uploaded-files-container {
    margin-left: 20px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    min-width: 200px;
}

.dx-fileuploader-button {
    display: none;
}

.thick-checkbox .dx-checkbox-icon {
    border-color: #c8cbcb;
}

.animated {
    -webkit-animation-duration: 1s;
    animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(20px);
        -ms-transform: translateX(20px);
        transform: translateX(20px);
    }

    100% {
        opacity: 1;
        -webkit-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
}

.fadeInRight {
    -webkit-animation-name: fadeInRight;
    animation-name: fadeInRight;
}

.non-selectable {
    background-color: #f0f0f0;
    color: #a0a0a0;
}

.completed-action {
    background-color: #e0ffe0; /* Light green */
    color: #808080; /* Gray */
}

.btn-custom {
    color: #fff !important;
    background-color: #2BFEBA !important;
    border-color: #2BFEBA !important;
}

.btn-custom:hover {
    background-color: #26E2A5 !important;
    border-color: #26E2A5 !important;
}
.disabled-row .dx-select-checkbox {
    pointer-events: none; /* Deshabilita clics */
    opacity: 0.4; /* Reduce opacidad */
}

.disabled-row {
    pointer-events: none; /* Deshabilita clics en toda la fila */
    /*background-color: #f8d7da; *//* Fondo de fila deshabilitada */
    /*opacity: 0.6;*/ /* Reduce opacidad */
}

.centered-field {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.centered-field label {
    align-self: flex-start;
    margin-bottom: 8px;
    text-align: left;
    width: 100%;
}

.centered-field .dx-checkbox {
    margin-left: 2px;
}