table {
    width: 100%;
    background-color: transparent;
    border-collapse: collapse;
    border-spacing: 0;
    cursor: default;
    white-space: nowrap;
}

.date_title {
    padding: 10px;
    text-align: center;
    color: var(--gray-whitefff, #FFF);
    font-weight: 600;
}

.wind_date_title {
    background: var(--blue-205591BE, #5591BE);
}

.sun_date_title {
    background: var(--orange-40D39929, #D39929);
}

.wind_table {
    border: 1px solid #5591BE;
}

.sun_table {
    border: 1px solid #F6AC1B;
}

td,th {
    padding: 0.25em;
    text-align: center;
}

td {
    color: var(--content-101B1E25, #1B1E25);
    font-size: .9rem;
}

.wind_table td:not(:last-child) {
    border-right: 1px solid #DBEEFC;
}

.sun_table td:not(:last-child) {
    border-right: 1px solid #F4E0BB;
}

.wind_table  thead {
    background: var(--blue-50DBEEFC, #DBEEFC);
    color: var(--blue-00-0D6FB8, #0D6FB8);
}

.sun_table thead {
    background: var(--orange-20F4E0BB, #F4E0BB);
    color: #946710;
}

/* table tr:hover td,
table tr:hover th {
    background-color: rgba(0, 0, 0, 0.2);
} */


/* scrollable table */
.tableWrapper {
    width: 100%;
    overflow-x: auto;
}

.tableWrapper.scrollRight {
    background: linear-gradient(to right,  rgba(187,187,187,0) 95%,rgba(187,187,187,1) 100%);
}
.tableWrapper.scrollLeft {
    background: linear-gradient(to right,  rgba(187,187,187,1) 0%,rgba(187,187,187,0) 5%);
}
.tableWrapper.scrollLeft.scrollRight {
    background: linear-gradient(to right,  rgba(187,187,187,1) 0%,rgba(187,187,187,0) 5%,  rgba(187,187,187,0) 95%, rgba(187,187,187,1) 100%);
}

::-webkit-scrollbar {
    width: 5px;
    height: 5px;
    background-color: rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb {
    background-color: rgba(0, 0, 0, 0.5);
}