/*------------------------ 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{
    color: #fff;
}
.dark-mode a{
    color: #75e9fc;
}
.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;
    transition: .4s;
    border-radius: 34px;
}
.slider-dark:before {
    position: absolute;
    content: "";
    height: 16px;
    width: 16px;
    left: 3px;
    bottom: 2px;
    background-color: white;
    transition: .4s;
    border-radius: 50%;
}
.switch-dark input:checked + .slider-dark {
    background-color: #fff;
}
.switch-dark input:checked + .slider-dark:before {
    transform: translateX(23px);
    background-color: #000;
}
.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 .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu ul.dropdown-menu li {
    background: none;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a:hover, 
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a:focus, 
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a:visited {
    background-color: #000;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a{
    color: #75e9fc !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li a span, .dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li a {
    color: #75e9fc;
}
.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 .navbar-static-top.navbar .menu-bar>.navbar-nav li:hover a {
    color: #75e9fc !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.open a{
    color: #75e9fc !important;
}
.dark-mode .header-link{
    color: #75e9fc;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li:hover a span, .dark-mode .notifyMessage a{
    color: #75e9fc;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li ul.dropdown-menu li a.viewAccount{
    color: #75e9fc;
}
.dark-mode .m-content-placement-item{
    background-color: inherit !important;
}
.dark-mode .m-content-placement-item .c-image{
    color: #fff;
}
.dark-mode .c-device-placement-cta a{
    background: #75e9fc;
    color: #000;
}
.dark-mode .footerMessage p{
    color: #fff;
}
.dark-mode .descriptor_row .left svg, .dark-mode .descriptor_row .left svg path, .dark-mode .descriptor_row .left svg g {
    fill: #fff !important;
}
.dark-mode .c-device-placement-cta a:hover, .dark-mode .c-device-placement-cta a:focus{
    color: #000;
}
.dark-mode .c-device-placement-cta a span i {
    color: #000;
}
.dark-mode .c-device-placement-cta a:hover article.text {
    box-shadow: 0 3px 0 -1px #000;
}
.dark-mode .open-button{
    background-color: #000;
}
.dark-mode .tab-title{
    color: #fff;
}
.dark-mode .tab-title+div{
    color: #fff !important;
}
.dark-mode .tab-title+div a{
    color: #75e9fc !important;
}
.dark-mode .field-label{
    color: #fff;
}
.dark-mode .crmEntityFormView{
    background-color: inherit;
}
.dark-mode .crmEntityFormView .tab{
    background: none;
}
.dark-mode .control .form-control{
    background: none !important;
    border: 1px solid #fff !important;
    color: #fff !important;
}
.dark-mode .control .form-control[disabled], .dark-mode .control .form-control[readonly], .dark-mode fieldset[disabled]{
    background-color: rgb(58 58 58) !important;
    border-color: #aaa !important;
}
.dark-mode .control label{
    color: #fff;
}
.dark-mode .crmEntityFormView, .dark-mode .entitylist{
    background: none;
}
.dark-mode .view-grid table thead th a, .dark-mode .view-grid table thead th{
    color: #75e9fc !important
}
.dark-mode .table-bordered {
    border: 1px solid #fff;
}
.dark-mode .table-bordered>thead>tr>th, .dark-mode .table-bordered>thead>tr>td, .dark-mode .table-bordered>tbody>tr>th, .dark-mode .table-bordered>tbody>tr>td, .dark-mode .table-bordered>tfoot>tr>th, .dark-mode .table-bordered>tfoot>tr>td {
    border: 1px solid #fff;
    color: #fff;
}
.dark-mode .wrapper .fa-search{
    color: #fff;
}
.dark-mode .form-control{
    border: 1px solid #fff !important;
    color: #fff;
    background: none !important;
}
.dark-mode input.query.form-control::placeholder{
    color: #fff !important;
}
.dark-mode .wrapper .input-group-btn button{
    background: none;
    border: 1px solid #fff !important;
}
.dark-mode .table-bordered tr:nth-of-type(odd):hover td {
    color: #fff;
}
.dark-mode .crmEntityFormView .cell input.form-control.input-text-box.readonly{
    border-right: 1px solid #aaa !important;
}
.dark-mode #cancel-by-requestor .workflow-link, .dark-mode .actions input{
    background: none !important;
    border: 1px solid #fff !important;
}
.dark-mode .crmEntityFormView .form-control[readonly][disabled], .dark-mode .crmEntityFormView select[disabled]{
    background-color: rgb(58 58 58) !important;
}
.dark-mode .table>tbody>tr>td a{
    color: #75e9fc;
}
.dark-mode .control .input-group .form-control.lookup~.input-group-btn button span.fa{
    color:#fff;
}
.dark-mode .info label{
    color:#fff;
}
.dark-mode .control input[type=file]{
    background: none;
    border: 1px solid #fff;
    color: #e5e5e5;
}
.dark-mode .crmEntityFormView .actions .btn:first-child{
    border: 1px solid #fff !important;
}
.dark-mode .note {
    color: #fff;
}
.dark-mode .entity-timeline div:nth-of-type(even).note {
    background: none;
    border-top: 1px solid #ccc;
}
.dark-mode .entity-timeline .timelineheader .buttoncontainer .addnote{
    background: none;
    border-color: #fff;
    color: #fff;
}
.dark-mode .modal-content, .dark-mode .popover-content{
    background: #000;
    color:#fff;
}
.dark-mode .modal-dialog .modal-header .modal-title{
    color:#fff;
}
.dark-mode .form-close{
    color:#fff;
}
.dark-mode .form-close:hover {
    color: #fff !important;
}
.dark-mode .modal-footer .btn.btn-primary{
    background: none;
    border: 1px solid #fff !important;
}
.dark-mode .modal-footer .btn.btn-primary:hover{
    border: 1px solid #75e9fc !important;
    background: none;
}
.dark-mode .modal-footer .btn.btn-default{
    color: #fff;
}
.dark-mode .modal-footer .btn.btn-default:hover{
    background: none;
    border: 1px solid #75e9fc;
    color: #fff;
}
.dark-mode .tenantbtn{
    background: none !important;
    border: 1px solid #fff !important
}
.dark-mode .tenantbtn:hover{
    background: #333 !important;
}
.dark-mode .captcha-cell p label, .dark-mode .captcha-txt{
    color: #fff;
}
.dark-mode .captcha-cell p input{
    background: none;
    border: 1px solid #fff;
    color: #fff;
}
.dark-mode .btn-primary{
    background: none;
    border: 1px solid #fff;
}
.dark-mode .btn-primary:hover{
    background: #333;
    border: 1px solid #fff;
}
.dark-mode .rcCaptchaAudioLink, .dark-mode .rcRefreshImage{
    color: #75e9fc !important;
}
.dark-mode input#telephone1::placeholder {
    color: #fff !important;
}
.dark-mode .well, .dark-mode .profile-title{
    background: none;
}
.dark-mode .notifyMessage.notLoggedIn{
    color: #fff;
}
.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 .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu a{
    background: none !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu.dropdown.open a{
    color: #fff !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu.dropdown.open a{
    color: #fff !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu.dropdown.open a{
    background-color: #000 !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.dropdown.toolsMenu.open a span.caret{
    background: url('https://fasttrack365dev.powerappsportals.com/caretDown-white.png') no-repeat center center;
    background-size: contain;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu a:hover, .dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu a:focus{
    background: none !important;
}
.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 > ul li a:focus{
    border: 1px dashed #fff !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.toolsMenu.dropdown.open>a {
    background: none !important;
}
.dark-mode .table-striped>tbody>tr:hover, .dark-mode .table-striped>tbody>tr:nth-of-type(odd):hover{
    background: #6a6a6a !important;
}
.dark-mode .table>tbody>tr>td{
    color: rgb(255 255 255);
}
.dark-mode .table-hover>tbody>tr:hover {
    background-color: #6a6a6a;
}
.dark-mode .table tbody tr td span[role=checkbox]{
    border: 1px solid #ffffff;
}
.dark-mode .cell .selected.info td span[role=checkbox]{
    border: 1px solid #000 !important;
}
.dark-mode .help-block.error, .dark-mode label.control-label.required:before, .dark-mode .crmEntityFormView .cell div.info.required label:after, .dark-mode .crmEntityFormView .cell div.info div.validators, .dark-mode .crmEntityFormView .validator-text, .dark-mode .crmEntityFormView .rank-order-cell .validator-text, .dark-mode .crmEntityFormView .constant-sum-cell .validator-text, .dark-mode .crmEntityFormView .stack-rank-cell .validator-text{
    color: #fff;
}
.dark-mode .crmEntityFormView .validation-summary h2{
    color: #000;
    font-weight: 600;
}
.dark-mode span.captcha-txt+span {
    color: #fff !important;
}
.dark-mode .pagination>li>a, .dark-mode .pagination>li>span{
    color: #75e9fc;
    border: 1px solid #75e9fc !important;
    background: none;
}
.dark-mode .pagination>li>a:focus, .dark-mode .pagination>li>a:hover, .dark-mode .pagination>li>span:focus, .dark-mode .pagination>li>span:hover{
    color: #75e9fc;
    background: none;
}
.dark-mode .pagination>.disabled>a, .dark-mode .pagination>.disabled>a:focus, .dark-mode .pagination>.disabled>a:hover, .dark-mode .pagination>.disabled>span, .dark-mode .pagination>.disabled>span:focus, .dark-mode .pagination>.disabled>span:hover{
    background: none;
    color: #fff;
}
.dark-mode .pagination>.active>a, .dark-mode .pagination>.active>a:focus, .dark-mode .pagination>.active>a:hover {
    background-color: #75e9fc !important;
    color: #000 !important;
}
.dark-mode input::placeholder {
    color: #fff !important;
}
.dark-mode .entity-grid .message{
    color: #fff;
}
.dark-mode .message span {
    color: #fff !important;
}
.dark-mode .bannertext button:focus {
    outline: 2px solid #fbb604;
}
.dark-mode .view-grid table tr th a:focus{
    outline: 1px solid #ffffff;
}
.dark-mode #InsertButton:focus {
    outline: 2px solid #fff !important;
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.dropdown.loggedIn a span.caret {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='%23ffffff' stroke='%23ffffff'%3E%3Ccircle class='mectrl_stroke' cx='32' cy='32' r='30.25' stroke-width='1.5' fill='none'/%3E%3Cg class='mectrl_stroke' fill='none' stroke-width='2.5' transform='matrix(.9 0 0 .9 10.4 10.4)'%3E%3Crect x='13.3' y='12.3' width='21.4' height='28.5' rx='.6' ry='.6'/%3E%3Ccircle cy='25.4' cx='24' r='3.6'/%3E%3Cpath d='M18 35a1 1 0 1112 0'/%3E%3C/g%3E%3Cg class='mectrl_fill' stroke='none'%3E%3Cpath d='M36.68 14h2.34l-3.24 6.75h-2.43zM24.89 14h2.43l5.58 11.25a1.046 1.046 0 01-1.791 1.08l-.549-1.08z'/%3E%3C/g%3E%3C/svg%3E");
}
.dark-mode .navbar-static-top.navbar .menu-bar>.navbar-nav li.loginBtn a span.caret{
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64' fill='%23ffffff' stroke='%23ffffff'%3E%3Cg class='mectrl_stroke' stroke-width='1.9' fill='none'%3E%3Ccircle cx='32' cy='32' r='30.25'/%3E%3Cg transform='matrix(1.1 0 0 1.1 8.8 5.61)'%3E%3Ccircle class='mectrl_stroke' cx='20' cy='16' r='7'/%3E%3Cpath class='mectrl_stroke' d='M30 35h10m-5-5v10M30.833 32.09A11 11 0 009 34'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}
.dark-mode select.form-control option {
  background-color: #1e1e1e;
  color: #f1f1f1;
}
.dark-mode .createFTC ol li a{
    color: #75e9fc;
}
.dark-mode .notifyMessage a:focus {
    outline-offset: 1px;
}
.dark-mode .wrapper .view-search.entitylist-search input:focus{
    border:2px solid #0067b8 !important;
}

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

/*------------------ Radio Focus -----------------*/
.dark-mode .boolean-radio input[type="radio"]:focus + label {
  border: 1px dashed #fff; 
  outline-offset: 2px;
  border-radius: 4px;
}
/*------------------ Radio Focus -----------------*/