.overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(25,125,125,0.7);
    color: white;
    z-index: 2000 !important;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transition: opacity 0.4s ease;
}

    .overlay.show {
        opacity: 1;
    }


    .tbody-overlay {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(33,37,41,0.5);
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 100; /* lo suficientemente alto dentro del tbody */
    opacity: 0;
    transition: opacity 0.3s ease;
    pointer-events: none; /* para no bloquear interacciones si quieres */
    display:none
}

.tbody-overlay.show {
    opacity: 1;
    pointer-events: all; /* activarlo cuando se muestre */
    display: block;
}