.container {
    max-width: 100%;
}
.tagify__input {
    width: 100%;
    overflow: hidden;
    text-overflow: ellipsis; /* Adds an ellipsis to text that overflows */
    white-space: nowrap;
}
.tagify {
    background-color: #ffffff;
}
.blur {
    filter: blur(4px); /* Adds a blur effect to enhance the disguise */
   }
.scrollable-table {
    width: 100%;
    max-height: 90vh;
    overflow-x: auto; /* Enable horizontal scrolling */
    overflow-y: auto;
    margin: 10px auto; /* Optional: Adds some space around the table */
    font-size: 0.7em;
  
}
.scrollable-table::-webkit-scrollbar-thumb {
    background-color: #a5a5a5; /* Color of the thumb */
    border-radius: 4px; /* Roundness of the corners */
}
.scrollable-table::-webkit-scrollbar {
    height: 8px;
    background-color: #d5d5d5;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    width: 8px;
}
table {
    width: 6000px; 
    border-collapse: collapse; /* Optional: Collapses border to remove default spacing */
    
}

td {
    border: 1px solid #ccc; /* Optional: Adds a light grey border around table cells */
    padding: 8px; /* Optional: Adds padding inside table cells for better readability */
    text-align: left; /* Optional: Aligns text to the left; adjust as needed */
    
}

table tr th:nth-child(1),
table tr td:nth-child(1) {
    display: none;
}
table td:nth-child(-n+7) {
    background-color: rgb(217, 237, 244); /* Styles the first six columns */
}
table td:nth-child(n+8):nth-child(-n+10) {
    background-color: #ddaf5474 ; 
}
/* Styling the first six headers */
thead tr:nth-child(2) th:nth-child(-n+7) {
    background-color: rgb(78, 189, 226); /* Specific color for the first seven subheaders */
}
thead tr:nth-child(2) th:nth-child(n+8):nth-child(-n+17) {
    background-color: rgb(255, 165, 0); 
}
thead tr:nth-child(2) th:nth-child(n+18):nth-child(-n+20) {
    background-color: rgb(217, 143, 130); 
}
thead tr:nth-child(2) th:nth-child(n+21):nth-child(-n+28) {
    background-color: rgb(217, 130, 187); 
}
thead tr:nth-child(2) th:nth-child(n+29):nth-child(-n+33) {
    background-color: rgb(197, 130, 217); 
}
thead tr:nth-child(2) th:nth-child(n+34):nth-child(-n+43) {
    background-color: rgb(217, 197, 130); 
}
.scroll-button {
    background-color: #f9f9f9;
            border: 1px solid #414141;
            color: #414141;
            cursor: pointer;
            padding: 10px 15px;
            font-size: 20px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            outline: none;
            transition: background-color 0.3s, color 0.3
}
.scroll-button:hover {
    background-color: #888888;
            color: #efefef;
}
.scroll-button {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 0;
    z-index: 100;
    cursor: pointer;
    background-color: #b1bbc6;
    border: none;
    padding: 5px 10px;
    border-radius: 50%;
}
#scrollLeftButton {
    left: 10px;  /* Adjust left position as needed */
}
#scrollRightButton {
    right: 10px;  /* Adjust right position as needed */
}

.table-mainheader th {
    text-align: center;        /* Aligns the text to the left of the cell */
    vertical-align: middle;  /* Centers the text vertically within the cell */
    }
.table-mainheader th {
    border: 1px solid #b5babb ;
}
.table-subheaders th {
    border: 1px solid #b5babb ;
}
    @media (max-width: 600px) {
        #scrollRightButton {
            right: 0px;
        }
    }