.table-calendar{

    width: 100%;

    table-layout: fixed;

    font-size: 14px;

    

}

.user-add-shedule-list a {

    color: #A6A8A9;

    border-radius: 5px;

    display: inline-block;

    padding: 10px;

}



.user-add-shedule-list a span {

    color: #7A7C7F;

    display: block;

    font-size: 13px;

    margin-top: 3px;

}

.normal-font {

    font-weight: normal;

}

#calendar-header th {

    font-weight: normal;

}

.green-border {

    border: 2px solid #1eb53a;

}

#table-calendar {

    width: 100%;

    table-layout: fixed;

}

.table-calendar th, .table-calendar td {

    width: 100%;

    text-align: center;

}

.icon-left-week-calendar:hover i {

    color:var(--color-secondary);

}

.icon-right-week-calendar:hover i {

    color: var(--color-secondary);

}

.table-calendar > thead > :nth-child(2) > :nth-child(3n - 1),

.table-calendar > tbody > tr > :nth-child(3n + 5) {

    background-color: #cefe9b !important;

}



.table-calendar > thead > :nth-child(2) > :nth-child(3n),

.table-calendar > tbody > tr > :nth-child(3n + 6) {

    background-color: #bed7ed !important;

}



.bg-yellow {

    background-color: #ffff00 !important;

}

#table-calendar table{

    width: 100% !important;

}

#table-calendar table th,

#table-calendar table td{

    padding: .5rem .5rem; 

    border: 1px solid #ccc;

}

#table-calendar table #calendar-header th:first-child{

    max-width: 100px;

}

/* Responsive Styles for Mobile (Devices <= 768px) */

@media (max-width: 768px) {

    #table-calendar {

        width: 100%;

        table-layout: auto; /* Cho phép tự động cuộn ngang */

    }



    .table-calendar {

        overflow-x: auto;

        display: block; /* Bảng hiển thị dạng khối cuộn được */

    }



    .table-calendar th,

    .table-calendar td {

        white-space: nowrap; /* Tránh xuống dòng nội dung */

        font-size: 12px;

    }



    .user-add-shedule-list a {

        font-size: 12px;

        padding: 5px;

    }

}