.creator-lms-page {
    .creator-lms-switcher {
        input[type="checkbox"] {
            display: none;
        }

        .switcher-slider {
            display: block;
            position: relative;
            height: 24px;
            width: 40px;
            border-radius: 50px;
            border: 1px solid #c6c6c6;
            background-color: #c6c6c6;
            transition: all 0.3s ease;
            cursor: pointer;

            &:before {
                content: "";
                position: absolute;
                top: 2px;
                left: 2px;
                width: 18px;
                height: 18px;
                border-radius: 100%;
                background-color: #fff;
                transition: all 0.3s ease;
            }
        }

        input[type="checkbox"]:checked + .switcher-slider {
            background-color: var(--creator-lms-primary-color);
            border-color: var(--creator-lms-primary-color);
        }
        input[type="checkbox"]:checked + .switcher-slider:before {
            background-color: #ffffff;
            left: 18px;
            box-shadow: 0px 1px 1px 0px #2C49C0;
        }
    }
}

@media screen and (max-width: 991px) {
    .creator-lms-page .creator-lms-switcher .switcher-slider {
        height: 20px;
        width: 32px;
    }

    .creator-lms-page .creator-lms-switcher .switcher-slider:before {
        width: 14px;
        height: 14px;
    }

    .creator-lms-page .creator-lms-switcher input[type=checkbox]:checked + .switcher-slider:before {
        left: 15px;
    }

}