/*------------------------ Dark mode styles ------------------------*/
body.dark-mode {
    background-color: #262626;
    color: #fff;
}
.dark-mode h1, .dark-mode h2, .dark-mode h3, .dark-mode h4, .dark-mode h5, .dark-mode h6, .dark-mode ol{
    color: #fff;
}
.dark-mode h1, .dark-mode h3{
    background: none !important;
    color: #fff !important;
}
.dark-mode ol{
    background: none !important;
}
.dark-mode ol li{
    color: #ffffff;
}
.dark-mode p a{
    background: none !important;
}
.dark-mode ul li span, .dark-mode p span {
    color: #fff !important;
}
.dark-mode ::marker {
    color: #fff;
}
.dark-mode a{
    color: #75e9fc !important;
}
.dark-mode p span, .dark-mode ul li span{
    background: none !important;    
}
.dark-mode div span{
    background: none !important;
    color: #fff !important;
}
.dark-mode p span a, .dark-mode ul li a span, .dark-mode div a span{
    color: #75e9fc !important;
    cursor: pointer;
}
.dark-mode a:hover{
    color: #75e9fc;
    text-decoration: underline;
}
.dark-mode .navbar-static-top.navbar-inverse, .dark-mode footer {
    background-color: #262626 !important;
}
.navbar-static-top.navbar .navbar-collapse{
    margin-top: -50px;
}
.navbar-toggle{
    position: absolute;
    right: 1%;
    top: 0;
}
@media screen and (min-width: 768px) and (max-width: 991px){
    .headerLogoWrap{
        margin-left: 0 !important;
        margin-top: 0 !important;
    }
    .headerLogoWrap{
        padding-left: 0 !important;
    }
    .headerLogo{
        padding-left: 15px !important;
        font-size: 15px !important;
    }
    .headerLogo:before{
        left: 0 !important;
    }
    .navbar-static-top.navbar .navbar-collapse .menu-bar{
        width: 59% !important;
    }
    .navbar-static-top.navbar .menu-bar>.navbar-nav li.dropdown.loggedIn a span.caret{
        margin: 0 !important;
    }
    .navbar-nav>li{
        margin-right: 2px !important;
    }
    .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu a{
        margin-right: 2px !important;
        padding-left: 7px !important;
        padding-right: 7px !important;
    }    
}
@media screen and (min-width: 992px) and (max-width: 1200px){
    .switch-hld{
        margin-right: 248px !important;
    }
}
@media screen and (max-width: 767px){
    .switch-hld{
        margin-right: 0 !important;
        margin-top: -26px !important;
    }
    .dark-mode .navbar-inverse .navbar-toggle .icon-bar {
        border: 1px solid #ffffff;
        background-color: #ffffff !important;
    }
    .dark-mode .navbar-static-top.navbar .navbar-collapse{
        background: #262626 !important;
    }
    .dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu a{
        padding-left: 0 !important;
    }
    .dark-mode .navbar-inverse .navbar-toggle:focus {
        border: 1px solid !important;
        background: none !important;
    }
    .wrapper .toolbar-actions{
        width: auto !important;
    }
}

@media screen and (max-width: 500px){
    .switch-hld{
        margin-top: 20px !important;
    }    
}

/* Additional styles for better visibility and accessibility */
.switch-hld{
    display: flex;
    align-items: center;
    font-family: Segoe UI, SegoeUI, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin-top: 19px;
    justify-content: center;
    margin-right: 100px;
}
#mode-label{
    margin-right: 10px;
    font-size: 1.2rem;
    font-weight: 500;
    color: #262626;
}
.switch-dark {
    position: relative;
    display: inline-block;
    width: 45px;
    height: 20px;
}
.switch-dark input {
    opacity: 0;
    width: 0;
    height: 0;
}
.slider-dark {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #707070 !important;
    transition: .4s;
    border-radius: 34px;
}
.slider-dark:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 3px;
    bottom: 2px;
    background-color: white !important;
    transition: .4s;
    border-radius: 50%;
}
.switch-dark input:checked + .slider-dark {
    background-color: #fff !important;
}
.switch-dark input:checked + .slider-dark:before {
    transform: translateX(23px);
    background-color: #000 !important;
}
.switch-dark input:focus + .slider-dark {
    outline: 2px solid #ff9800;
    outline-offset: 4px;
}

/* Visually hidden element for screen readers */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    border: 0;
}
.dark-mode #mode-label{
    color: #fff;
}
.dark-mode .headerLogo:before{
    border-left: 2px solid #fff;
}
.dark-mode .headerLogo, .dark-mode footer .footer-bottom a{
    color: #75e9fc;
}
.dark-mode .notifyMessage{
    color: #c3c3c3;
}
.dark-mode footer .footer-bottom{
    background-color: #000000 !important;
}
.dark-mode footer .footer-bottom p{
    color: #fff;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li a {
    color: #75e9fc !important;
}
/*.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu.dropdown.open {
    background: #000;
}*/
.dark-mode #navbar .dropdown-menu {
    background-color: #000 !important;
}
.dark-mode .bannertext button{
    background: #000 !important;
    border: 1px solid #fff;
}
.dark-mode .bannertext button~article a{
    color: #75e9fc !important;
}
.dark-mode .bannertext button~article a:hover:before{
    background: #75e9fc;
}
.dark-mode .footerNavLinkWrapper{
    color: #fff;
}
.dark-mode #treeviewSearchInput:active, #treeviewSearchInput:focus{
    box-shadow: none;
    -webkit-box-shadow: none;
}
.dark-mode #treeviewSearchInput:hover{
    border-color: none;
}
.dark-mode #treeviewSearchInput{
    background: none;
}
.dark-mode #articleContentWrapper h2, .dark-mode #articleContentWrapper p, .dark-mode #ratingHeader p{
    background: none !important;
    color: #fff !important;
}
.dark-mode .list-group-item{
    background: none;
}
.dark-mode .mectrl_name.mectrl_truncate, .dark-mode .mectrl_truncate {
    color: #fff;
}
.dark-mode .mectrl_name.mectrl_truncate, .dark-mode .mectrl_truncate {
    color: #fff;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a.viewAccount {
    color: #75e9fc !important;
}
.dark-mode .treeview-caret::before{
    color: #ffffff;
}
.dark-mode .navbar-static-top.navbar .menu-bar > .navbar-nav > li > a:focus {
    border: 1px dashed #fff !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.open a {
    color: #75e9fc !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.open a span.username {
    color: inherit;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li a span.username {
    color: inherit;
}
.dark-mode a.dropdown-toggle.usernameAnchorTag:focus, .dark-mode a.dropdown-toggle.usernameAnchorTag:hover {
    background: none;
}
.dark-mode .nav .open>a, .dark-mode .nav .open>a:hover, .dark-mode .nav .open>a:focus{
    background: none;
}
.dark-mode .layer_up{
    background: none;
}
.dark-mode .sidebar-home{
    background: none;
}
.dark-mode .sidebar-home .panel-heading, .dark-mode .section-knowledge .panel-title{
    color: #fff;
}
.dark-mode .text-muted.small {
    color: inherit;
}
.dark-mode .open-button{
    background-color: #000;
}
.dark-mode .activeTreeviewNode{
    background-color: rgb(69 69 69);
}
.dark-mode div, .dark-mode span{
    color: #fff;
}
.dark-mode ul, .dark-mode code{
    color: #ffffff !important;
    background: none !important;
}
.dark-mode .inThisArticleDiv ul > li > a {
    color: #75e9fc !important;
}
.dark-mode h2 a {
    color: #fff !important;
}
.dark-mode table{
    box-shadow: none;
    background: none !important;
}
.dark-mode th, .dark-mode td{
    color: #ffffff !important;
    border: 1px solid #ffffff;
    background: #262626 !important;
}
.dark-mode .feedback-btn{
    background-color: rgba(0, 0, 0, 1);
}
.dark-mode .feedback-btn:hover, .dark-mode .feedback-btn:active, .dark-mode .feedback-btn:focus, .dark-mode .feedback-btn:visited{
    background: none;
}
.dark-mode .info{
    background: #454545;
}
.dark-mode table.section {
    background: none;
}
.dark-mode table.section td {
    border: none;
}
.dark-mode table.section td .info {
    background: none;
}
.dark-mode table.section td .control input {
    background: none;
    border-color: #fff;
    color: #fff;
}
.dark-mode table.section td .control input::placeholder{
    color: #fff;
}
.dark-mode div#ctl00_ContentContainer_EntityFormControl_8f0ce6448623ed119db10022480a0ef5_EntityFormControl_8f0ce6448623ed119db10022480a0ef5_EntityFormView_captcha_SpamProtectorPanel{
    background: none;
}
.dark-mode .captcha-cell p label{
    color: #fff;
}
.dark-mode .captcha-cell input{
    border: 1px solid #fff;
    background: none;
    color: #fff;
}
.dark-mode .crmEntityFormView .actions .btn:first-child{
    border: 1px solid #fff !important;
    background: none;
}
.dark-mode .crmEntityFormView .actions .btn:first-child:hover{
    background: #333
}
.dark-mode #search span{
    color: #fff;
}
.dark-mode button#search-filter {
    background: none;
    color: #75e9fc;
}
.dark-mode button#search-filter span.selected{
    color: #75e9fc;
}
.dark-mode #navbar .dropdown-search #q{
    background: #000;
    color: #fff;
}
.dark-mode #navbar .dropdown-search #q::placeholder{
    color: #fff;
}
.dark-mode #navbar .dropdown-search .input-group-btn button{
    background: #000;
}
.dark-mode #navbar .dropdown-search .input-group-btn button span{
    color: #75e9fc;
}
.dark-mode #navbar .dropdown-search .dropdown-submenu .dropdown-menu>li.active>a:focus, .dark-mode #navbar .dropdown-search .dropdown-submenu .dropdown-menu>li.active>a:hover{
    background: #333;
}
.dark-mode .wiki-content-header {
    background: none !important;
}
.dark-mode ul li a{
    background: none !important;
}
.dark-mode .panel{
    background: none !important;
}
.dark-mode .panel-default>.panel-heading{
    background: none;
}
.dark-mode .breadcrumb>.active {
    color: #bfbfbf;
}
.dark-mode .textarea .control textarea{
    background: none;
    color: #ffffff;
}
.dark-mode .profile-page-heading small{
    color: #ababab;
}
.dark-mode .actions input[type="button"]{
    background: none;
    border-color: #fff;
}
.dark-mode a.list-group-item:hover, .dark-mode a.list-group-item:focus, .dark-mode button.list-group-item:hover, .dark-mode button.list-group-item:focus{
    background: none;
}
footer {
    position: initial !important;
    margin-top: 30px;
}

/*------------------------ Dark mode styles ------------------------*/