/* Fix tab overflow issue */
.nav-tabs {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    white-space: nowrap;
}

    /* Hide scrollbar but allow scrolling */
    .nav-tabs::-webkit-scrollbar {
        display: none;
    }

.nav-tabs {

    -ms-overflow-style: none; /* For IE and Edge */
    scrollbar-width: none; /* For Firefox */
}

/* Ensure full width for the table and main content */
.container {
    max-width: 100%;
    overflow-x: hidden;
}

/* Adjust tab padding for smaller screens */
@media (max-width: 1200px) {
    .nav-tabs .nav-link {
        font-size: 0.9rem;
        padding: 8px 10px;
    }
}
.custom-table{
    font-size:1rem;
}
.custom-table thead tr {
    background: linear-gradient(to right, #33b4e7, #4a2ea1); /* blue to purple gradient */
}

    .custom-table thead th {
        color: white !important; /* <-- Ensures text is visible over gradient */
        font-weight: bold;
        text-align: center;
        padding: 10px;
        white-space: nowrap;
        background-color: transparent !important; /* Removes default table header bg */
        font-size: 1rem;
    }

    /* Optional rounded corners */
    .custom-table thead th:first-child {
        border-top-left-radius: 0px;
    }

    .custom-table thead th:last-child {
        border-top-right-radius: 0px;
    }
.go-to-session-btn {
    background-color: #c6004c; /* Magenta color */
    color: white;
    border: none;
    padding: 10px 20px;
    font-size: 16px;
    font-weight: bold;
    border-radius: 5px;
    cursor: pointer;
    transition: background-color 0.3s ease;
}

    .go-to-session-btn:hover {
        background-color: #a4003e; /* Darker on hover */
    }
.dow-img {
    width: 25px;
    height: 25px;
    color: #512479;
}
.dow-btn {
    width: 45px !important;
    height: 45px !important;
    padding: 0px !important;
    background: #FFFFFF !important;
    border: 1px solid #DADADA !important;
    color: #512479 !important;
    float: right !important;
    margin-left: 10px;
}
/* Common button base style */
.btn-status {
    font-weight: 600;
    font-size: 1rem;
    color: #4f2b85;
    background: none;
}

    /* Hover effect for both */
    .btn-status:hover {
        background-color: #d00659;
        color: white;
        text-decoration: underline;
    }
.selected-row {
    background-color: #e0f7fa !important; 
}
th.role-column,
td.role-column {
    min-width: 115px; /* or whatever width works best */
}
.selected-session-row {
    background-color: #e0f7fa !important; 
}
#sessionTableBody tr {
    cursor: pointer;
}

.selected-user-row {
    background-color: #e0f7fa !important;
}

#userTableBody tr {
    cursor: pointer;
}
.highlighted-row {
    background-color: #e3f2fd !important;
}