/* Contenedor de las vistas */
.tab-content-wrapper {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: calc(100dvh - 60px - 65px);
    margin-top: 60px;
    overflow: hidden;
    box-sizing: border-box;
}

/* Etiqueta: <div class="tab-content">
   Class: tab-content
*/
/* ==========================================
   SCROLL - TAB CONTENT
   ========================================== */
.tab-content {
    display: flex;
    flex-direction: column;
    align-items: stretch;

    width: 100%;
    height: 100%;
    min-width: 0;

    overflow-y: auto;
    overflow-x: hidden;

    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-y: contain;

    box-sizing: border-box;
}


/* ==========================================
   ESTADOS DE VISIBILIDAD
   ========================================== */

.tab-hidden {
    display: none !important;
}

.tab-visible {
    display: block !important;
}


    /* Chrome, Edge y Safari */
    .tab-content::-webkit-scrollbar {
        width: 8px;
    }

    .tab-content::-webkit-scrollbar-track {
        background: transparent;
    }

    .tab-content::-webkit-scrollbar-thumb {
        background: #c8c8c8;
        border-radius: 20px;
        border: 2px solid transparent;
        background-clip: padding-box;
        transition: background 0.2s ease;
    }

        .tab-content::-webkit-scrollbar-thumb:hover {
            background: #9f9f9f;
            background-clip: padding-box;
        }

        .tab-content::-webkit-scrollbar-thumb:active {
            background: #7d7d7d;
            background-clip: padding-box;
        }

    .tab-content::-webkit-scrollbar-corner {
        background: transparent;
    }