:root {
    --dark-blue-btn: #0057FA;
    --dark-blue: #06BDFC;
    --dark-blue-link: #06BDFC;
    --dark-blue-code: #388be8;
    --dark-blue-light: #388bfd1a;
    --dark-light_blue: #388bfd1a;

    /*--dark-green: #3AC152;*/
    --dark-green: #22A55B;
    --dark-green-light: #2ea0431a;
    --dark-yellow: #FFD500;
    --dark-yellow-light: #625500;
    --dark-ligt_yellow: #625500;
    --dark-orange: #FF931E;
    --dark-red: #EE3F36;
    --dark-red-light: #f851491a;
    --dark-light: #eeeeee;
    --dark-white: #ffffff;
    --dark-black: #000000;
    --dark-dark: #222222;
    --dark-purple: #632CD0;
    --dark-pink: #F881ED;
    --dark-quiz-blue: #effafd;
    --dark-quiz-border-blue: #ddf2f8;

    --dark-silver-medal: #808080;

    --dark-color-purple-code-text: #632CD0;
    --dark-color-purple-bg: #2d2341;
    --dark-color-purple-border: #632CD0;

    --dark-danger: #cb2431;

    --dark-color-btn-danger-text: #f85149;
    --dark-color-btn-danger-hover-text: #ffffff;
    --dark-color-btn-danger-hover-bg: #EE3F36;
    --dark-color-btn-danger-hover-border: #f85149;

    --dark-color-btn-outline-text: var(--royal-blue);
    --dark-color-btn-outline-border: var(--royal-blue);

    --dark-color-btn-outline-hover-text: var(--dark-blue);
    --colordark--btn-outline-hover-bg: #30363d;
    --colordark--btn-outline-hover-border: var(--dark-blue);

    --dark-text-blue: var(--dark-blue);
    --dark-text-green: #56d364;
    --dark-text-yellow: #FFD500;
    --dark-text-white: #f0f6fc;
    --dark-text-secondary: #8b949e;
    --dark-text-primary: #F9F9F9;
    --dark-text-muted: #A3A3A3;
    --dark-btn-text: #c9d1d9;
    --dark-code-color: #bacbdc;
    --dark-text-placeholder: #A3A3A3;

    --dark-primary: #c9d1d9;
    --dark-color-border-dark: #4a4a4a;
    --dark-color-underlinenav-text: #8b949e;
    --dark-color-underlinenav-text-active: #ffffff;
    --dark-color-underlinenav-border-active: #f9826c;

    --dark-color-btn-primary-bg: #22A55B;
    --dark-color-btn-primary-hover-bg: #3BCA54;
    --dark-color-btn-primary-hover-border: #3BCA54;
    --dark-color-btn-primary-clicked-bg: #38BB4F;
    --dark-color-btn-primary-border: #22A55B;
    --dark-color-btn-primary-text: #ffffff;

    --dark-bg: #0d1117;
    --dark-pre-bg: #121820;

    --dark-color-header-logo: #f0f6fc;
    --dark-color-bg-tertiary: #161b22;
    --dark-color-border-tertiary: #6e7681;

    --dark-btn-border: #30363d;
    --dark-border-blue: #388bfd66;
    --dark-border-blue-light: #388bfd1a;
    --dark-border-gray: var(--black-0);
    --dark-border-light-gray: #3A3D42;
    --dark-border-green: #3fb95066;
    --dark-border-green-light: #2ea0431a;
    --dark-border-red: #f8514966;
    --dark-border-red-light: #f851491a;
    --dark-border-yellow: #bb800966;
    --dark-border-yellow-light: rgb(140, 117, 0);
    --dark-border-white: #ffffff;

    --dark-gray-000: #fafbfc;
    --dark-gray-100: #f6f8fa;
    --dark-gray-500: #6a737d;
    --dark-gray-600: #586069;
    --dark-gray-900: #24292e;

    --dark-secondary: #8b949e;
    --dark-color-text-secondary: #8b949e;

    --dark-color-alert-warn-bg: #221E16;
    --dark-color-alert-warn-border: #bb800966;
    --dark-color-alert-warn-text: #FFD500;

    --dark-color-header-text: #f0f6fcb3;
    --dark-color-header-bg: #373C3F;

    --dark-color-bg-canvas: #373C3F;
    --dark-color-bg-canvas-inset: #1c1e20;
    --dark-color-bg-primary: #373C3F;
    --dark-color-border-primary: #30363d;
    --dark-color-border-secondary: #2C3134;

    --dark-color-input-border: var(--dark-color-border-secondary);
    --dark-color-input-contrast-bg: #0104094d;
    --dark-color-input-bg: #404649;

    --dark-color-alert-info-text: #79c0ff;
    --dark-color-alert-info-border: #388bfd66;
    --dark-bg-alert-info: #0F2034;

    --dark-color-alert-success-bg: #0F231D;
    --dark-color-alert-success-border: #2ea04366;

    --dark-color-alert-danger-bg: #2B181D;
    --dark-color-alert-danger-border: #f8514966;

    --dark-color-bg-overlay: #1e2123;
    --dark-color-border-overlay: #1e2123;

    --dark-color-state-hover-primary-text: #f0f6fc;
    --dark-color-state-hover-primary-bg: #1f6feb;

    --dark-color-btn-text: #ffffff;
    --dark-color-btn-bg: #25272b;
    --dark-color-btn-border: #25272b;
    --dark-color-btn-hover-bg: #515E5E;
    --dark-color-btn-hover-border: #515E5E;
    --dark-color-btn-clicked-bg: #2F3737;
    --dark-color-btn-clicked-border: #2F3737;

    --dark-rand-card-bg: #2e3336;

    --dark-color-profile-color-modes-toggle-thumb-bg: #6e40c9;
    --dark-color-profile-color-modes-toggle-track-border: #3c1e70;
    --dark-color-profile-color-modes-toggle-track-bg: #271052;

    --color-profile-color-modes-toggle-moon: #f8e3a1;

    --dark-color-hint-bg: #4B6262;
    --dark-secondary-bg: #373C3F;
    --dark-color-scroll-bar: #30363d;

    --offset: 30px;

    --dark-danger-alert-bg: #2B181D;
    --dark-danger-alert-border: #f8514966;

    --dark-success-alert-bg: #0F231D;
    --dark-success-alert-border: #2ea04366;
    --dark-success-alert-text: #56d364;
    --dark-color-state-hover-secondary-bg: #161b22;

    --dark-codeeditor-bg: #191D1E;
    --dark-codeeditor-primary-selection-bg: #2A2E32;
    --dark-codeeditor-secandary-selection-bg: #2A2E32;

    --dark-media-li-bg: #373C3F;
    --dark-media-li-border: #3A3D42;

    --dark-popover-bg: #1e2123;

    --dark-task-head-bg: #373C3F;
    --dark-task-head-border: var(--black-0);
    --dark-task-head-closed-border: #3A3D42;

    --dark-codeconsole-bg: #04070C;

    --dark-editor-canvas-holder: #191D1E;
    --dark-nav-bg: #2E3335;

    --dark-quiz-green: #50BF59;
    --dark-quiz-red: #E7403C;

    --dark-quiz-item-bg: #303838;
    --dark-quiz-item-border: transparent;

    /* NEW COLOR */
    --dark-text-muted-2: #A4A4AD;

    --dark-secondary-1: #F9F9F9;
    --dark-secondary-2: #A2A2A2;
    --dark-secondary-3: #9D9D9D;
    --dark-secondary-5: #6B6B6B;

    --dark-secondary-border: #666666;

    --dark-primary-1: #2F3237;

    --dark-accent-1: #2C3134;

    --dark-bg-primary-2: #2e3437;
    --dark-bg-secondary-1: #2C3134;

    --dark-task-head-closed-bg: #373C3F;
    --dark-card-bg: #2e3437;

    --dark-score-bar-green: #22A55B;

    --dark-color-prettylights-syntax-keyword: #ff7b72;

}

body.dark-mode {
    background-color: #2F3437;
    color: var(--dark-text-primary);
    scrollbar-color: var(--dark-color-scroll-bar) transparent;
}

body.dark-mode ::-webkit-scrollbar-thumb:hover {
    display: block;
    background-color: var(--dark-color-scroll-bar);
}

body.dark-mode ::-webkit-input-placeholder { /* WebKit, Blink, Edge */
    color: var(--dark-text-placeholder);
}

body.dark-mode :-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: var(--dark-text-placeholder);
    opacity: 1;
}

body.dark-mode ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: var(--dark-text-placeholder);
    opacity: 1;
}

body.dark-mode :-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--dark-text-placeholder);
}

body.dark-mode ::-ms-input-placeholder { /* Microsoft Edge */
    color: var(--dark-text-placeholder);
}

body.dark-mode ::placeholder { /* Most modern browsers support this now. */
    color: var(--dark-text-placeholder);
}

body.dark-mode .main-content {
    border-color: var(--black-0);
}

body.dark-mode .btn-green {
    color: #f7f7f7;
    border-color: var(--dark-green);
    background-color: var(--dark-green);
}
body.dark-mode .btn-green:hover,
body.dark-mode .btn-green:focus,
body.dark-mode .btn-green:active,
body.dark-mode .btn-green.active,
body.dark-mode .open>.dropdown-toggle.btn-green {
    color: #f7f7f7;
    border-color: var(--dark-green);
    background-color: var(--dark-green);
}


body.dark-mode .openyellow {
    color: var(--dark-yellow);
}

body.dark-mode .text-muted-2 {
    color: var(--dark-text-muted-2);
}

body.dark-mode .text-muted {
    color: var(--text-muted);
}

body.dark-mode .list-group-item.page-path-holder:first-child {
    border-color: var(--black-0);
    background-color: var(--dark-secondary-bg);
}

body.dark-mode .list-group-item.page-path-holder .breadcrumb-item a {
    color: #ffffff;
}

body.dark-mode .list-group-item.page-path-holder .breadcrumb-item.active a {
    color: var(--dark-secondary-2);
}

body.dark-mode .bg-primary-2 {
    background-color: #2e3437;
}

body.dark-mode .border-green-im {
    border-color: #288a3a !important;
}

body.dark-mode .border-blue {
    border-color: var(--dark-blue);
}

body.dark-mode .input-group .form-control:first-child {
    border-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .progress-page .prTblHolder {
    border-color: var(--black-0);
    background-color: var(--dark-secondary-bg);
}

body.dark-mode .user-card-footer a,
body.dark-mode .breadcrumb-item a,
body.dark-mode .popover .popover-content .nav-stacked > li > a:not(.text-inherit) {
    color: var(--dark-blue-link);
}

body.dark-mode .home-card-holder .top-item-box .item-action a.btn {
    background-color: black;
    color: #ffffff;
}

body.dark-mode a:not(.text-inherit):not(.btn-octicon-danger):not(.btn):not(.btn-octicon):not(.nav-link):not(.dropdown-toggle):not(.uname):not(.category-title):not(.rptl) {
    color: var(--dark-blue);
}

body.dark-mode .home-card-holder .k-card a:hover {
    color: var(--dark-blue);
}

body.dark-mode .list-group-item.page-path-holder ol.breadcrumb li.breadcrumb-item:not(.active),
body.dark-mode .list-group-item.page-path-holder ol.breadcrumb li.breadcrumb-item a:not(.active) {
    color: #ffffff !important;
}

body.dark-mode .breadcrumb > .active {
    color: var(--dark-text-muted-2) !important;
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.bug img {
    content: url("/statics/img/icons/light/navbar/bug.svg");
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.knobs img {
    content: url("/statics/img/icons/light/navbar/knobs.svg");
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.moon img {
    content: url("/statics/img/icons/light/navbar/moon.svg");
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.logout img {
    content: url("/statics/img/icons/light/navbar/logout.svg");
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.zoom img {
    content: url("/statics/img/icons/light/navbar/zoom.svg");
}
body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.survey img {
    content: url("/statics/img/icons/light/navbar/survey.svg");
}

body.dark-mode .navbar-collapse ul.navbar-right li.panel-menu-item.time img {
    content: url("/statics/img/icons/light/navbar/time.svg");
}

body.dark-mode div.openSvgIcon.open {
    background-image: url("/statics/img/icons/dark/chevron-right-20.svg");
}

body.dark-mode div.openSvgIcon.lock {
    background-image: url("/statics/img/icons/lock-closed-24.svg");
}

body.dark-mode div.compSvgIcon:not(.done):not(.inprogress) {
    background-image: url("/statics/img/icons/dark/circle-24.svg");
}

body.dark-mode div.compSvgIcon.done {
    background-image: url("/statics/img/icons/circletick-24.svg");
}
body.dark-mode .k-step .media-body span.zoomIcon {
    background-image: url("/statics/img/icons/light/nozoom.svg");
}

body.dark-mode .k-step .course-div-body span.cid,
body.dark-mode .k-step .module-div-body span.cid {
    color: #A3A3A3;
}

body.dark-mode .paginate_button a {
    color: var(--dark-white) !important;
}

body.dark-mode .k-step .post-item .item-header a.go h5 {
    color: var(--dark-blue);
}

body.dark-mode .btn-collapser {
    color: var(--dark-secondary-1);
}

body.dark-mode .k-step.item .course-intro p.desc,
body.dark-mode .k-step.item .activity-intro p.desc {
    color: var(--dark-secondary-1);
}

body.dark-mode .k-step .post-item.item-holder div.post-item-idx {
    border-right-color: #1E1E1E;
}

body.dark-mode span.fa.item-open {
    color: var(--dark-secondary-3);
}

body.dark-mode .k-step .post-item.item-holder:last-child:hover {
    border-radius: 0 0 8px 8px
}

body.dark-mode .k-step .post-item.item-holder:hover,
body.dark-mode .list-group-item.course-item .course-div-body:hover {
    background-color: #2C3134;
}

body.dark-mode .k-step .post-item.item-holder div.post-item-status.open,
body.dark-mode .k-step .post-item.item-holder div.post-item-status.open a {
    color: #ffffff !important;
    background-color: #2F3237;
}

body.dark-mode .k-step .post-item.item-holder div.post-item-status.luck,
body.dark-mode .k-step .post-item.item-holder div.post-item-status.luck a {
    color: #ffffff !important;
    background-color: #25282D;
}

body.dark-mode .k-step .post-item.item-holder.activity,
body.dark-mode .k-step .post-item.item-holder.step {
    border-bottom: 1px solid var(--dark-color-border-secondary);
}

/*body.dark-mode .k-step .post-item:hover {*/
/*    background-color: transparent;*/
/*}*/

body.dark-mode .filtered,
body.dark-mode a.filtered {
    color: var(--dark-blue) !important;
}

body.dark-mode .k-step .post-item .item-header a.go:not(.text-inherit) h5,
body.dark-mode .selected-item-type,
body.dark-mode span.courseItemIcon {
    color: var(--dark-blue);
}

body.dark-mode #l1,
body.dark-mode #r1 {
    background-color: var(--dark-secondary-bg);
    border-color: var(--black-0);
}

body.dark-mode .scoreboard .badges .more-badges {
    color: var(--dark-secondary-2);
}

body.dark-mode #tasksList .scoreboard-post {
    border-color: var(--black-0);
}

body.dark-mode #tasksList .scoreboard-post hr.seperator {
    background-color: var(--dark-accent-1);
}

body.dark-mode .user-info-bar div.name-holder,
body.dark-mode .user-info-bar ul.scoreboard {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .student-info-sidebar span.text-inherit {
    color: var(--dark-text-primary);
}

body.dark-mode .btn.navbar-btn-avitar {
    background-color: transparent;
}

body.dark-mode .btn.navbar-btn-avitar:hover {
    background-color: transparent;
}

body.dark-mode .user-name {
    color: var(--primary) !important;
}

/*.post-item li a.text-inherit span:not(#myStudentCount) */
body.dark-mode .user-card a.text-inherit {
    color: var(--dark-text-primary);
}

body.dark-mode .silver-medal-color {
    color: var(--dark-silver-medal)
}

body.dark-mode .k-color-green {
    color: var(--dark-green);
}

body.dark-mode .k-color-red {
    color: var(--dark-red)
}

body.dark-mode .k-color-blue {
    color: var(--dark-blue);
}

body.dark-mode .k-color-light-blue {
    color: var(--dark-blue-light)
}

body.dark-mode .k-color-orange {
    color: var(--dark-orange);
}

body.dark-mode .k-color-orange-im {
    color: var(--dark-orange) !important;
}

body.dark-mode .k-color-green-im {
    color: var(--dark-green) !important;
}

body.dark-mode .k-color-red-im {
    color: var(--dark-red) !important;
}

body.dark-mode .k-color-blue-im {
    color: var(--dark-blue) !important;
}

body.dark-mode .text-secondary {
    color: var(--dark-color-text-secondary);
}

body.dark-mode .text-secondary-im {
    color: var(--dark-color-text-secondary) !important;
}

body.dark-mode blockquote {
    border-left: 5px solid #121921;
}

body.dark-mode .tr-ads-panel {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .progress-page div#logsTblHolder,
body.dark-mode .progress-page div#activitiesLogsTblHolder

{
    border-color: var(--black-0);
    background-color: var(--dark-color-bg-primary);
}

body.dark-mode .course-progress-table .table > thead > tr > th {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .alert-success {
    background-color: #0F231D;
    border-color: #2ea04366;
    color: #56d364;
}

body.dark-mode .alert-warning {
    background-color: #221E16;
    border-color: #bb800966;
    color: var(--dark-yellow);
}

body.dark-mode .alert-danger {
    background-color: #2B181D;
    border-color: #f8514966;
    color: #ff7b72;
}

body.dark-mode .alert-info {
    background-color: #112036;
    border-color: #388bfd66;
    color: #79c0ff;
}

/*body.dark-mode .progress-table,*/
body.dark-mode .course-progress-table,
body.dark-mode table.dataTable.no-footer {
    background-color: var(--dark-color-bg-primary);
    border-color: var(--dark-border-gray);
}

body.dark-mode .trTimelogDiv table.dataTable.no-footer {
    background-color: transparent;
    border-color: var(--dark-border-gray);
    border: 2px solid;
    border-color: var(--black-0);
    /* padding: 0 10px; */
    border-radius: 10px;
}

body.dark-mode .progress-table a {
    color: var(--dark-text-primary);
}

body.dark-mode .chart-wrapper div.anys-details h5 {
    color: #656565;
}

body.dark-mode .progress-selector div.srch button,
body.dark-mode .category-toolbar div.srch button,
body.dark-mode #addCourseModal div.srch button {
    background-color: var(--dark-color-border-secondary);
}

body.dark-mode .category-toolbar div.srch button,
body.dark-mode #addCourseModal div.srch button {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .progress-table .table > thead:first-child > tr:first-child > th {
    border: var(--dark-color-border-secondary);
    color: var(--dark-text-muted-2);
}

body.dark-mode .progress-charts .prchart,
body.dark-mode .student-details-body .task-item.post-item.task-reports > div {
    background-color: #191D1E;
}

body.dark-mode .table > thead > tr > th,
body.dark-mode .table > tbody > tr > th,
body.dark-mode .table > tfoot > tr > th,
body.dark-mode .table > thead > tr > td,
body.dark-mode .table > tbody > tr > td,
body.dark-mode .table > tfoot > tr > td {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .chat-notification,
body.dark-mode .feeds-notification {
    color: #222222;
    background-color: var(--yellow);
    border-color: var(--yellow);
}

body.dark-mode .popover {
    text-decoration-color: initial;
    text-shadow: none;
    background-color: var(--dark-color-bg-overlay);
    border-color: var(--dark-color-border-overlay);
    box-shadow: none;
}

body.dark-mode .popover.bottom > .arrow {
    border-bottom-color: var(--dark-color-border-overlay);
}

body.dark-mode .popover.bottom > .arrow::after {
    border-bottom-color: var(--dark-color-border-overlay);
}

body.dark-mode .logoutbtn {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .ni a {
    color: var(--dark-text-primary) !important;
}

body.dark-mode .navbar-default .navbar-toggle:hover,
body.dark-mode .navbar-default .navbar-toggle:focus {
    background-color: var(--dark-color-bg-canvas-inset);
}

body.dark-mode .navbar-default .navbar-toggle {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .panel-my-trainers .list-my-trainers li {
    background-color: var(--dark-color-bg-canvas);
    border-bottom-color: var(--dark-border-gray);
}

body.dark-mode .nav > li > a:hover,
body.dark-mode .nav > li > a:focus {
    background-color: transparent;
}

body.dark-mode .nav-tabs > li > a {
    color: var(--dark-color-underlinenav-text) !important;
}

body.dark-mode .k-color-blue {
    color: var(--dark-blue);
}

body.dark-mode .btn {
    color: var(--dark-color-btn-text);
    background-color: var(--dark-color-btn-bg);
    border-color: var(--dark-color-btn-border);
    box-shadow: none !important;
    transition: .2s cubic-bezier(.3, 0, .5, 1);
    transition-property: color, background-color, border-color;
}

body.dark-mode .btn:not(.navbar-btn-avitar).hover,
body.dark-mode .btn:not(.navbar-btn-avitar):hover,
body.dark-mode .action-btn:hover,
body.dark-mode [open] > .btn {
    background-color: var(--black-0);
    border-color: var(--black-0);
    color: #ffffff;
    transition-duration: .1s;
}

body.dark-mode .dt-button.buttons-csv.buttons-html5 {
    color: var(--dark-color-btn-text);
    background-color: var(--dark-color-btn-bg) !important;
    border-color: var(--dark-color-btn-border) !important;
    box-shadow: none !important;
    transition: .2s cubic-bezier(.3, 0, .5, 1);
    transition-property: color, background-color, border-color;
}
body.dark-mode .dt-button.buttons-csv.buttons-html5:hover{
    background-color: var(--black-0) !important;
    border-color: var(--black-0) !important;
    color: #ffffff;
    transition-duration: .1s;
}


body.dark-mode.btn-outline {
    color: var(--dark-color-btn-outline-text);
}

body.dark-mode.btn-danger {
    color: var(--dark-color-btn-danger-text) !important;
}

body.dark-mode .btn-danger:hover,
body.dark-mode [open] > .btn-danger {
    color: var(--dark-color-btn-danger-hover-text) !important;
    background-color: var(--dark-color-btn-danger-hover-bg) !important;
    border-color: var(--dark-color-btn-danger-hover-border) !important;
}

body.dark-mode .btn-outline:hover,
body.dark-mode [open] > .btn-outline {
    color: var(--dark-color-btn-outline-hover-text) !important;
    background-color: var(--colordark--btn-outline-hover-bg) !important;
    border-color: var(--colordark--btn-outline-hover-border) !important;
}

body.dark-mode .btn-outline-danger:hover,
body.dark-mode [open] > .btn-outline-danger {
    color: #ffffff;
    background-color: var(--dark-color-btn-danger-hover-bg) !important;
    border-color: var(--dark-color-btn-danger-hover-border) !important;
}

body.dark-mode .btn-primary {
    color: #ffffff !important;
    background-color: var(--dark-color-btn-primary-bg) !important;
    border-color: var(--dark-color-btn-primary-border) !important;
    box-shadow: none;
}

body.dark-mode .btn-primary:hover {
    background-color: var(--dark-color-btn-primary-hover-bg) !important;
    border-color: var(--dark-color-btn-primary-hover-bg) !important;
}

body.dark-mode .btn-primary:focus {
    background-color: var(--dark-color-btn-primary-clicked-bg) !important;
    border-color: var(--dark-color-btn-primary-clicked-bg) !important;
}

body.dark-mode .btn-outline-green:hover,
body.dark-mode [open] > .btn-outline-green {
    color: var(--dark-white) !important;;
    background-color: var(--dark-color-btn-primary-hover-bg) !important;;
    border-color: var(--dark-color-btn-primary-hover-bg) !important;;
}

body.dark-mode .k-step .code-editor-left.light .chat-cnt {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='30' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23282c32' stroke-width='10' %3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");
}

body.dark-mode .panel-profile {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .panel-profile-img {
    box-shadow: none;
    border-color: var(--black-0);
}

body.dark-mode .navbar-default {
    box-shadow: none;
    background-color: var(--dark-color-header-bg);
    border-bottom: 2px solid var(--dark-border-gray);
}

body.dark-mode .score-captions li a {
    color: #ffffff;
}

body.dark-mode .navbar-default .navbar-collapse,
body.dark-mode .navbar-default .navbar-form {
    border-color: var(--dark-border-gray);
}

/*body.dark-mode .app-navbar .container-fluid .navbar-brand div.logo-word,*/
/*body.dark-mode .app-navbar .container .navbar-brand div.logo-word {*/
/*    background-image: url(/statics/img/logo/cubie-word-white.svg);*/
/*}*/

body.dark-mode .panel {
    /*background-color: transparent;*/
    border-color: transparent;
    box-shadow: none;
}

body.dark-mode .canvas-inset-bg {
    background-color: var(--dark-color-bg-canvas-inset);
}

body.dark-mode .canvas-bg {
    background-color: var(--dark-color-bg-canvas);
}

body.dark-mode .list-group-item {
    background: var(--dark-media-li-bg);
    border-color: var(--black-0);
    box-sizing: border-box;
    box-shadow: none !important;
}

body.dark-mode .k-step:not(.builder) {
    box-shadow: none;
}

body.dark-mode .breadcrumb {
    background-color: transparent;
    border-color: var(--dark-border-gray);
}

body.dark-mode .task-asset-viw {
    background-color: #191D1E;

}

body.dark-mode #WebNotificationsBar {
    background-color: #221E16;
    border-color: #bb800966;
    color: var(--dark-yellow);
}

body.dark-mode .k-step.lesson .task-head,
body.dark-mode .k-step .task-head,
body.dark-mode .activity-items .item .task-head,
body.dark-mode .course-items .item .task-head {
    background-image: none;
    background-color: var(--dark-task-head-bg);
    border-bottom: 1px solid var(--dark-color-border-secondary);
    box-sizing: border-box;
    box-shadow: none !important;
}

body.dark-mode .k-step.lesson.closed-task .task-head,
body.dark-mode .k-step .task-head.closed,
body.dark-mode .k-step.lesson[data-status="done"] .task-head:not(.opened),
body.dark-mode .activity-items .item .task-head.closed .k-step.lesson .task-head.closed {
    background-color: var(--dark-task-head-closed-bg);
    border: 1px solid var(--dark-task-head-closed-border);
    box-sizing: border-box;
    box-shadow: 0px 4px 80px rgba(255, 255, 255, 0.03);
    background-image: none !important;
}

body.dark-mode .nav-tabs:not(.nav-code),
body.dark-mode .nav-tabs:not(.nav-tr),
body.dark-mode .nav-tabs:not(.nav-tr-side),
body.dark-mode .nav-tabs:not(.nav-st) {
    border-bottom-color: var(--black-0);
}

body.dark-mode .nav-tabs.prchart {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .nav-tabs.nav-analysis {
    background-color: #191D1E;
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .code-editor-left.light .nav.nav-editor > li > a {
    color: var(--dark-text-secondary);
}

body.dark-mode .k-step .code-editor-right.light .xp-holder {
    background-color: #121921;
    color: #ffffff;
}

body.dark-mode .nav-tabs.htmltask-nav,
body.dark-mode div.editor-tabs-holder {
    background-color: transparent;
    border-bottom-color: var(--black-0);
}

body.dark-mode .nav-tabs > li.active > a,
body.dark-mode .nav-tabs > li > a:hover {
    border-color: initial;
    color: var(--dark-color-underlinenav-text-active) !important;
    background-color: transparent !important;
}

body.dark-mode .precode-nav-li a,
body.dark-mode .lesson-path-li a {
    color: var(--dark-color-header-logo) !important;
}

body.dark-mode .navbar-default .navbar-nav > li > a {
    color: var(--dark-color-header-logo);
}

body.dark-mode .navbar-default .navbar-nav > li > a:hover {
    color: var(--dark-color-header-text);
}

body.dark-mode .code-editor-left.light .nav-pills.nav-editor > li.active > a,
body.dark-mode .code-editor-left.light .nav-pills.nav-editor > li.active > a:hover,
body.dark-mode .code-editor-left.light .nav-pills.nav-editor > li.active > a:focus {
    color: var(--dark-color-underlinenav-text-active)
}

body.dark-mode .panel-menu-item {
    border-right-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .k-step .code-task-hints div.hintItems.light .answer-box {
    border-color: var(--dark-accent-1);
    box-shadow: 0px 4px 0px var(--dark-accent-1);
}

body.dark-mode .k-step .code-task-hints div.hintItems.light dl {
    border-color: var(--dark-accent-1);
    box-shadow: 0px 4px 0px var(--dark-accent-1);
}

body.dark-mode .k-step .code-task-hints div.hintItems.light dd {
    border-color: var(--dark-accent-1);
}

body.dark-mode .k-step .code-task-hints div.hintItems.light .icon-light-bulb {
    color: var(--yellow);
}

body.dark-mode .k-step .code-task-hints div.hintItems.light dd p,
body.dark-mode .k-step .code-task-hints div.hintItems.light dt,
body.dark-mode .k-step .code-task-hints div.hintItems .answer-box .xp-badge {
    color: #ffffff;
}

body.dark-mode .k-step div.hintItems.light button.btn-get-hints,
body.dark-mode .k-step div.hintItems.light button.btn-get-answer {
    background-color: #2F3237;
}

body.dark-mode .k-step .code-task-hints div.hintItems.light button.btn-get-hints:hover,
body.dark-mode .k-step .code-task-hints div.hintItems.light button.btn-get-answer:hover {
    box-shadow: none;
    background-color: var(--dark-accent-1);
}

body.dark-mode .k-step .code-task-hints div.hintItems dt div.hint-icon {
    background-color: var(--dark-accent-1);
}

/*body.dark-mode .course-toolbar .text-inherit h5,*/
body.dark-mode .courseslist .text-inherit,
body.dark-mode .post-item li a.text-inherit span:not(#myStudentCount) {
    color: var(--dark-text-secondary);
}

body.dark-mode .course-toolbar .text-inherit h5,
body.dark-mode .item-header.courseslist a.text-inherit h5.status {
    color: var(--dark-text-primary);
}

body.dark-mode .wrong {
    /*background-color: #132e51 !important;*/
    border-color: var(--dark-red) !important;
}

body.dark-mode .builder .editable-container h5.editable-trigger {
    color: #7c8288;
}

body.dark-mode .category-toolbar #c1,
body.dark-mode .category-toolbar #c2 {
    background-color: var(--dark-media-li-bg);
}

body.dark-mode .dropdown-menu > .active,
body.dark-mode .dropdown-menu > .active > a,
body.dark-mode .dropdown-menu > .active > a:hover,
body.dark-mode .dropdown-menu > .active > a:focus {
    background-color: #21262d;
    color: var(--blue);
}

body.dark-mode .btn-k-border-green.selected,
body.dark-mode .btn-k-border-green:hover {
    color: #fff;
    background-color: var(--dark-green);
}

body.dark-mode .k-step .reviewingBar {
    color: var(--black-0);
    background-color: var(--review-blue);
    box-shadow: inset 0px 2px 0px var(--black-0);
    background-image: url("/statics/img/svg/circuit.svg");
}

body.dark-mode .k-step .revisionBar {
    color: var(--black-0);
    background: var(--yellow);
    box-shadow: inset 0px 2px 0px var(--black-0);
    background-image: url("/statics/img/svg/circuit.svg");
}

body.dark-mode .k-step .successBar {
    color: var(--black-0);
    box-shadow: inset 0px 2px 0px var(--black-0);
}

body.dark-mode .k-step .successBar:not(.onlysbtn) {
    background-color: #22A55B;
    background-image: url("/statics/img/svg/circuit.svg");
}

body.dark-mode .k-step .successBar > p strong {
    color: var(--dark-text-primary);
}

/*body.dark-mode .toolbar.htmlrunbar button.runcode {*/
/*    border: 0;*/
/*    background-color: var(--black-0);*/
/*    color: #ffffff !important;*/
/*}*/

body.dark-mode .k-step .toolbar.wrong {
    color: var(--black-0);
    background-color: var(--yellow) !important;
    box-shadow: inset 0 2px 0 var(--black-0);
}

body.dark-mode .k-step .toolbar,
body.dark-mode .k-step .extraTasks {
    background-color: var(--dark-task-head-bg);
    border-color: var(--dark-border-gray);
}

body.dark-mode .k-step .toolbar button.btn-check {
    background-color: var(--black-0);
    border-color: var(--black-0);
}

body.dark-mode .k-step .toolbar button.btn-check:hover {
    border-color: var(--black-0);
}

body.dark-mode .k-step .details-trigger .task-feedback-li {
    border-color: var(--dark-primary-1);
    background-color: var(--dark-secondary-bg);
    box-shadow: inset 0px 1px 0px var(--dark-primary-1);
}

body.dark-mode .k-step .details-trigger .task-feedback-li span {
    color: var(--dark-secondary-2);
}

body.dark-mode .k-step .details-trigger .diffAct {
    background-color: #2F3237;
    color: #ffffff;
}

body.dark-mode .k-step .details-trigger .task-feedback-li div.svgIcon.rating {
    background-image: url("/statics/img/icons/dark/rating-message-24.svg");
}

body.dark-mode .k-step .details-trigger .task-feedback-li div.svgIcon.happy-face {
    background-image: url("/statics/img/icons/dark/happy-face-24.svg");
}

body.dark-mode .k-step .extraTasks {
    color: #ffffff;
}

body.dark-mode .k-step .code-editor-left.light button.continue {
    background-color: var(--dark-green) !important;
    color: var(--dark-text-primary) !important;
}

body.dark-mode .action-btn {
    color: var(--dark-color-btn-text) !important;
    background-color: var(--dark-color-btn-bg) !important;
    border-color: var(--dark-color-btn-border) !important;
    box-shadow: none !important;
}

body.dark-mode .breadcrumb > li + li:before {
    color: var(--dark-secondary);
}

/*body.dark-mode .student-info-sidebar:not(:last-child) {*/
body.dark-mode .student-info-sidebar {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .student-info-sidebar a {
    color: #ffffff;
}

body.dark-mode .student-info-sidebar a:hover {
    color: #ffffff;
}

body.dark-mode .k-step .code-task-hints button.btn-get-hints,
body.dark-mode .k-step .code-task-hints button.btn-get-answer {
    color: var(--primary) !important;
}

body.dark-mode .k-category .student-selected-items .breadcrumb-item {
    color: var(--dark-text-secondary);
}

body.dark .k-category .student-selected-items .breadcrumb-item {
    color: var(--dark-text-primary);
}

body.dark-mode .k-category .head .item-actions .item-time,
body.dark-mode .k-category div.info small.sid {
    color: var(--dark-text-muted-2);
}

body.dark-mode .code-editor-right.light .nav.nav-editor > li > a {
    color: var(--dark-color-underlinenav-text);
}

body.dark-mode .k-step .task-code-editor-container {
    background-color: var(--dark-color-bg-canvas-inset);
    border-color: var(--dark-border-gray);
}

body.dark-mode .code-editor-left.light .codeEventsTabs-holder {
    background-color: var(--dark-editor-canvas-holder);
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .code-editor-right.light,
body.dark-mode .code-editor-left.light {
    border-bottom-color: var(--dark-color-border-secondary)
}

body.dark-mode .code-editor-left.light {
    border-color: var(--dark-color-border-secondary)
}

body.dark-mode .k-step .code-editor-right.light .chat-cnt {
    background-color: var(--dark-editor-canvas-holder);
    border-color: var(--dark-border-gray);
    background-image: none;
}

body.dark-mode .uploadBodyDiv form input[type='file'] {
    border-color: var(--dark-color-border-secondary);
    background-color: var(--dark-color-bg-canvas)
}

/*body.dark-mode .code-editor-right.light .task-canvas iframe,*/
body.dark-mode .code-editor-right.light .editor-canvas-holder,
body.dark-mode .builder-uploadBar,
body.dark-mode .progress {
    background-color: var(--dark-editor-canvas-holder);
}

body.dark-mode .code-editor-right.light .task-canvas.py,
body.dark-mode .code-editor-right.light .task-canvas.py iframe {
    /*background-color: var(--dark-color-bg-canvas-inset);*/
    background-color: transparent;
}

body.dark-mode .k-step .code-editor-right .score-holder {
    color: var(--black-0);
}

body.dark-mode .k-step .code-editor-right .score-holder .score-body.done {
    background-color: var(--dark-score-bar-green);
}

body.dark-mode .k-step .code-editor-right .score-holder .score-body button.continue,
body.dark-mode .k-step .code-editor-right .score-holder .score-body button.close-error-notif {
    background-color: var(--black-0);
    color: #ffffff;
}

body.dark-mode .k-step .code-editor-right .score-holder .score-body button.continue:active {
    background-color: var(--black-0) !important;
}

body.dark-mode .k-step .code-editor-right.light .error-notif-holder {
    color: var(--black-0);
}

body.dark-mode .k-step .code-editor-right.light .error-notif-holder button.close-error-notif {
    background-color: var(--black-0);
    color: #ffffff;
}

body.dark-mode .task-feedback.selected, .task-feedback-link.selected {
    color: var(--dark-green) !important;
}

body.dark-mode .k-step .details-trigger .task-feedback.selected,
body.dark-mode .k-step .details-trigger .task-difficulty.selected {
    color: var(--dark-green) !important;
}

body.dark-mode .builder-uploadBar,
body.dark-mode .upload-holder {
    border-color: var(--dark-color-border-secondary);
}

/* body.dark-mode code:not(.language-python) { */
    /*color: var(--dark-code-color) !important;*/
/* } */

body.dark-mode code.language-python {
    color: #b3bac3 !important;
}

body.dark-mode code {
    color: var(--dark-blue-code) !important;
    background-color: var(--dark-pre-bg) !important;
}

body.dark-mode pre:not(.hljs) {
    color: var(--dark-blue);
    background-color: var(--dark-pre-bg);
    border-color: var(--dark-pre-bg) !important;
}

body.dark-mode .k-step .task-hints {
    background-image: none;
    color: #ffffff;
    background-color: var(--dark-color-bg-primary);
    border-color: #212425;
    box-shadow: 0px 4px 0px #212325;
}

body.dark-mode .k-step .task-hints .hint-icon {
    background-color: var(--dark-bg-secondary-1);
}

body.dark-mode .code-editor-left.light .tab-content.edh {
    border-right-color: var(--dark-border-gray);
}

body.dark-mode .code-editor-left.light .toolbar.code-toolbar,
body.dark-mode .task-code-editor-container.light .toolbar.code-toolbar {
    border-top-color: var(--dark-color-border-secondary);
    background-color: var(--dark-color-bg-canvas-inset);
}

body.dark-mode .code-editor-left.light .code-toolbar ul li button.submit {
    color: #ffffff;
    border-color: var(--dark-blue-btn);
    background-color: var(--dark-blue-btn);;
}

body.dark-mode .code-editor-left.light .code-toolbar ul li button:not(.submit),
body.dark-mode .blankcnt .outputBar .runcode,
body.dark-mode .blankcnt .outputBar .openFile {
    color: #ffffff;
    border-color: #ffffff;
    background-color: #191D1E;
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .k-step.task-holder .tsk-info div#i2 div.diff {
    background-image: url("/statics/img/icons/dark/task-header/signal.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i2 div.eta {
    background-image: url("/statics/img/icons/dark/task-header/time.svg");
    background-repeat: no-repeat;
}

body.dark-mode .k-step.task-holder .tsk-info div#i2 div.bit {
    background-image: url("/statics/img/icons/dark/task-header/bit.svg");
    background-repeat: no-repeat;
}

body.dark-mode .k-step.task-holder .tsk-info div#i2 div.coin {
    background-image: url("/statics/img/icons/dark/task-header/coin.svg");
    background-repeat: no-repeat;
}

body.dark-mode .k-step.task-holder .tsk-info div#i2 div.execution {
    background-image: url("/statics/img/icons/dark/task-header/speedometer.svg");
    background-repeat: no-repeat;
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.code,
body.dark-mode .builder .task-head div.svgicon.code {
    background-image: url("/statics/img/icons/dark/task-header/coding.svg");
}

body.dark-mode #unsavedCodeModal #cmlHolder div.svgicon.code {
    background-image: url("/statics/img/icons/dark/task-header/coding16.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.blank,
body.dark-mode .builder .task-head div.svgicon.blank {
    background-image: url("/statics/img/icons/dark/task-header/fill-the-blank.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.drag,
body.dark-mode .builder .task-head div.svgicon.drag {
    background-image: url("/statics/img/icons/dark/task-header/option.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.quiz,
body.dark-mode .builder .task-head div.svgicon.quiz {
    background-image: url("/statics/img/icons/dark/task-header/quiz.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.upload,
body.dark-mode .builder .task-head div.svgicon.upload {
    background-image: url("/statics/img/icons/dark/task-header/upload.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.text,
body.dark-mode .builder .task-head div.svgicon.text {
    background-image: url("/statics/img/icons/dark/task-header/textual.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.video,
body.dark-mode .builder .task-head div.svgicon.video {
    background-image: url("/statics/img/icons/dark/task-header/video.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.order,
body.dark-mode .builder .task-head div.svgicon.order {
    background-image: url("/statics/img/icons/dark/task-header/reaarange-the-code.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.essay,
body.dark-mode .builder .task-head div.svgicon.essay {
    background-image: url("/statics/img/icons/dark/task-header/essay.svg");
}

body.dark-mode .k-step.task-holder .tsk-info div#i1 div.svgicon.analysis,
body.dark-mode .builder .task-head div.svgicon.analysis {
    background-image: url("/statics/img/icons/dark/task-header/analysis.svg");
}

body.dark-mode .k-step .code-editor-left.light .outputBar,
body.dark-mode .kstudio .code-editor-left.light .kstudio-output,
body.dark-mode .blankcnt .outputBar {
    background-color: var(--dark-color-bg-canvas-inset);
    color: var(--dark-blue);
}

body.dark-mode .k-step .outputBar .titlebar,
body.dark-mode .kstudio .kstudio-output .titlebar,
body.dark-mode .blankcnt .outputBar .titlebar {
    background-color: var(--dark-color-bg-canvas-inset);
    border-top-color: var(--dark-color-border-secondary);
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .k-step .code-editor-left.light .outputBar .titlebar span.caption,
body.dark-mode .kstudio .code-editor-left.light .kstudio-output .titlebar span.caption,
body.dark-mode .blankcnt .outputBar .titlebar span.caption {
    color: var(--dark-text-primary);
}

body.dark-mode .code-editor-left.light .editor-canvas-holder {
    background-color: var(--dark-color-bg-canvas-inset);
}

body.dark-mode .k-step .code-editor-left.light .chat-cnt {
    background-color: var(--dark-bg);
}

body.dark-mode .k-step .code-editor-left.light .help-list .help-box.code-hb {
    background-color: transparent;
}

body.dark-mode .k-step .help-list textarea.text-comment {
    background-color: transparent !important;
    border-color: var(--dark-border-gray);
    box-shadow: none;
}

body.dark-mode .k-step .help-list .help-items.code-hi,
body.dark-mode .k-step .code-editor-left.dark .help-list .help-items.code-hi,
body.dark-mode .kstudio .code-editor-left.dark .help-list .help-items.code-hi {
    background-color: transparent;
    border-color: #3a3d42;
}

body.dark-mode .k-step .code-editor-left.light .help-list .help-message-sent.code,
body.dark-mode .k-step .code-editor-left.light .help-list .help-message-received.code {
    background-color: var(--dark-bg);
    border-color: var(--dark-border-gray);
    color: var(--dark-text-primary);
}

body.dark-mode .k-step .help-list .chatSender {
    color: var(--dark-text-primary);
}

/*body.dark-mode .k-step .code-editor-right.light .help-list .replyTo {*/
/*    background-color: #374040;*/
/*}*/

body.dark-mode .k-step .help-list .help-message-received .replyTo {
    background-color: #191d1e;
}

body.dark-mode .k-step .help-list .help-message-sent .replyTo {
    background-color: #0045B4;
}

body.dark-mode .k-step .help-list .help-message-received .media-body-secondary,
body.dark-mode .k-step .help-list .help-message-sent .media-body-secondary {
    color: var(--dark-text-secondary) !important;
}

body.dark-mode .help-list .btn-send-comment {
    background-color: #2F3237;
}

body.dark-mode .help-list .btn-send-comment div.svgIcon.send {
    background-image: url("/statics/img/icons/dark/arrow-up-24.svg");
}

body.dark-mode .help-list .media-file div.svgIcon.plus {
    background-image: url("/statics/img/icons/dark/plus-24.svg");
}

body.dark-mode .help-list .media-file label.btn {
    border-color: #ffffff;
}

body.dark-mode .k-step .help-list .help-box {
    border-color: var(--dark-bg-secondary-1);
}

body.dark-mode .k-step .help-list .help-box textarea ::-ms-input-placeholder {
    color: #818181;
}

body.dark-mode .k-step .help-list .help-message-sent {
    background-color: var(--royal-blue);
    color: #ffffff;
}

body.dark-mode .k-step .help-list .help-message-received {
    background-color: #2B3234;
    color: #ffffff;
}

body.dark-mode .k-step .help-list .help-items img.img-circle {
    border-color: var(--black-0);
}

body.dark-mode .k-step .help-list .help-items div.help-msg .chatSender {
    color: var(--purple);
}

body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-sent span.chatTime {
    color: #ffffff;
}

body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-received span.chatTime {
    color: var(--dark-secondary-5);
}

body.dark-mode .k-step .help-list .help-items:last-child {
    border-top: 0;
    border-color: var(--dark-media-li-border);
}

body.dark-mode .k-step .kstudio .help-list {
    background-image: none;
}

body.dark-mode .help-list .file_items .help-media-item {
    background: #373C3F;
    border-color: #2C3134;
    box-shadow: 0px 4px 0px #2C3134;
}

body.dark-mode .help-list .file_items .help-media-item div.svgIcon.file,
body.dark-mode .k-step .help-list .help-items .help-msg div.files div.fileSvg.b {
    background-image: url("/statics/img/icons/light/file-w-24.svg");
}

body.dark-mode .help-list .file_items .help-media-item div.svgIcon.trash {
    background-image: url("/statics/img/icons/dark/trash.svg");
}

body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-received div.files a,
body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-sent div.files a {
    color: #ffffff !important;
}

body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-received div.files {
    background-color: #191d1e;
}

body.dark-mode .k-step .help-list .help-items div.help-msg.help-message-sent div.files {
    background-color: #0045B4;
}

body.dark-mode .chat-list,
body.dark-mode .k-step .code-editor-left.light .chat-cnt {
    background-color: var(--dark-color-bg-primary);
}

body.dark-mode .chat-box textarea {
    border-color: var(--dark-border-gray);
    box-shadow: none;
    background-color: var(--dark-bg);
    color: var(--dark-text-primary);
}

body.dark-mode .chat-items .chat-message-sent,
body.dark-mode .chat-items .chat-message-received {
    color: var(--dark-text-primary);
}

body.dark-mode .chat-container li a.chat-message-sent:hover,
body.dark-mode .chat-container li a.chat-message-received:hover {
    background-color: transparent;
}

body.dark-mode .chat-items li:last-child {
    border-bottom: 1px solid var(--dark-border-gray) !important;
    border-radius: 0 0 5px 5px !important;
}

body.dark-mode .chat-box {
    background-color: transparent !important;
}

body.dark-mode .blank-precode {
    box-shadow: none;
    color: var(--dark-text-primary);
}

body.dark-mode #code_blank_detail {
    background-color: var(--dark-codeeditor-bg);
}

/*body.dark-mode #code_blank_detail .preview {*/
body.dark-mode #code_blank_detail,
body.dark-mode .blankcnt {
    border-color: var(--dark-border-gray);
}

body.dark-mode .code-drag-options {
    background-color: var(--dark-pre-bg);
}

body.dark-mode .hljs {
    background-image: initial;
    background-color: var(--dark-pre-bg);
}

body.dark-mode .html-body {
    border-bottom-color: var(--dark-border-gray);
}

body.dark-mode .chat-container .chatSender {
    color: var(--dark-text-primary);
}

body.dark-mode .k-step .help-list .chatSender {
    color: var(--dark-text-primary);
}

body.dark-mode .task-kstudio .code-editor-right.light .view {
    background-color: #0a0d0f;
}

body.dark-mode .blank-precode span.blank_opt {
    background-color: var(--dark-bg);
    border-color: rgb(20, 78, 95);
}

body.dark-mode .k-white-bg-im {
    background-color: var(--dark-media-li-bg) !important;
}

body.dark-mode #stepSummary .task-summary {
    box-shadow: none;
    background-color: #1c1e21;
    border-color: var(--dark-border-gray);
}

body.dark-mode #stepSummary .lesson-summary {
    border-color: var(--dark-accent-1);
    box-shadow: 0px 4px 0px var(--dark-accent-1);
}

body.dark-mode #stepSummary .lesson-summary div.bits {
    border-right-color: var(--dark-accent-1);
}

body.dark-mode #stepSummary .lesson-summary div.summary-footer span.muted,
body.dark-mode .lesson-summary .ave-footer p.muted {
    color: #CDCDCD;
}

body.dark-mode .lesson-summary div.durationSvg {
    background-image: url("/statics/img/icons/dark/duration-24.svg");
}

body.dark-mode .lesson-summary div.hourglassSvg {
    background-image: url("/statics/img/icons/dark/hourglass.svg");
}


body.dark-mode .card {
    background-color: var(--dark-card-bg);
    border-color: var(--dark-border-gray);
    box-shadow: none;
}

body.dark-mode #analysisDiv .card {
    background-color: #191D1E;
    border-color: var(--dark-border-gray);
}

body.dark-mode .home-card-holder .k-card {
    background-color: var(--dark-task-head-bg);
    border-color: var(--black-0);
}

body.dark-mode .home-card-holder .top-item-box {
    background-color: var(--dark-secondary-bg);
    border-color: var(--black-0);
}

body.dark-mode .btn-blue {
    color: #ffffff;
    border-color: var(--dark-blue-btn);
    background-color: var(--dark-blue-btn);
}

body.dark-mode .registerDiv .board {
    background-image: initial;
    background-color: var(--dark-bg);
}

body.dark-mode .registerDiv .board > div.board-inner {
    background-color: var(--dark-bg);
}

body.dark-mode .registerDiv .liner {
    background-image: initial;
    background-color: var(--dark-bg);
}

body.dark-mode .registerDiv fieldset {
    border-color: var(--dark-border-gray)
}

body.dark-mode .registerDiv .form-control {
    color: var(--dark-text-primary);
    background-color: var(--dark-bg);
    background-image: none;
    border-color: rgb(58, 63, 66);
    box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 1px inset;
}

/*body.dark-mode div:not(.checkbox) input[type="checkbox"] {*/
/*    width: 13px;*/
/*    height: 13px;*/
/*    appearance: none;*/
/*    background-image: none;*/
/*    background-color: var(--dark-bg);*/
/*    box-shadow: none;*/
/*    border: 1px solid rgb(58, 63, 66);*/
/*    border-radius: 2px;*/
/*}*/

body.dark-mode .registerDiv .form-control[disabled],
body.dark-mode .registerDiv .form-control[readonly],
body.dark-mode .registerDiv fieldset[disabled] .form-control {
    background-color: rgb(45, 49, 51);
}

body.dark-mode .btn.green {
    background-color: var(--dark-green);
    color: #ffffff;
}

/* TEACHER */
body.dark-mode .feed-div:not(:last-child) {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .feed-div .feed-info img {
    border-color: var(--black-0);
}

body.dark-mode .feed-div .feed-details #feednotif {
    background-color: var(--dark-blue);
}

body.dark-mode .k-color-green-im {
    color: var(--dark-green) !important;
}

body.dark-mode .quiz-item-answer {
    background-color: #373C3F;
    border: 2px solid #212325;
    box-sizing: border-box;
    box-shadow: 0px 4px 0px #212325;
    border-radius: 10px;
}

body.dark-mode .quiz-item-answer code {
    background-color: transparent !important;
    color: #fff !important;
}

body.dark-mode .quiz-item-answer.selected.correct {
    color: var(--dark-text-primary);
    border-color: var(--dark-quiz-green);
    box-shadow: 0px 4px 0px var(--dark-quiz-green);
}

body.dark-mode .quiz-item-answer.selected:not(.correct) {
    border-color: var(--dark-blue);
    box-shadow: 0px 4px 0px var(--dark-blue);
}

body.dark-mode .quiz-item-answer.wrong {
    border-color: var(--dark-red);
    box-shadow: 0px 4px 0px #E7403C;
}

body.dark-mode .quiz-item-answer:hover:not(.selected) {
    border-color: var(--dark-blue);
    box-shadow: 0px 4px 0px var(--dark-blue);
}

body.dark-mode .quiz-item-answer.selected.correct div.qsvg {
    background-image: url("/statics/img/icons/quiz/correct.svg");
}

body.dark-mode .quiz-item-answer div.qsvg {
    background-image: url("/statics/img/icons/dark/circle-24.svg");
}

body.dark-mode .quiz-item-answer .btn-answer {
    color: #ffffff;
}

body.dark-mode .quiz-item-answer input[type=text] {
    border-color: var(--dark-color-input-border);
}

body.dark-mode .todos-panel .tab-content .tab-pane.rt-tab-content .see-all {
    border-top-color: var(--black-0);
    background-color: var(--dark-color-bg-canvas);
}

body.dark-mode .todos-panel .tab-content .tab-pane.rt-tab-content .see-all a {
    color: #ffffff !important;
}

body.dark-mode .feeds-holder .clear-feed div.svgIcon {
    background-image: url("/statics/img/icons/dark/emptyfeed.svg");
}

body.dark-mode .switch input.category:checked + .slider {
    background-color: #114892;
}

body.dark-mode .theme.switch .slider {
    background-color: var(--dark-color-profile-color-modes-toggle-track-bg);
    border-color: var(--dark-color-profile-color-modes-toggle-track-border);
}

body.dark-mode .theme.switch input.normal:checked + .slider {
    background-color: var(--dark-color-profile-color-modes-toggle-track-bg);
    border-color: var(--dark-color-profile-color-modes-toggle-track-border);
}

body.dark-mode .theme.switch .slider:before {
    background-color: var(--dark-color-profile-color-modes-toggle-thumb-bg);
}

body.dark-mode .switch input.normal:checked + .slider {
    background-color: var(--dark-green)
}

body.dark-mode .checkbox-warning input[type="checkbox"]:checked + label::after {
    color: rgb(232, 230, 227);
}

body.dark-mode input[type="file"]:focus,
body.dark-mode input[type="radio"]:focus,
body.dark-mode input[type="checkbox"]:focus {
    outline-color: rgb(186, 123, 0);
}

body.dark-mode .form-control {
    color: #ffffff;
    background-color: var(--dark-color-input-bg) !important;
    background-image: none;
    border-color: var(--dark-color-input-border) !important;
}

body.dark-mode #studentsDiv li.k-step .media.head.closed {
    border-bottom-color: var(--dark-border-gray);
    background-color: var(--dark-bg);
}

body.dark-mode .modal-content {
    background-color: var(--dark-media-li-bg);
    border-color: var(--dark-border-gray);
    box-shadow: none;
    outline-color: initial;
}

body.dark-mode .modal-header {
    border-bottom-color: var(--dark-accent-1);
}

body.dark-mode .addCourseItem {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .t-step .task-head,
body.dark-mode #studentsDiv li.k-step .media.head {
    border-bottom-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .activity-items .item .task-head,
body.dark-mode .course-items .item .task-head {
    border-bottom: 1px solid var(--dark-color-border-secondary);
}

body.dark-mode .checkbox label::before {
    border-color: #0d1421;
    background-color: transparent;
}

body.dark-mode .close {
    color: rgb(232, 230, 227);
    text-shadow: rgb(24 26 27) 0px 1px 0px;
}

body.dark-mode .category-toolbar #c1 {
    border-bottom-color: var(--dark-border-gray);
}

body.dark-mode .k-step .code-editor-left .outputBar .titlebar button.pinner div.svgIcon.trash {
    background-image: url("/statics/img/icons/dark/trash.svg");
}

body.dark-mode .k-step .code-editor-left .outputBar .titlebar button.pinner div.svgIcon.chevron {
    background-image: url("/statics/img/icons/dark/chevron-down-20.svg");
}

body.dark-mode .k-step .code-editor-left .outputBar .titlebar button.pinner div.svgIcon.chevronup {
    background-image: url("/statics/img/icons/dark/chevron-up-24.svg");
}

body.dark-mode .k-step .code-editor-left.light .outputBar .titlebar button.pinner,
body.dark-mode .kstudio .code-editor-left.light .kstudio-output .titlebar button.pinner {
    color: var(--dark-btn-text) !important;
}

body.dark-mode .k-step .code-editor-left.light .outputBar .titlebar button.pinner:hover,
body.dark-mode .kstudio .code-editor-left.light .kstudio-output .titlebar button.pinner:hover {
    background-color: var(--dark-color-btn-hover-bg) !important;
    border-color: var(--dark-color-btn-hover-border) !important;
    transition-duration: .1s;
}

body.dark-mode .task-kstudio.light,
body.dark-mode .task-kstudio .code-editor-left.light .view {
    background-color: var(--dark-bg);
}

body.dark-mode .task-kstudio .kstudio-editor,
body.dark-mode .toolbar.code-toolbar-kstudio,
body.dark-mode .kstudio .code-editor-left .kstudio-output {
    border-right: 1px solid var(--dark-border-gray);
}

body.dark-mode .teacher-kstudio,
body.dark-mode .code-kstudio {
    background-color: var(--dark-media-li-bg);
}

body.dark-mode .code-editor-right .codeViewsTabs-holder {
    background-color: var(--dark-color-bg-canvas-inset);
    border-bottom-color: var(--dark-color-border-secondary)
}

body.dark-mode .breadcrumb-item:last-child span.selected-item-value {
    color: var(--dark-text-white);
}

body.dark-mode .actions .breadcrumb-item:last-child span.selected-item-value {
    color: var(--dark-blue);
}

body.dark-mode .categoryDiv .category-title {
    color: var(--dark-text-white);
}

body.dark-mode .categoryDiv .category-title:hover {
    background-color: rgb(44, 47, 49);
}

body.dark-mode .bonusBar,
body.dark-mode .builder-faqbar,
body.dark-mode .builder-quizbar,
body.dark-mode .builder-feedbackbar,
body.dark-mode .jump-item,
body.dark-mode .builder-hintsBar,
body.dark-mode .record-bar {
    border: 1px solid var(--dark-border-gray);
    /*background-color: var(--dark-bg);*/
    background-color: var(--dark-secondary-bg);
}

body.dark-mode .code-editor-right .faqsBar .faq-item {
    background-color: var(--dark-secondary-bg);
    border-color: var(--color-border-dark);
    box-shadow: none;
    color: var(--primary);
}

body.dark-mode .builder .task-footer {
    background-color: var(--dark-task-head-bg);
    border-top: 1px solid var(--dark-border-gray);
}

body.dark-mode .role-box .box-row {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .select2-dropdown {
    background-color: var(--dark-color-input-bg);
    border: 1px solid var(--dark-border-gray);
}

body.dark-mode .select2-search--dropdown {
    background-color: var(--dark-color-input-bg);
}

body.dark-mode .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--dark-color-input-contrast-bg);
}

body.dark-mode .select2-container--default .select2-selection--multiple {
    border: 1px solid var(--dark-border-gray);
    background-color: var(--dark-color-input-bg);
}

body.dark-mode .select2-container--default .select2-selection--single,
body.dark-mode .select2-container--default .select2-selection--multiple {
    border-color: var(--dark-color-input-border) !important;
    background-color: var(--dark-color-input-bg);
}

body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--dark-blue-light) !important;
    color: var(--dark-blue) !important;
    border-color: var(--dark-border-blue) !important;
}

body.dark-mode .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    border-right: 1px solid var(--dark-border-blue) !important;
    color: var(--dark-blue) !important;
    border-radius: 0 !important;
}

body.dark-mode .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #ffffff;
}

body.dark-mode .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--dark-blue-light) !important;;
    color: var(--dark-blue) !important;
}

body.dark-mode .k-black {
    color: var(--dark-text-primary);
}

body.dark-mode .select2-container--default .select2-results__option--selected {
    background-color: #112036;
}

body.dark-mode .pre-answer-nav.navbar-default .navbar-nav > .active > a,
body.dark-mode .pre-answer-nav.navbar-default .navbar-nav > .active > a:hover,
body.dark-mode .pre-answer-nav.navbar-default .navbar-nav > .active > a:focus {
    color: var(--dark-blue) !important;
    background-color: transparent;
}

body.dark-mode .builder .editable-container,
body.dark-mode .nav.preEventsTabs,
body.dark-mode .nav-editor-builder,
body.dark-mode .editor-tab-content,
body.dark-mode .jsonEditor {
    border-color: var(--dark-border-gray);
}

body.dark-mode .nav-editor-builder .navbar-collapse {
    background-color: var(--dark-color-bg-canvas-inset);
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode .editor-toolbar {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='30' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23282c32' stroke-width='10' %3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");
    box-shadow: none;
    border: 2px solid var(--dark-border-gray);
}

body.dark-mode .addTaskBar .btn,
body.dark-mode .editor-toolbar .btn {
    padding: 6px 15px;
}

body.dark-mode .addTaskBar .btn,
body.dark-mode .editor-toolbar .btn,
body.dark-mode .cb-deskbar-holder #c2 .btn,
body.dark-mode .details-trigger .btn,
body.dark-mode .task-footer .btn {
    background-color: var(--black-0);
    border: 0;
}

body.dark-mode .opt-container,
body.dark-mode .dropdown-menu {
    background-color: var(--dark-bg);
    border-color: var(--dark-border-gray);
}

body.dark-mode .dropdown-menu > li > a:hover,
body.dark-mode .dropdown-menu > li > a:focus {
    color: var(--dark-color-underlinenav-text-active);
}

body.dark-mode mark,
body.dark-mode .mark {
    border-color: var(--dark-border-yellow-light);
    background-color: var(--dark-yellow-light);
    color: var(--dark-text-primary);
}

body.dark-mode mark.code-lang,
body.dark-mode .mark.code-lang {
    border-color: var(--dark-color-alert-info-border);
    background-color: var(--dark-bg-alert-info);
    color: var(--dark-text-primary);
    padding: 0.2em 5px;
}

body.dark-mode mark.creator,
body.dark-mode .mark.creator {
    border-color: var(--dark-color-alert-success-border);
    background-color: var(--dark-success-alert-bg);
    color: var(--dark-text-primary);
}

body.dark-mode .blank-options label.chose {
    background-color: var(--dark-color-bg-overlay);
}

body.dark-mode .k-step .code-editor-left.light .xp-holder .content .feelingBar select {
    background-color: var(--dark-color-bg-overlay);
}

body.dark-mode .blank-precode textarea {
    background-color: var(--dark-color-bg-overlay);
    border-color: var(--dark-color-border-primary);
}

body.dark-mode .blank-precode textarea:focus {
    border-color: var(--dark-green);
}

body.dark-mode #registerPost li.active:after {
    border-bottom-color: var(--dark-color-border-secondary);
}

body.dark-mode #registerPost .nav-tabs > li > a::after {
    background: transparent;
}

body.dark-mode .k-step .media-heading .icon.code,
body.dark-mode .k-step .media-heading .fa.code,
body.dark-mode .k-step .media-heading .fa.html {
    color: var(--dark-blue);
}

body.dark-mode .addTaskBar {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='30' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23282c32' stroke-width='10' %3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E");
    /*background-color: #30363d;*/
}

body.dark-mode .code-editor-left.light .task-canvas iframe {
    background-color: var(--dark-color-bg-canvas-inset);
    border: 0;
}

body.dark-mode .score-captions h5 {
    color: var(--dark-text-primary);
}

body.dark-mode .text-inherit.go.delete-item {
    color: var(--dark-text-primary);
}

body.dark-mode .text-inherit.go.delete-item:hover {
    color: var(--dark-danger);
}

body.dark-mode .task-leaderboard .item-header a.go h5 {
    color: var(--black-0) !important;
}

body.dark-mode .task-leaderboard .item .rank-txt h5.k-yellow-bg,
body.dark-mode .task-leaderboard .item .rank-txt h5.silver-bg,
body.dark-mode .task-leaderboard .item .rank-txt h5.bronze-bg {
    color: var(--black-0);
}

body.dark-mode .task-leaderboard .item div.user-info small.sid,
body.dark-mode .task-leaderboard .item .value h5.val {
    color: var(--dark-secondary-5);
}

body.dark-mode .task-leaderboard div.user-info img.avatar {
    border-color: var(--black-0);
}

body.dark-mode .task-leaderboard .item .rank-txt {
    border-right-color: var(--dark-secondary-border);
}

body.dark-mode #inviteCollabModal .modal-body .collaborator:not(:last-child) {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .reg-form-container {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .edit-item,
body.dark-mode .invite-item {
    color: var(--dark-text-secondary);
}

body.dark-mode .edit-item:hover,
body.dark-mode .invite-item:hover {
    color: var(--dark-blue);
}

body.dark-mode #studentsDiv li.k-step .media.head.closed,
body.dark-mode #pendingStudentsDiv li.k-step .media.head.closed,
body.dark-mode .pageItems li.k-step .media.head.closed {
    background-color: var(--dark-color-bg-canvas);
    background-image: none;
}

body.dark-mode .t-step .task-head,
body.dark-mode #studentsDiv li.k-step .media.head,
body.dark-mode #pendingStudentsDiv li.k-step .media.head,
body.dark-mode .pageItems li.k-step .media.head {
    border: 0;
    background-color: var(--dark-color-header-bg);
    border-color: var(--dark-color-border-secondary);
    background-image: none;
}

body.dark-mode .teacher-html-ads-task-container,
body.dark-mode .teacher-html-ads-task-container .html-tabs-holder {
    border-color: var(--black-0);
}

body.dark-mode .teacher-html-ads-task-container .html-tabs-holder {
    background-color: #191D1E;
}

body.dark-mode .teacher-html-ads-task-container .html-tabs-holder .hl,
body.dark-mode .tr-ads-panel .html-tabs-holder,
body.dark-mode .tr-ads-panel .html-tabs-holder .hl {
    background-color: #191D1E;
    border-bottom-color: #2c3134;
}

body.dark-mode .pagination > .disabled > span,
body.dark-mode .pagination > .disabled > span:hover,
body.dark-mode .pagination > .disabled > span:focus,
body.dark-mode .pagination > .disabled > a,
body.dark-mode .pagination > .disabled > a:hover,
body.dark-mode .pagination > .disabled > a:focus {
    background-color: var(--dark-color-bg-canvas);
    border-color: var(--dark-color-border-secondary)
}

body.dark-mode .pagination > .active > a,
body.dark-mode .pagination > .active > span,
body.dark-mode .pagination > .active > a:hover,
body.dark-mode .pagination > .active > span:hover,
body.dark-mode .pagination > .active > a:focus,
body.dark-mode .pagination > .active > span:focus {
    background-color: var(--dark-blue);
    border-color: var(--dark-border-blue)
}

body.dark-mode .pagination > li > a,
body.dark-mode .pagination > li > span {
    background-color: var(--dark-color-bg-canvas);
    border-color: var(--dark-color-border-secondary)
}

body.dark-mode .color-bg-tertiary {
    background-color: var(--dark-color-bg-tertiary);
}

body.dark-mode .order-task-container {
    background-color: transparent;
}

body.dark-mode .order-task-container li pre,
body.dark-mode .order-task-container div.item pre {
    background-color: transparent;
}

body.dark-mode .order-task-container.stickers pre,
body.dark-mode .order-task-container.stickers pre code {
    background-color: var(--dark-quiz-item-bg) !important;
}

body.dark-mode .order-task-container div.item {
    border-color: #212325;
    box-shadow: 0px 4px 0px #212325;
}

body.dark-mode .order-task-container li:hover,
body.dark-mode .order-task-container div.item:hover {
    border-color: var(--blue);
    box-shadow: 0px 4px 0px var(--blue);
}

body.dark-mode .lesson-luck {
    background-color: #221E16;
    border-color: #bb800966;
    color: var(--dark-yellow);
}

body.dark-mode .introjs-tooltip {
    background-color: var(--dark-color-bg-canvas-inset);

}

body.dark-mode .introjs-tooltipbuttons {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .introjs-button {
    text-shadow: none !important;
    box-shadow: none !important;
    color: var(--dark-blue) !important;
    background-color: var(--dark-color-bg-canvas) !important;
    border-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .introjs-button:hover {
    color: var(--dark-text-primary) !important;
    box-shadow: none;
}

body.dark-mode .introjs-button:focus {
    color: var(--dark-text-primary) !important;
    box-shadow: none;
}

body.dark-mode .k-step .code-editor-right .xp-holder {
    background-image: url("/statics/img/xpholder.svg");
}

/*body.dark-mode .hljs-keyword,*/
/*body.dark-mode .hljs-selector-tag,*/
/*body.dark-mode .hljs-subst,*/
/*body.dark-mode .hljs-doctag {*/
body.dark-mode .hljs-keyword {
    color: var(--dark-color-prettylights-syntax-keyword);
}

body.dark-mode .hljs-string {
    color: #2ca142 !important;
}

body.dark-mode .hljs-number {
    color: #aaa730 !important;
}

body.dark-mode .quiz-item .quiz-stickers .quiz-answer {
    background-color: var(--dark-success-alert-bg);
    border-color: var(--dark-green);
    box-shadow: 0px 4px 0px var(--dark-green) !important;
}

body.dark-mode .ace-ambiance {
    background: var(--dark-codeeditor-bg);
}

body.dark-mode .ace-ambiance .ace_scroller {
    box-shadow: none !important;
}

body.dark-mode .ace-ambiance .ace_gutter-layer, .ace-ambiance .ace_text-layer {
    background-image: none;
}

body.dark-mode .ace-ambiance .ace_gutter-active-line {
    background-color: var(--dark-codeeditor-primary-selection-bg);
}

body.dark-mode .ace-ambiance .ace_marker-layer .ace_selection {
    background-color: #3f454b;
}

body.dark-mode .ace-ambiance .ace_print-margin {
    border-left-color: var(--dark-codeeditor-bg);
    background: var(--dark-codeeditor-bg);
}

body.dark-mode .ace-dracula .ace_marker-layer .ace_active-line {
    background: var(--dark-codeeditor-bg) !important;
}

body.dark-mode .ace-dracula {
    background-color: var(--dark-codeeditor-bg);
}

body.dark-mode .ace-monokai {
    background-color: var(--dark-codeeditor-bg);
    color: #F8F8F2;
}

body.dark-mode .ace_editor.ace_autocomplete .ace_marker-layer .ace_active-line {
    background: var(--dark-codeeditor-secandary-selection-bg);
}

body.dark-mode .ace-monokai .ace_marker-layer .ace_active-line {
    background: var(--dark-codeeditor-secandary-selection-bg);
}

body.dark-mode .ace-monokai .ace_marker-layer .ace_selection {
    background: var(--dark-codeeditor-primary-selection-bg);
}

body.dark-mode .ace_autocomplete .ace_scroller .ace_content {
    color: var(--dark-text-secondary);
    font-weight: var(--font-weight);
}

body.dark-mode .ace_autocomplete .ace_scroller .ace_content .ace_completion-highlight {
    color: var(--dark-text-primary);
    font-weight: var(--font-weight);
}

body.dark-mode .ace_gutter {
    background: inherit !important;
    color: inherit !important;
    border-color: #2e343b !important;
}

body.dark-mode .hljs-attribute,
body.dark-mode .hljs-name,
body.dark-mode .hljs-tag {
    color: var(--dark-blue-code);
}

body.dark-mode .builder-uploadBar .files_list .fileList .list-group > div.list-group-item:not(:last-child) {
    border-color: var(--dark-border-gray) !important;
}

body.dark-mode .builder-uploadBar .files_list .fileList .list-group > div.list-group-item {
    background-color: #202025;
}

body.dark-mode .courseAssetItem:not(:last-child) {
    border-color: var(--dark-border-gray);
}

body.dark-mode .k-card {
    background-color: var(--dark-rand-card-bg);
    /*background-color: var(--dark-color-bg-tertiary);*/
}

body.dark-mode .k-card-white {
    background-color: var(--dark-color-bg-tertiary);
}

body.dark-mode .builder-uploadBar form.fileGeneralUpload input[type='file'],
body.dark-mode .builder-uploadBar form:not(.fileGeneralUpload) input[type='file'] {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode i.asset-video-icon {
    color: var(--dark-text-secondary)
}

body.dark-mode .form-control:focus {
    border-color: var(--dark-blue);
}

body.dark-mode .btn-edit-avatar {
    border: 1px solid var(--dark-color-border-secondary);
    background-color: var(--dark-color-bg-canvas);
}

body.dark-mode .btn-edit-avatar:hover {
    color: var(--dark-primary);
    background-color: var(--dark-color-btn-hover-bg);
    border-color: var(--dark-color-btn-hover-border);
    transition-duration: .1s;
}

body.dark-mode .avatar_box img {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode textarea.essay-textarea {
    color: var(--dark-text-primary);
}

body.dark-mode .menu {
    background-color: transparent;
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .menu .menu-item {
    color: var(--dark-text-primary);
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .menu .menu-item:hover {
    background-color: var(--dark-color-state-hover-secondary-bg);
}

body.dark-mode .menu .menu-heading {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode #catWrapper .cat-users:not(:last-child) {
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .dropzone {
    border-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .dropzone .dz-preview .dz-remove {
    border-color: var(--dark-color-btn-border);
    box-shadow: none !important;
    transition: .2s cubic-bezier(.3, 0, .5, 1);
    transition-property: color, background-color, border-color;
}

body.dark-mode .test-unit-item-holder textarea,
body.dark-mode .test-unit-item-holder input {
    color: #ffffff;
}

body.dark-mode .k-step .code-editor-right .tab-content div.inputs-cnt > div div.card,
body.dark-mode .kstudio .code-editor-right .tab-content div.inputs-cnt > div div.card,
body.dark-mode .test-unit-item-holder {
    background-color: var(--dark-color-bg-canvas);
    border-color: var(--dark-color-border-secondary);
}

body.dark-mode .testunits-cnt .test-unit-item-holder label {
    color: var(--dark-text-secondary);
}

body.dark-mode .unittest-cnt .unittest-item {
    color: var(--dark-text-primary);
    background-color: var(--dark-color-hint-bg);
    border: 1px solid var(--dark-border-blue);
}

body.dark-mode .border {
    border-color: var(--dark-color-border-secondary) !important;
}

body.dark-mode .reject-toolbar {
    background-color: transparent;
}

body.dark-mode .k-step .rejectBar,
body.dark-mode .k-step .verifyBar {
    background-color: var(--dark-secondary-bg);
    border-color: #212325;
    box-shadow: 0px 4px 0px #212325;
}

body.dark-mode .k-step .rejectBar > div,
body.dark-mode .k-step .verifyBar > div {
    background-color: var(--dark-bg-secondary-1);
}

body.dark-mode .teacher-verification-holder,
body.dark-mode .verified_by,
body.dark-mode .rejected_by {
    background-color: var(--dark-secondary-bg);
    border-color: #212325;
    box-shadow: 0px 4px 0px #212325;
}

body.dark-mode .teacher-verification-holder.approved {
    border-color: var(--dark-green);
    box-shadow: 0px 4px 0px var(--dark-green);
}

body.dark-mode .teacher-verification-holder.acceptable {
    border-color: var(--dark-orange);
    box-shadow: 0px 4px 0px var(--dark-orange);
}

body.dark-mode .teacher-verification-holder.rejected {
    border-color: var(--dark-danger);
    box-shadow: 0px 4px 0px var(--dark-danger);
}


body.dark-mode .game-bg {
    background-color: var(--dark-codeeditor-bg) !important;
}

body.dark-mode .code-editor-right .task-canvas.game,
body.dark-mode .code-editor-right .task-canvas.game iframe,
body.dark-mode .kstudio-canvas.game .kstudio-iframe {
    background-color: var(--dark-color-bg-canvas-inset) !important;
}

body.dark-mode .rank-card,
body.dark-mode .bundle-card {
    background-color: var(--dark-rand-card-bg);
}

body.dark-mode .uploaderBar {
    background-color: transparent;
}

body.dark-mode .uploaderBar form.uploaderForm input[type='file'] {
    border-color: var(--dark-color-btn-border);
}

body.dark-mode #uploaderAssetsModal .fullscreen-asset {
    color: var(--dark-text-secondary);
}

body.dark-mode .lb-u-title {
    color: #ffffff !important;
}

body.dark-mode #toast-container > div {
    -webkit-box-shadow: 0 0 3px #21262d !important;
    box-shadow: 0 0 3px #21262d !important;
}

body.dark-mode .toast-info {
    background-color: var(--blue) !important;
    color: var(--dark-white) !important;
}

body.dark-mode .no-data-holder {
    background-color: var(--dark-color-bg-canvas);
}

body.dark-mode #itemWrapper .no-data-holder,
body.dark-mode .stdTrainersDiv .no-data-holder {
    background-color: var(--dark-card-bg) !important;
}

body.dark-mode .badge-card .badge-contents .badge-info {
    color: var(--dark-text-primary);
}

body.dark-mode .badge-card {
    border-color: transparent;
    background-color: #222525;
}

body.dark-mode .badge-students section {
    border-bottom-color: var(--dark-accent-1);
}

body.dark-mode .badge-students a.go h5 {
    color: #ffffff !important;
}

body.dark-mode .student-profile-body .info-box li.timegrid span.font-weight-400 {
    color: var(--dark-color-underlinenav-text);
}

body.dark-mode .modal-footer {
    border-color: var(--dark-color-border-secondary);
}

/*body.dark-mode .hl {*/
/*    border-bottom-color: var(--dark-border-gray);*/
/*    background-color: var(--dark-secondary-bg);*/
/*}*/

body.dark-mode .daterangepicker {
    background-color: var(--dark-card-bg);
    border-color: var(--dark-border-gray);
}

body.dark-mode .daterangepicker:after {
    border-bottom-color: #3a3d42;
}

body.dark-mode .daterangepicker .calendar-table {
    background-color: var(--dark-card-bg);
    border-color: transparent;
}

body.dark-mode .daterangepicker td.in-range {
    background-color: #3a3d42;
    color: #fff;
}

body.dark-mode .daterangepicker select.monthselect,
body.dark-mode .daterangepicker select.yearselect,
body.dark-mode .daterangepicker td.available:hover,
body.dark-mode .daterangepicker th.available:hover,
body.dark-mode .daterangepicker .ranges li:hover {
    background-color: #3a3d42;
}


body.dark-mode .daterangepicker td.off,
body.dark-mode .daterangepicker td.off.in-range,
body.dark-mode .daterangepicker td.off.start-date,
body.dark-mode .daterangepicker td.off.end-date {
    background-color: #272b2b;
}

body.dark-mode .daterangepicker:before,
body.dark-mode .daterangepicker .drp-buttons,
body.dark-mode .daterangepicker.show-ranges.ltr .drp-calendar.left {
    border-color: var(--dark-border-gray);
}

body.dark-mode .daterangepicker,
body.dark-mode .daterangepicker .ranges ul {
    color: var(--dark-text-primary) !important;
}

body.dark-mode .verify-lesson {
    border-top-color: var(--dark-border-gray);
    background-color: var(--dark-secondary-bg);
}

body.dark-mode .bundle-card .bundle-content .bundle-info-item .cntedit {
    border-color: var(--dark-border-gray);
    background-color: var(--dark-color-input-bg);
}

body.dark-mode .cb {
    border-color: var(--dark-border-gray);
}

body.dark-mode .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    border-color: var(--dark-border-gray) !important;
}

body.dark-mode div.chevron-down-24 {
    background-image: url("/statics/img/icons/dark/chevron-down-24.svg");
}

body.dark-mode div.chevron-up-24 {
    background-image: url("/statics/img/icons/dark/chevron-up-24.svg");
}

body.dark-mode div.bugIcon24 {
    background-image: url("/statics/img/icons/dark/bug-24-px.svg");
}

body.dark-mode .tsk-actions .report-bug {
    background-color: var(--dark-primary-1);
}

/*body.dark-mode .nav.nav-tasktoolbar-tabs > li > a::after,*/
/*body.dark-mode .nav-tabs.prchart > li > a::after,*/
/*body.dark-mode .code-editor-left .nav-pills.nav-editor > li:hover > a::after,*/
/*body.dark-mode .code-editor-left .nav-pills.nav-editor > li.active > a::after,*/
/*body.dark-mode .nav-tabs.nav-analysis > li > a::after,*/
/*body.dark-mode .nav-tabs.prchart > li > a::after {*/
/*    color: var(--dark-blue) !important;*/
/*    background: var(--dark-blue) !important;*/
/*}*/

body.dark-mode .tr-ads-panel,
body.dark-mode .tr-ads-panel .html-tabs-holder {
    border-color: var(--black-0);
}

body.dark-mode .ctgWall #studentsDiv {
    border-color: var(--dark-border-gray);
}

body.dark-mode .ctgWall .nav-ctg > li.active > a::after,
body.dark-mode .ctgWall .nav-ctg > li:hover > a::after,
body.dark-mode #coursesDiv .nav-ctg > li.active > a::after,
body.dark-mode #coursesDiv .nav-ctg > li:hover > a::after {
    background-color: var(--royal-blue);
}

body.dark-mode #coursesDiv {
    border-color: var(--black-0);
}

body.dark-mode #coursesDiv .nav-ctg {
    background-color: var(--dark-media-li-bg);
}

body.dark-mode .ace_constant.ace_language,
body.dark-mode .ace_keyword,
body.dark-mode .ace_tag-name,
body.dark-mode .ace_variable.ace_language {
    color: #7ee787 !important;
}

body.dark-mode .ace_entity.ace_other.ace_attribute-name,
body.dark-mode .ace_support.ace_constant,
body.dark-mode .ace_support.ace_function {
    color: #79c0ff !important;
}

body.dark-mode .ace-ambiance .ace_string {
    color: #a5d6ff !important;
}

body.dark-mode input.blocklyHtmlInput {
    color: var(--dark);
}

body.dark-mode table tr.trRepRow td.type.kroom span,
body.dark-mode table tr.trRepRow td.type.zoom_class {
    color: var(--white);
}

body.dark-mode #aiMoreInfoModal span.fa-info-circle {
    color: var(--dark-blue);
}

body.dark-mode .table-container.sys-reports{
    border-color: var(--dark-border-gray);
}

body.dark-mode .text-survey {
    color: #c4c2c2;
}


body.dark-mode .btn-green {
    color: #f7f7f7;
    border-color: #29913d;
    background-color: #32B14A
}

body.dark-mode .btn-green:hover,
body.dark-mode .btn-green:focus,
body.dark-mode .btn-green:active,
body.dark-mode .btn-green.active,
body.dark-mode .open>.dropdown-toggle.btn-green {
    color: #f7f7f7;
    border-color: #32B14A !important;
    background-color: #29913d !important;
}

body.dark-mode .label-danger {
    color: #f7f7f7;
    background-color: var(--dark-danger);
}

body.dark-mode .label-info {
    color: #222222;
    background-color: var(--dark-quiz-blue);
}
body.dark-mode .label-success {
    color: #222222;
    background-color: var(--dark-green);
}
body.dark-mode .label-warning {
    color: #f7f7f7;
    background-color: var(--dark-yellow);
}
body.dark-mode .label-primary {
    color: #f7f7f7;
    background-color: var(--dark-blue-light);
}

body.dark-mode .label-secondary {
    color: #222222;
    background-color: var(--dark-secondary);
}