body, #app main { background-color: #000000; }

#app .aside, .modal-overlay-admin .modal-content,
#app .aside.expanded .user-info-card .modal-content, .menu,
#app .side-menu-header,
#app .aside.expanded .user-menu-block .side-menu-nav { background-color: #F2F7FF; }
#app .aside,
#app .aside.expanded .user-menu-block,
#app .aside.mobile .user-menu-block { background-color: #000000; }

#app .aside.expanded .logo-wrap .toggle-side-menu-icon,
#app .aside .side-menu-nav li .icon,
#app .aside.expanded .user-info-card .menu-item .icon,
#app .aside.mobile .user-info-card .menu-item .icon { background-color: #ffffff; }
#app .aside .side-menu-nav li.active .icon,
#app .aside.expanded .user-info-card .menu-item.active .icon { background-color: #000000; }
#app .aside .side-menu-nav li:hover .icon,
#app .aside.expanded .user-info-card .menu-item:hover .icon { background: #000000; }
#app .aside .side-menu-nav li .name,
#app .aside.expanded .user-info-card .menu-item span { color: #ffffff; }
#app .aside .side-menu-nav li:hover .name,
#app .aside.expanded .user-info-card .menu-item:hover span { color: #000000; }
#app .aside .side-menu-nav li.active .name { color: #000000; }
#app .aside .side-menu-nav li.active { background-color: #fff95e; }
#app .aside .side-menu-nav li:hover,
#app .aside.expanded .user-info-card .menu-item:hover { background-color: #fff95e; }

.side-menu-nav .user-info .personal-info #name { color: #00145E; }
.side-menu-nav .user-info .personal-info #email { color: #00145E; }
.student-header h1 { color: #ffffff; font-size: 20px;}

.search-form input { background-color: #FFFFFF; }
.search-form input:hover { background-color: #FFFFFF; }

.search-select-container button {
  background-color: #000000;
  border-color: #000000;
}
.search-select-container button:hover {
  background-color: #000000;
  border-color: #000000;
}

.search-select-container .search-icon { background-color: #fff274; }
.search-select-container button:hover .search-icon { background-color: #fff274; }

.search-select-container .form-group .form-select {
  background-color: #FFFFFF;
  border-color: #D6E0FF;
  color: #00145E;
}
.search-select-container .form-group .form-select:hover {
  background-color: #FFFFFF;
  color: #00145E
}
.search-select-container .form-group::after { border-color: #005AFF; }
.search-select-container .form-group:hover::after { border-color: #005AFF; }
.search-select-container .form-group .form-select option {
  background-color: #FFFFFF;
  color: #00145E;
}
.search-select-container .form-group .form-select option:hover {
  background-color: #005AFF;
  color: #FFFFFF;
}

.courses-list-container .course-item {
  border-radius: 20px;
  background-color: #000000;
}

.course-item .item-bottom-title { background-color: #000000; }
.courses-list-item .item-bottom .item-bottom-percentage { color: #fff66b; }
.courses-list-item .item-bottom .progress-bar { background-color: #fff66b; }
.courses-list-item .item-bottom .progress-bar .progress { background-color: #fff66b; }
.courses-list-item .item-bottom .item-bottom-title { color: #ffffff; }
.courses-list-item .item-bottom .item-bottom-desc { color: #e8e8e8; }
.item-bottom .buttons .regular { background-color: #fff66b; }
.item-bottom .buttons .regular:hover { background-color: #000000; }
.item-bottom .buttons .regular { color: #000000; }
.item-bottom .buttons .regular:hover { color: #fff66b; }
.item-bottom .buttons .regular { border-color: #fff66b; }
.item-bottom .buttons .regular:hover { border-color: #fff66b; }

.item-bottom .buttons .regular-light {
  background-color: #EAEFFF;
  color: #005AFF;
  border-color: #005AFF;
}
.item-bottom .buttons .regular-light:hover {
  background-color: #005AFF;
  color: #EAEFFF;
  border-color: #005AFF;
}

.main-contents .lesson-contents .action-buttons .action-btn:first-child span { color: #00145E; }
.main-contents .lesson-contents .action-buttons .action-btn:first-child .chevron-icon { background-color: #00145E; }
.main-contents .lesson-contents .action-buttons .action-btn:first-child:hover span { color: #005AFF; }
.main-contents .lesson-contents .action-buttons .action-btn:first-child:hover .chevron-icon { background-color: #005AFF; }
.main-contents .lesson-contents .action-buttons .action-btn:last-child span { color: #00145E; }
.main-contents .lesson-contents .action-buttons .action-btn:last-child .chevron-icon { background: #00145E; }
.main-contents .lesson-contents .action-buttons .action-btn:last-child:hover span { color: #005AFF; }
.main-contents .lesson-contents .action-buttons .action-btn:last-child:hover .chevron-icon { background: #005AFF; }

.lesson-contents .lesson-contents-mark-complete .btn {
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #00145E;
}
.lesson-contents .lesson-contents-mark-complete .btn:hover {
  background-color: #FFFFFF;
  border-color: #FFFFFF;
  color: #00145E;
}
.lesson-contents .lesson-contents-mark-complete .btn { border-radius: 20px; }

.main-contents .lesson-contents, .main-contents { background-color: #F2F7FF; }
.main-contents .header .title { color: #000001; }

.main-contents .course-side-menu { background-color: #2d2d2d; }

.main-contents .course-side-menu .curriculum-menu-list ul li span,
.main-contents .course-side-menu .curriculum-menu-list ul li a { color: #ffffff; }
.main-contents .course-side-menu .menu-list .sub-item .icon { color: #36B368; }
.main-contents .course-side-menu .course-progress .course-name { color: #ffffff; }

.main-contents .course-side-menu .course-progress .progress-container .progress-text { color: #ffee7a; }
.main-contents .course-side-menu .course-progress .progress-container .progress-bar .progress { background-color: #ffee7a; }
.main-contents .course-side-menu .course-progress .progress-container .progress-icon { background-color: #E6EFFF; }

.main-contents .course-side-menu .module-theme-fallback { background-color: #000000; }
.main-contents .course-side-menu .module-theme-badge .badge-text { color: #FFFFFF; }
.main-contents .course-side-menu .module-theme-title { color: #FFFFFF }
.main-contents .course-side-menu .module-theme-title { display: none; }
.main-contents .course-side-menu .module-theme-badge { display: none; }

.main-contents .course-side-menu .curriculum-menu-active-item-wrap {
  background-color: #feea7e;
  border-color: #000000;
}
.main-contents .course-side-menu .curriculum-menu-active-item-wrap span { color: #000000; }
.main-contents .course-side-menu .curriculum-menu-active-item-wrap:hover { background-color: #feea7e; }
.main-contents .course-side-menu .curriculum-menu-active-item-wrap:hover span { color: #000000; }
.main-contents .course-side-menu .curriculum-menu-active-item-wrap .chevron-icon { background-color: #CBD6E5; }
.main-contents .course-side-menu .curriculum-menu-active-item-wrap .chevron-icon:hover { background-color: #000000; }
.main-contents .course-side-menu .curriculum-modules-list li { background-color: #FFFFFF; }
.main-contents .course-side-menu .curriculum-modules-list li a { color: #000E42; }
.main-contents .course-side-menu .curriculum-modules-list li:hover { background-color: #feea7e; }
.main-contents .course-side-menu .curriculum-modules-list li:hover a { color: #FFFFFF; }

.main-contents .course-side-menu .curriculum-modules-list-view .module-list-item { background-color: #282828; }
.main-contents .course-side-menu .curriculum-modules-list-view .module-list-item-header:hover { background-color: #FFFFFF; }
.main-contents .course-side-menu .curriculum-modules-list-view .module-name { color: #000000; }
.main-contents .course-side-menu .curriculum-modules-list-view .module-list-item.active .module-name:not(.has-children) { color: #005AFF; }
.main-contents .course-side-menu .curriculum-modules-list-view .module-list-item-header:hover .module-name { color: #000000; }
.main-contents .course-side-menu .curriculum-modules-list-view .chevron-icon { background-color: #000000; }
.main-contents .course-side-menu .curriculum-modules-list-view .module-list-item-header:hover .chevron-icon { background-color: #005AFF; }

.onboarding-page { background-color: #FFFFFF; }
.onboarding-page .content-clear .title { color: #00145E; }

.onboarding-page .import-steps-wrap li .transfer-line { background-color: #CCDEFF; }
.onboarding-page .import-steps-wrap li.progress .transfer-line .progress { background-color: #005AFF; }
.onboarding-page .import-steps-wrap li.completed .transfer-line .progress { background-color: #36B368; }
.onboarding-page .import-steps-wrap li .status-field { background-color: #CCDEFF; }
.onboarding-page .import-steps-wrap li.progress .status-field { background-color: #005AFF; }
.onboarding-page .import-steps-wrap li.progress .status-field { border-color: #005AFF; }
.onboarding-page .import-steps-wrap li.completed .status-field { background-color: #36B368; }
.onboarding-page .import-steps-wrap li .step-number { color: #C5CBDD; }
.onboarding-page .import-steps-wrap li .step-name { color: #000E42; }
.onboarding-page .import-steps-wrap li .step-status { color: #909BBF; }
.onboarding-page .import-steps-wrap li.progress .step-status { color: #005AFF; }
.onboarding-page .import-steps-wrap li.completed .step-status { color: #36B368; }

.onboarding-page .content-clear .login-form { background-color: #F4F6FC; }
.onboarding-page .registration-step-form .data-item .input-label span { color: #000E42; }
.onboarding-page .registration-step-form .data-item .input-label input,
.onboarding-page .registration-step-form .data-item .input-label select { background-color: #FFFFFF; }
.onboarding-page .registration-step-form .data-item .input-label input,
.onboarding-page .registration-step-form .data-item .input-label select,
.login-page .login-form .form-container .form-input input { border-color: #D6E0FF; }
.onboarding-page .registration-step-form .data-item .input-label input,
.onboarding-page .registration-step-form .data-item .input-label select { color: #000E42; }
.onboarding-page .registration-step-form .data-item .input-label input::placeholder,
.onboarding-page .registration-step-form .data-item .input-label select::placeholder { color: #CBD6E5; }

.login-page .login-form .form-container .form-submit button,
.login-page .login-form .user-data .step-button button {
  background-color: #00145E;
  border-color: #00145E;
  border-radius: 20px;
  color: #FFFFFF;
}
.login-page .login-form .form-container .form-submit button:hover,
.login-page .login-form .user-data .step-button button:hover {
  background-color: #FFFFFF;
  border-color: #00145E;
  color: #FFFFFF;
}

.login-page-container {
  background-color: #2e2d2d;
  }

#app .aside .logo-wrap .logo-image-link {
  background-image: url("/images/logo_img.jpg");
}

.login-form .logo-wrap { background-color: #000000; }
.login-page-container .login-form .form { background-color: #FFFFFF; }
.login-page-container .form-input label,
.login-form .form-text p,
.login-page-container .login-form .form .forgot-password-label { color: #00145E; }
.login-page-container .login-form .form .form-container .form-input input {
  background-color: #FFFFFF;
  color: #000E42;
  border-color: #D6E0FF;
}
.login-page-container .login-form .form .form-container .form-input input::placeholder { color: #CBD6E5; }

.login-page-container .login-form .form .form-container .form-submit button,
.login-page-container .login-form .user-data .step-button button {
  background-color: #fffc48;
  border-color: #fffc48;
  border-radius: 20px;
  color: #000000;
}
.login-page-container .login-form .form .form-container .form-submit button:hover,
.login-page-container .login-form .user-data .step-button button:hover {
  background-color: #000000;
  border-color: #000000;
  color: #ffffff;
}

main .community-main { background-color: #F2F7FF; }
header.community-header .page-name-wrap { color: #00145E; }

.community-profile-contents .topics .topic-btn {
  background-color: #FFFFFF;
  color: #333333;
  border-color: #E5E5E5;
}
.community-profile-contents .topics .topic-btn-wrapper:hover .topic-btn {
  background-color: #F8F9FA;
  color: #007BFF;
  border-color: #007BFF;
}
.community-profile-contents .topics .topic-btn.active {
  background-color: #007BFF;
  color: #FFFFFF;
  border-color: #007BFF;
}

.community-profile-contents .community-container .post-user-info .post-profile-details .post-profile-name,
.post-popup .create-post-container .post-user-info .post-profile-details .post-profile-name,
.post-details-popup .community-container .post-user-info .post-profile-details .post-profile-name {
  color: #333333;
}

.community-profile-contents .community-container .post-social-interactions .social-interactions-info,
.post-details-popup .community-container .post-social-interactions .social-interactions-info { background-color: #FFFFFF; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info .info,
.community-profile-contents .community-container .post-social-interactions .social-interactions-info .comment-text,
.post-details-popup .community-container .post-social-interactions .social-interactions-info .info,
.post-details-popup .community-container .post-social-interactions .social-interactions-info .comment-text { color: #333333; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info .icon,
.post-details-popup .community-container .post-social-interactions .social-interactions-info .icon { background-color: #333333; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info,
.post-details-popup .community-container .post-social-interactions .social-interactions-info { border-color: #E5E5E5; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info:hover,
.post-details-popup .community-container .post-social-interactions .social-interactions-info:hover { background-color: #F8F9FA; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info:hover .info,
.community-profile-contents .community-container .post-social-interactions .social-interactions-info:hover .comment-text,
.post-details-popup .community-container .post-social-interactions .social-interactions-info:hover .info,
.post-details-popup .community-container .post-social-interactions .social-interactions-info:hover .comment-text { color: #007BFF; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info:hover .icon,
.post-details-popup .community-container .post-social-interactions .social-interactions-info:hover .icon { background: #007BFF; }
.community-profile-contents .community-container .post-social-interactions .social-interactions-info:hover,
.post-details-popup .community-container .post-social-interactions .social-interactions-info:hover { border-color: #007BFF; }

.post-popup .modal-close .close-icon { background-color: #666666; }
.post-popup .modal-close .close-icon:hover { background-color: #007BFF; }
.post-popup .create-post-container .post-create-footer .action-buttons .cancel-button {
  background-color: #F8F9FA;
  color: #6C757D;
  border-color: #DEE2E6;
}
.post-popup .create-post-container .post-create-footer .action-buttons .cancel-button:hover {
  background-color: #E2E6EA;
  color: #5A6268;
  border-color: #D1ECFF;
}
.post-popup .create-post-container .post-create-footer .action-buttons .post-button {
  background-color: #007BFF;
  color: #FFFFFF;
  border-color: #007BFF;
}
.post-popup .create-post-container .post-create-footer .action-buttons .post-button:hover {
  background-color: #0056B3;
  color: #FFFFFF;
  border-color: #0056B3;
}

.community-banner { background-color: #005aff; }
.community-banner .banner-text h2, .community-banner .banner-text p { color: #FFFFFF; }
.community-banner { border-color: #005aff; }
.community-banner .banner-action { background-color: #FFFFFF; }
.community-banner .join-button {
  background-color: #005aff;
  color: #FFFFFF;
  border-color: #005aff;
}
.community-banner .join-button:hover {
  background-color: #FFFFFF;
  color: #005aff;
  border-color: #005aff;
}