.darkmode .breadcrumb li,
.darkmode .profile-card .profile-detail h3,
.darkmode .col-field-grid li p,
.darkmode .profile-card.grid_view .grid_details_inner .grid_content,
.darkmode .suggested-wrapper h2,
.darkmode .suggested-grid-list li h3,
.darkmode .main-title,
.darkmode .card-top-header h3,
.darkmode .sub-heading,
.darkmode .default-tables.altone-tables .td a,
.darkmode .default-tables.altone-tables .td,
.darkmode .profile-card.card-block,
.darkmode .tp-wrapper h2,
.darkmode .fr-element.fr-view p,
.darkmode .list-grid li h3,
.darkmode .details-card .listing_title,
.darkmode .fr-element.fr-view table td,
.darkmode .fr-element.fr-view table th,
.darkmode .request-wrapper h2,
.darkmode .form-control,
.darkmode .dropdown-style li a .name-cell,
.darkmode .blue-modal .alt-modal-body .panel .panel-heading h2,
.darkmode .logout_messege,
.darkmode .mat-calendar-body-cell-content,
.darkmode .mat-calendar-body-label,
.darkmode .mat-calendar-period-button,
.darkmode .mat-datepicker-content .mat-calendar-next-button,
.darkmode .mat-datepicker-content .mat-calendar-previous-button,
.darkmode .mat-datepicker-toggle,
.darkmode .pagi-info,
.darkmode .pagi-show-list-length span,
.darkmode .pagi-show-list-length .dropdown .dropdown-wrapper .dropdown-inner .dropdown-menu li>a,
.darkmode .login_again:hover,
.darkmode .table_top_btn.fl-right .btn-outline,
.darkmode .table_top_btn.fl-right a.btn-outline,
.darkmode .confirmation-modal-body .mat-dialog-content p,
.darkmode .confirmationPopup .mat-dialog-content,
.darkmode .white-popup .alt-modal-title,
.darkmode .confirmationPopup .mat-dialog-container .alt-modal-title,
.darkmode .modal-blue .alt-modal-body h6,
.darkmode .modal-blue .alt-modal-body p,
.darkmode .dropdown.dropdown_searchable .dropdownbtn .selected-field span,
.darkmode .filter-action-btn .btn-outline,
.darkmode .multiselect-dropdown-ui .dropdown-list,
.darkmode .no-options,
.darkmode .emp-list li h2,
.darkmode .empty-wrapper h3,
.darkmode .empty-wrapper p,
.darkmode .table_heading,
.darkmode .mat-select-panel .mat-optgroup-label,
.darkmode .mat-select-panel .mat-option,
.darkmode .mat-select-value,
.darkmode .bottom-sheet .dropdown-style .bottom-sheet-title,
.darkmode .alt-module-true.blue-modal .alt-modal-title,
.darkmode .image-popup-modal .control-button,
.darkmode .flex-box .file-details .file-name,
.darkmode .label_component h2.labelComponentValue.label_heading,
.darkmode .fr-element.fr-view ul,
.darkmode .fr-element.fr-view ul li,
.darkmode .fr-element.fr-view ul li span,
.darkmode .fr-element.fr-view ol,
.darkmode .fr-element.fr-view ol li,
.darkmode .fr-element.fr-view ol li span,
.darkmode .fr-element.fr-view h2,
.darkmode .fr-element.fr-view section,
.darkmode .attach-file span,
.darkmode .text-link,
.darkmode .emp-profile .profile-description h3,
.darkmode .task-btn-action .btn-outline,
.darkmode .task-btn-action a.btn-outline,
.darkmode .multiselect-dropdown span.dropdown-btn>span,
.darkmode .multiselect-dropdown .dropdown-btn .selected-item-container .selected-item span,
.darkmode .multiselect-item-checkbox input[type=checkbox] + div,
.darkmode .mat-calendar-period-button .mat-button-wrapper,
.darkmode .pdf-modal .bottom-sheet-title,
.darkmode .pdf-modal .pdf-popup-refresh-btn,
.darkmode .progress_status_part .status_message label.status_validating,
.darkmode .fr-element.fr-view p span,
.darkmode .custom-file-upload span,
.darkmode .label_component h2,
.darkmode .breadcrumb>li+li:before,
.darkmode .panel-full .panel .panel-body .fr-element.fr-view table thead+tbody tr:first-child td,
.darkmode .panel-full .panel .panel-body tr td.fr-thick {color: #fff !important;}

.darkmode .text-button.add-click{color: #5E7DE1!important;}


.darkmode .details-card .alt-card-row li .description-details p,
.darkmode .details-card .action-wrap p,
.darkmode .mat-calendar-table-header th,
.darkmode .btn-outline,
.darkmode a.btn-outline,
.darkmode .my_task_table .with_mob_title .table_title_mob{color:#8F90A6 !important}

.darkmode .mat-icon-button[disabled][disabled]{color:rgba(255, 255, 255, 0.5) !important}

::placeholder,
.darkmode .mat-form-field-appearance-legacy .mat-form-field-label{color: #8F90A6 !important;}


body.darkmode,
.darkmode .alt-module-true.blue-modal .alt-modal,
.darkmode .white-popup,
.darkmode .white-popup.alt-modal,
.darkmode .confirmationPopup .mat-dialog-container,
.darkmode .alt-modal,
.darkmode .filter-action-btn,
.darkmode .site-footer,
.darkmode #sub-frame-error,
.darkmode #sub-frame-error:hover,
.darkmode .site-header,
.darkmode .declaration-page .main-container{ background: #252536 !important;}

.darkmode .profile-card .front,
.darkmode .details-card .front,
.darkmode .add_card_details .fr-box.fr-basic.fr-top .fr-wrapper::before,
.darkmode .card-3.search-block-section .search-block,
.darkmode .blue-modal .search-block-section .input-group.search-block,
.darkmode .panel,
.darkmode .favorite-list-grid li,
.darkmode .app-wrapper .request-wrapper .card-block-inner,
.darkmode .alt-module-true.blue-modal .alt-modal .panel .panel-body,
.darkmode .logout_container{background:#343444 !important;}

body.darkmode::-webkit-scrollbar-thumb,
.darkmode .add_card_details .card_dynamic_img,
.darkmode .seprator-line,
.darkmode .table_top_btn.fl-right .btn-outline,
.darkmode .table_top_btn.fl-right a.btn-outline,
.darkmode .input-group.search-block,
.darkmode .panel-full .panel .panel-body .input-group.search-block,
.darkmode .card-3.search-block-section .search-block.grey-bg,
.darkmode .checkbox label::before,
.darkmode .filter-action-btn .btn-outline,
.darkmode .radio-wrapper.checkcontainer .radiobtn,
.darkmode .image-popup-modal .alt-modal-footer .control-button,
.darkmode .task-btn-action .btn-outline,
.darkmode .task-btn-action a.btn-outline,
.darkmode .multiselect-dropdown-ui .dropdown-list .multiselect-item-checkbox input[type=checkbox]+ div:before {background: #555770 !important;}

.darkmode .form-group .panel .altone-tables.default-tables .tr,
.darkmode .altone-tables.default-tables .tr,
.darkmode .panel-full .panel .panel-body .fr-element.fr-view table tr,
.darkmode .add_card_details .fr-element.fr-view table tr,
.darkmode .add_card_details .fr-element.fr-view table,
.darkmode .dropdown-style,
.darkmode .flex-box.file-wrap,
.darkmode textarea.form-control,
.darkmode .menu-style,
.darkmode .mat-datepicker-content,
.darkmode .alt-module-true.popup-in-center.blue-modal.pdf-modal .alt-modal{background:#3B3B4A !important}

.darkmode .dropdown-style li:hover a,
.darkmode .dropdown-style li:focus a,
.darkmode .footer-bottom,
.darkmode .menu-style,
.darkmode .menu-style .dropdown-menu,
.darkmode .multiselect-dropdown-ui .dropdown-list,
.darkmode .cdk-overlay-container .dropdown-style.mat-select-panel .mat-option:focus:not(.mat-option-disabled),
.darkmode .cdk-overlay-container .dropdown-style.mat-select-panel .mat-option:hover:not(.mat-option-disabled),
.darkmode .cdk-overlay-container .dropdown-style.mat-select-panel .mat-option.mat-active,
.darkmode .lazyload,
.darkmode .multiselect-dropdown-ui .dropdown-list li.multiselect-item-checkbox:hover{background: #484856 !important;}

.darkmode .suggested-grid-list li {background: rgba(45, 153, 232, 0.12) !important;}
.darkmode .mat-calendar-body-cell:not(.mat-calendar-body-disabled):hover>.mat-calendar-body-cell-content:not(.mat-calendar-body-selected){background: #454554 !important;}

.darkmode .pagi-show-list-length .dropdown-adon,
.darkmode .pagi-show-list-length .dropdown,
.darkmode .pagi-show-list-length .dropdown-wrapper{background:#525260 !important}

.darkmode .pagi-show-list-length .dropdown .dropdown-wrapper .dropdown-inner .dropdown-menu li:hover,
.darkmode .multiselect-dropdown-ui .dropdown-list .dropdown-item:hover,
.darkmode .multiselect-dropdown-ui .dropdown-list .dropdown-item.selected{background: #646472 !important;}

.darkmode .pagination ul.ngx-pagination a,
.darkmode .pagination ul.ngx-pagination button{background: rgba(255, 255, 255, .5) !important;}

.darkmode .pagination ul.ngx-pagination li.current span {
    background-color: #031842 !important;
    border-color: #031842 !important;
}
.darkmode .spinner {background: rgba(37, 37, 54, .6) !important;}

.darkmode .radio-wrapper.checkcontainer .radiobtn {border-color: #8F90A6 !important;    }

.darkmode .btn-outline,
.darkmode a.btn-outline{background: transparent !important;}

.darkmode .form-group a.btn-primary, 
.darkmode a.btn-primary, 
.darkmode .btn-primary, 
.darkmode .btn-primary:focus, 
.darkmode .btn-primary.focus, 
.darkmode .btn-primary:hover, 
.darkmode .mat-simple-snackbar-action button,
.darkmode .login_again,
.darkmode .mat-calendar-table .mat-calendar-body .mat-calendar-body-selected,
.darkmode .default-tables.altone-tables .th .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .default-tables.altone-tables .td .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .checkbox input[type="radio"]:checked + label::before,
.darkmode .list-grid li p.tool-tip::before,
.darkmode .details-card .alt-card-row li .description-details p::before,
.darkmode .details-card .action-wrap p.tool-tip::before, .status-msg p.tool-tip::before,
.darkmode .suggested-grid-list li h3::before,
.darkmode .panel-heading .panel-title.tool-tip::before{background: #557ee9 !important;}


.darkmode .radio-wrapper.checkcontainer input:checked ~ .radiobtn,
.darkmode .dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus,
.darkmode .panel.panel-open.white-bg.no-shadow,
.darkmode .panel-full .panel .panel-body .fr-element.fr-view table thead+tbody tr:first-child td,
.darkmode .panel-full .panel .panel-body .fr-view table td{background: transparent !important;}


.darkmode .form-group a.btn-primary, 
.darkmode a.btn-primary, 
.darkmode .btn-primary, 
.darkmode .btn-primary:focus, 
.darkmode .btn-primary.focus, 
.darkmode .btn-primary:hover, 
.darkmode .login_again,
.darkmode .default-tables.altone-tables .th .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .default-tables.altone-tables .td .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .radio-wrapper.checkcontainer input:checked ~ .radiobtn,
.darkmode .checkbox input[type="checkbox"]:checked + label::before,
.darkmode .checkbox input[type="radio"]:checked + label::before,
.darkmode .mat-calendar-body-today:not(.mat-calendar-body-selected){border-color: #557ee9 !important;}


.darkmode .default-tables.altone-tables.with_mob_title .tr,
.darkmode .list-grid,
.darkmode .details-card .alt-card-row li,
.darkmode .fr-element.fr-view table tr,
.darkmode .content .form-control,
.darkmode .form-control[readonly].selectbox,
.darkmode .flex-box.file-wrap,
.darkmode .logout_container,
.darkmode .table_top_btn.fl-right .btn-outline,
.darkmode .table_top_btn.fl-right a.btn-outline,
.darkmode .dropdown.dropdown_searchable .dropdownbtn,
.darkmode .filter-action-btn .btn-outline,
.darkmode .alt-modal-footer,
.darkmode .btn-outline,
.darkmode a.btn-outline,
.darkmode .dropdown_searchable .bottom-sheet-wrapper .bottom-sheet .dropdown-style li a,
.darkmode .image-popup-modal .alt-modal-footer .control-button,
.darkmode .multiselect-dropdown-ui .multiselect-dropdown .dropdown-btn,
.darkmode .site-header {border-color: #555770 !important;}

.darkmode .default-tables.altone-tables .th .checkbox label::before,
.darkmode .default-tables.altone-tables .td .checkbox label::before,
.darkmode .multiselect-dropdown-ui .dropdown-list .multiselect-item-checkbox input[type=checkbox]+ div:before{border-color: #C7C9D9 !important;}

.darkmode .suggested-wrapper{border-color:#343444 !important;}

.darkmode .mat-calendar-arrow {
    border-top-color: #fff !important;
}

.darkmode .multiselect-dropdown-ui .dropdown-list .filter-textbox input{background-color: #555770 !important;}

/* white filter */
.darkmode .eyeicon,
.darkmode .edit_icon .table_action_icons,
.darkmode .updown-arrow .up_icn,
.darkmode .updown-arrow .down_icn,
.darkmode .icon-download-report,
.darkmode .icon-upload,
.darkmode .filter-icon,
.darkmode .preview-icon .eyes-icon,
.darkmode .eye-icon,
.darkmode .editViewIconsA .table_action_icons,
.darkmode .editViewIconsA.preview_icon .table_action_icons,
.darkmode .editViewIconsA.editView_icon .table_action_icons,
.darkmode .editViewIconsA.page_preview_icon .table_action_icons,
.darkmode .editViewIconsA.visibility_icon .table_action_icons,
.darkmode .editViewIconsA.Select .table_action_icons,
.darkmode .site-logo img {filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(7500%) hue-rotate(160deg) brightness(101%) contrast(101%) !important;}

/* blue filter */
.darkmode .mdi-chevron-down:before{filter: brightness(0) saturate(100%) invert(52%) sepia(18%) saturate(3301%) hue-rotate(201deg) brightness(91%) contrast(94%);}

/* empty screen visual */
.darkmode .empty-wrapper img,
.darkmode .scroll-container img{filter: brightness(1) saturate(100%) invert(76%) sepia(11%) saturate(672%) hue-rotate(198deg) brightness(89%) contrast(88%) !important;}

.darkmode .alt-module-true.popup-in-center.blue-modal.image-popup-modal .scroll-container img{filter: none !important;}

.darkmode .attach-file .attached_icon{filter: none !important;}

.darkmode .ngx-pagination .pagination-previous a::before{
    background: url(../images/svg/pagi-left-arrow.svg) no-repeat center / 9px auto !important;
}

.darkmode .ngx-pagination .pagination-previous.disabled::before{
    background:#fff url(../images/svg/pagi-left-arrow.svg) no-repeat center / 9px auto !important;
}

.darkmode .ngx-pagination .pagination-next a::after{
    background:url(../images/svg/pagi-right-arrow.svg) no-repeat center / 9px auto !important;
    
}
.darkmode .ngx-pagination .pagination-next.disabled::after{
    background:#fff url(../images/svg/pagi-right-arrow.svg) no-repeat center / 9px auto !important;
    
}

.darkmode .dropdown.mat-form-field.mat-form-field-disabled .mat-select-arrow::before{filter: brightness(0) saturate(100%) invert(53%) sepia(0%) saturate(1%) hue-rotate(253deg) brightness(96%) contrast(82%) !important;}

@media screen and (max-width:923px) {
/* .darkmode .alt-module-true{background: #252536 !important;} */

.darkmode .bottom-sheet-wrapper .bottom-sheet,
.darkmode .cdk-overlay-container .cdk-overlay-connected-position-bounding-box .cdk-overlay-pane{background:#3B3B4A !important}

.darkmode .bottom-sheet-wrapper .backdrop,
.darkmode.open-bottomsheet .cdk-overlay-backdrop.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,
.darkmode.open-bottomsheet-calendar .cdk-overlay-backdrop.mat-overlay-transparent-backdrop.cdk-overlay-backdrop-showing,
.darkmode .cdk-overlay-dark-backdrop,
.darkmode .alt-module-true {background: rgba(0, 0, 0, .6) !important;}

.darkmode .confirmationPopup .mat-dialog-container .alt-modal-title{border-color: #555770 !important;}
.darkmode .flex-box.file-wrap{ border-color: transparent !important; background: transparent !important;}
}