.creator-lms-page {
    .creator-lms-dashboard {

        .creator-lms-my-courses-tab {
            border-bottom: 1px solid #EBEBEF;
            padding-bottom: 14px;
            overflow: hidden;

            ul {
                list-style: none;
                padding: 0;
                margin: 0;
                display: flex;

                li {
                    padding: 0;
                    margin: 0;
                    line-height: 1;

                    button {
                        color: var(--creator-lms-heading-color);
                        font-size: 14px;
                        font-weight: 400;
                        line-height: 1.2;
                        margin: 0 0 0 24px;
                        cursor: pointer;
                        position: relative;
                        background-color: transparent!important;
                        border: none;
                        outline: none;
                        box-shadow: none;
                        transition: all 0.3s ease;
                        padding: 0;

                        &:before {
                            content: "";
                            position: absolute;
                            left: 0;
                            bottom: -14px;
                            width: 100%;
                            height: 2px;
                            background-color: var(--creator-lms-primary-color);
                            transition: transform 0.4s ease;
                            transform: scaleX(0);
                            transform-origin: bottom right;
                        }

                        &:hover,
                        &.active {
                            color: var(--creator-lms-primary-color);
                        }

                        &:focus {
                            outline: 1px dotted var(--creator-lms-heading-color) !important;
                        }

                        &.active:before {
                            transform-origin: bottom left;
                            transform: scaleX(1);
                        }
                    }

                    &:first-child {
                        button {
                            margin-left: 0;
                        }
                    }
                }
            }
        }

        .creator-lms-single-tab-content {
            display: none;
            padding-top: 40px;

            &.active {
                display: block;
            }

            .creator-lms-dashboard-courses {
                margin-bottom: 0;
            }

        }
        
    }

    .no-course-data {
        text-align: center;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
        gap: 18px;
        padding: 40px 0 35px;
        border-radius: 8px;
        background: #FFF;
        box-shadow: 0px 1px 4px 0px #D3D6DD;
        width: 100%;

        svg {
            display: block;
            margin: 0 auto;
        }

        p {
            font-size: 18px;
            color: var(--creator-lms-body-text-color);
            line-height: 1.4;
            margin: 0;
            padding: 0;
            font-weight: 500;
        }

        &.no-course-section {
            margin-bottom: 40px;
        }
    }
}

@media screen and (max-width: 1199px) {
    .creator-lms-page .creator-lms-dashboard .creator-lms-my-courses-tab {
        padding-bottom: 13px;
    }
    .creator-lms-page .creator-lms-dashboard .creator-lms-my-courses-tab ul li:before {
        bottom: -13px;
    }

    .creator-lms-page .creator-lms-dashboard .creator-lms-single-tab-content {
        padding-top: 30px;
    }

    .creator-lms-page .no-course-data {
        gap: 12px;
    }
    .creator-lms-page .no-course-data svg {
        width: 100px;
        height: auto;
    }
    .creator-lms-page .no-course-data p {
        font-size: 15px;
    }

}

@media screen and (max-width: 991px) {
    .creator-lms-page .no-course-data.no-course-section {
        margin-bottom: 20px;
    }
}

@media screen and (max-width: 767px) {
    .creator-lms-page .creator-lms-dashboard .creator-lms-single-tab-content {
        padding-top: 20px;
    }

    .creator-lms-page .no-course-data {
        padding: 20px 0 15px;
        gap: 14px;
    }
    .creator-lms-page .no-course-data p {
        font-size: 14px;
    }

}

@media screen and (max-width: 575px) {
    .creator-lms-page .creator-lms-dashboard .creator-lms-my-courses-tab ul li {
        text-align: center;
    }

}