.btn-week{
    display: flex;
    padding: 10px;
    align-items: flex-start;
    border-radius: 2px;
    border: 1px solid var(--Primary-6, #1890FF);
    color: #1890FF;
    background: var(--Neutral-1, #FFF);
    cursor: pointer;
}

.btn-week:disabled{
    color: #D9D9D9 !important;
    border: 1px solid var(--Neutral-5, #D9D9D9) !important;
}

.btn-cancel
{
    width:100px;
    height: 37.6px;
    font-size: 14px;
    text-align: center;
    background-color: rgb(239,239,239);
    color: rgb(25,135,183);
    box-shadow: 1px 1px 2px rgb(150 150 150);
}

.color-tips
{
    width: 50px;
    border-radius: 5px;
    display: inline-block;
    border: 1px solid rgb(181, 181, 181);
    margin-left: 25px;
}

.timezone-dropdown-menu
{
    padding-bottom: 4px;
    border: 1px solid var(---hover, #D9D9D9);
    height: 216px;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 1000;
}

.timezone-dropdown-menu-box{
    display: flex;
    width: 360px;
    height: 36px;
    padding: 0px 20px 0px 10px;
    align-items: center;
    gap: 226px;
    background: #FFF;
    cursor: pointer;
}

.timezone-box{
    display: flex;
    padding: 4px 10px;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.btn-blue
{
    width:100px;
    height: 37.6px;
    background-color: rgb(63,141,252);
    font-size: 14px;
    text-align: center;
    color: white;
}

.table-choosed {
    background-color: rgb(100,178,253)!important;
}

.table-booked {
    background-color: rgb(170,154,245)!important;
    font-size: 30;
    /* color: #ffffff; */
}

.table-booked-mine {
    background-color: rgb(167,223,138)!important;
    font-size: 30;
    /* color: #ffffff; */
}

.table-expired {
    background-color: rgb(206, 206, 206)!important;
}

.table-expired-not-booked {
    background-color: rgb(132, 132, 132)!important;
}

.bg-light-gray {
    background-color: #f7f7f7;
    color: rgb(140,140,140);
}

.day-col{
    display: flex;
    flex-direction: column;
    align-items: center;
    color: rgb(140,140,140);
    text-align: center;
    flex: 1;
    font-size: 12px;
}

.time-unit{
    font-size: 14px;
    color: rgba(63, 141, 252, 1);
    font-weight: 700;
    margin-top: 10px;
    font-style: italic;
    width: 50px;
    height: 22px;
    cursor: pointer;
}

.time-unit-unavailable{
    font-size: 14px;
    color: rgb(206, 206, 206);
    font-weight: 700;
    margin-top: 10px;
    font-style: italic;
    width: 50px;
    height: 22px;
}

.time-unit-choosed{
    font-size: 14px;
    color: rgba(63, 141, 252, 1);
    font-weight: 700;
    margin-top: 10px;
    font-style: italic;
    border: green 1px solid;
    border-radius: 20px;
    width: 50px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.table-content-box{
    display: flex;
    flex-direction: row; 
    gap: 2px; 
    width: 100%;
}

.table-title-box{
    position: sticky; 
    top: 0; 
    width: 100%;
    background-color: #FFF;
}

.schedule-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.sticky-date-weekday{
    /* position: sticky;
    top: 38px; */
    background-color: #EEE;
    color: #666;
    text-align: center;
    font-size: 14px;
    font-style: italic;
    font-weight: 700;
    width: 100%;
}

.timezone-dropdown{
    display: flex;
    width: 184px;
    height: 39px;
    padding: 10px 20px;
    align-items: center;
    justify-content: center;
    gap: 35px;
    border-radius: 8px;
    border: 1px solid #3F8DFC;
}

@media (min-width: 576px) {
    .schedule-title {
        justify-content: space-between;
        align-items: center;
    }
}

@media (max-width: 575.98px) {
    .schedule-title {
        flex-direction: column;
        align-items: flex-start;
    }
    .date-label{
        margin: auto;
    }
    .timezone-dropdown{
        margin: auto;
    }
}