.dark {
    --background-color: #172a46;
    --nav-bg-color: #0a192f;
    --light-bg: #444964;
    --dark-bg: #141C35;
    --hover-bg: #292f49;
    --skyblue-bg: rgba(128, 212, 255,0.4);
    --box-header-bg: #2c3760;
    --table-striped-bg: rgba(25,36,71,0.70);
    --border-color: #767C94;
    --text-color: #ccd6f6;
    --text-white: #ffffff;
}

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

html.dark body {
    color: var(--text-color);
    background: var(--background-color);
}

.dark select,
.dark textarea,
.dark div[title="Select"] {
    color: var(--text-color) !important;
    background: var(--dark-bg) !important;
}

.dark .menulist toggle-ul-ipas-hover,
.dark .toggle-div-mydesign,
.dark .ipas-header-color {
    background-color: var(--nav-bg-color) !important;
}

.dark .master-body {
    background-color: var(--background-color);
    color: var(--text-color);
}

.dark .search-block,
.dark .down-up-block,
.dark .download-block {
    background-color: var(--dark-bg);
    border: 1px solid var(--text-color);
}

.dark .toggle-ul-ipas li {
    background-color: var(--nav-bg-color);
}

.dark .toggle-ul-ipas li a,
.dark .super-admin ul li a {
    color: var(--text-color);
}

.dark .nav-tabs .nav-link.active {
    color: var(--text-color);
    background-color: var(--dark-bg);
}


.dark .table-desc {
    border: 1px solid var(--text-color);
    background-color: transparent;
}

.dark .table th {
    color: white !important;
    background: var(--light-bg) !important;
    border: 1px solid var(--dark-bg);
}

.dark .table-section td {
    border: 1px solid var(--background-color);
    border-bottom: 1px solid var(--background-color) !important;
}

.dark .table-with-heading .table-side-box-heading,
.dark .table-responsive .table-side-box-heading {
    border: 1px solid var(--text-color);
}

.dark .pagination ul > li > a,
.dark .pagination ul > li > span {
    background-color: var(--light-bg);
    color: var(--text-white);
}

.dark #footer {
    color: var(--text-color);
    background-color: var(--nav-bg-color) !important;
}

.dark .custom-select {
    background-color: var(--background-color) !important;
    color: white !important;
}

.dark .multi-drp {
    background-color: var(--background-color) !important;
}

.dark .pro-plan .dropdown-menu {
    border: 1px solid var(--text-color);
    background: var(--dark-bg);
    color: var(--text-color);
}


/*.dark .toggle-ul-ipas-hover,*/
.dark .menulist toggle-ul-ipas-hover,
.dark .toggle-div-mydesign,
.dark .ipas-header-color {
    background-color: var(--nav-bg-color) !important;
}

.dark .toggle-ul-ipas li {
    background-color: var(--nav-bg-color);
}

.dark .toggle-ul-ipas li a,
.dark .super-admin ul li a {
    color: var(--text-color);
}

.dark .super-admin ul li a:hover {
    color: red;
}

.dark .toggle-ul-ipas li.active {
    background: var(--background-color);
    border: 1px solid var(--border-color);
    border-bottom: none;
}


/*.dark .btn.btn-primary {
    color: var(--text-color) !important;
    background: var(--nav-bg-color) !important;
}*/
.dark .btn-primary-outline {
    background: linear-gradient(to bottom, var(--light-bg), var(--dark-bg)) !important;
    color: var(--text-color) !important;
    border: 1px solid #878787;
    transition: .2s;
}

.dark .btn-primary-outline:hover {
    transform: scale(1.05);
    border-color: var(--text-color);
    box-shadow: 0 0 4px var(--text-color);
}

.dark .table th {
    color: white !important;
    background: var(--light-bg) !important;
    border: 1px solid var(--dark-bg);
}


.dark .pagination ul > li > a,
.dark .pagination ul > li > span {
    background-color: var(--light-bg);
    color: var(--text-white);
}

.dark #footer {
    color: var(--text-color);
    background-color: var(--nav-bg-color) !important;
}

.dark .n-sendmail-content,
.dark .white-shadow-block,
 {
    background-color: var(--dark-bg) !important;
}
.dark .striped:nth-child(even) {
    background: var(--table-striped-bg) !important;
}

.dark .custom-select {
    background-color: var(--background-color) !important;
    color: white !important;
}

.dark .multi-drp {
    background-color: var(--background-color) !important;
}

.dark .pro-plan .dropdown-menu {
    border: 1px solid var(--text-color);
    background: var(--dark-bg);
    color: var(--text-color);
}
/*   Calendar   */
.dark .ui-datepicker .ui-datepicker-header {
    background: var(--background-color) !important;
}

.dark .ui-state-default,
.dark .ui-widget-content .ui-state-default,
.dark .ui-widget-header .ui-state-default {
    color: var(--text-white);
    text-align: center;
    background: var(--nav-bg-color);
}


.dark .ui-widget-header {
        background: var(--dark-bg) !important;
    }

.dark .ui-state-active, .dark .ui-widget-content .ui-state-active {
    background-color: #0089d4 !important;
}

.dark .ui-state-hover,
.dark .ui-widget-content .ui-state-hover,
.dark .ui-widget-header .ui-state-hover,
.dark .ui-state-focus,
.dark .ui-widget-content .ui-state-focus,
.dark .ui-widget-header .ui-state-focus {
    background: #0089d4 !important;
    color: var(--text-white) !important;
}

.dark .ui-state-highlight,
.dark .ui-widget-content .ui-state-highlight,
.dark .ui-widget-header .ui-state-highlight {
    background: #42579c !important;
    border: none;
}
/* Calendar Styles ended*/

.dark input[type="text"]:disabled {
    border-color: var(--light-bg) !important;
    cursor: no-drop !important;
}

.dark input[disabled],
.dark input[readonly],
.dark select[disabled],
.dark select[readonly],
.dark textarea[disabled],
.dark textarea[readonly] {
    background-color: var(--dark-bg) !important;
}


.dark .pagination ul > li > a.active {
    background-color: #0089d4 !important;
}

.dark .popover,
.dark .popover-title {
    background: var(--dark-bg) !important;
}

.dark .popover {
    border: 2px solid var(--text-color) !important;
}

.dark .popover-header {
    color: var(--text-color);
    background-color: var(--background-color) !important;
}

.dark .popover-body {
    color: var(--text-color) !important;
}

.dark .popover-content {
    background: var(--dark-bg) !important;
    color: var(--text-color) !important;
}

.dark .n-sendmail-content {
    background: var(--dark-bg);
}

/* Admin > Dashboard setting*/
.dark .white-block {
    background: var(--background-color) !important;
}

.dark .h-part {
    background: var(--light-bg) !important;
}

.dark .modal-content {
    background: var(--dark-bg) !important;
}

/*user profile styles*/
.dark .super-admin-toggle li a {
    color: var(--text-color) !important;
}

.dark .super-admin-toggle {
    background-color: var(--dark-bg) !important;
}

.dark .super-admin-toggle li:hover .super-admin-atag {
    color: #fff;
    background-color: var(--background-color) !important;
}
/*user profile styles ended*/

.dark .down-up-block .btn-outline-light {
    color: var(--text-color) !important;
    background-color: var(--dark-bg) !important;
}

.dark .pro-plan .dropdown-menu li:hover {
    background: var(--background-color);
    color: #fff;
}

/*calender styles*/
.dark .ui-state-default,
.dark .ui-widget-content .ui-state-default,
.dark .ui-widget-header .ui-state-default {
    color: #fff;
    text-align: center;
    background: var(--nav-bg-color);
}

.dark .ui-datepicker .ui-datepicker-header {
    background: var(--background-color) !important;
}

.dark .ui-state-active, .dark .ui-widget-content .ui-state-active {
    background-color: #0089d4 !important;
}
/*   Calendar   */
.dark .ui-datepicker .ui-datepicker-header {
    background: var(--background-color) !important;
}
.dark table.ui-datepicker-calendar {
    background: var(--background-color) !important;
    color: var(--text-color) !important;
}
/*calender styles ended*/
.dark .calendar-table .table th {
    background-color: var(--light-bg) !important;
    color: var(--text-color) !important;
}
.dark .tiny-rightmargin {
    color: var(--text-color);
}
.dark .btn-primary:disabled,
.dark .btn-gray-disable {
    background-color: transparent !important;
    border-color: #c6c6c6 !important;
    color: #fffcfc !important;
}

.dark .nav-tabs > .active > a {
    cursor: default;
    color: var(--text-color) !important;
    background-color: var(--dark-bg) !important;
    border: 2px solid #0089d4;
    border-bottom-color: transparent;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding-bottom: 4px;
}

.dark .capsule-left {
    background-color: var(--dark-bg);
    border: 1px solid var(--border-color);
}

.dark .table {
    background: var(--dark-bg) !important;
}

.dark .capsule-left .text {
    color: var(--text-color);
}

.dark .well {
    background: var(--dark-bg) !important;
}

.dark .ui-widget-content {
    background: var(--dark-bg) !important;
}

.dark .ui-dialog .ui-dialog-content {
    color: var(--text-color) !important;
    background: var(--dark-bg) !important;
}

.dark .imgmouseover .imgmouseovercontent {
    background: var(--dark-bg) !important;
    color: var(--text-color) !important;
}


.dark .table-striped tbody tr:nth-of-type(odd)
 {
    background-color: var(--dark-bg) !important;
    color: var(--text-color) !important;
}
.dark .table-striped tbody tr:nth-of-type(even){
    background: var(--table-striped-bg) !important;
}
.dark .fp-m,
.dark .time-label {
    color: var(--text-color) !important;
}

.dark .label-heading {
    color: var(--text-color) !important;
}

.dark .toggle-ul-ipas li.active a {
    color: #ff3434;
}

.dark .toggle-ul-ipas li:hover a {
    color: red;
    background: transparent !important;
}

.dark .dropdown-menu {
    color: var(--text-color) !important;
    background:var(--dark-bg) !important;
    border-color: var(--border-color) !important;
}

.dark .nav-tabs > .active > a {
    color: var(--text-color);
    background-color: var(--dark-bg) !important;
    border-bottom-color: transparent !important;
    cursor: default;
    border: 1px solid var(--text-color);
}

.dark .tooltip {
    background: var(--dark-bg) !important;
    color: var(--text-color) !important;
}

.dark .pane--table2 {
    background: var(--background-color) !important;
}

/*popup close button styles*/
.dark .modal.cust .close {
    color: #ff4d4d !important;
    text-shadow: none !important;
    opacity: 1;
}

.dark .modal.cust .close .text {
    color: var(--text-color) !important;
    text-shadow: none !important;
    opacity: 1;
}

/*scrollbar styles*/
.dark ::-webkit-scrollbar {
    width: 15px;
    height: 15px;
    border-radius: 10px;
    background: var(--dark-bg) !important;
}

.dark ::-webkit-scrollbar-track {
    border-radius: 10px;
    background: var(--dark-bg) !important;
}

.dark ::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: var(--light-bg);
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: var(--border-color);
}

.dark ::-webkit-scrollbar-button:single-button {
    width: 15px;
    height: 15px;
    border-style: solid;
    background: var(--dark-bg);
}

.dark ::-webkit-scrollbar-button:single-button:hover {
    background: var(--light-bg);
}

/* Scrollbar Up Arrow Button */
.dark ::-webkit-scrollbar-button:single-button:vertical:decrement {
    border-width: 0 8px 8px 8px;
    border-color: transparent transparent #9a9fba transparent;
}
/* Scrollbar Down Arrow Button */
.dark ::-webkit-scrollbar-button:single-button:vertical:increment {
    border-width: 8px 8px 0 8px;
    border-color: #9a9fba transparent transparent transparent;
}
/* Scrollbar Left Arrow Button */
.dark ::-webkit-scrollbar-button:single-button:horizontal:decrement {
    border-width: 8px 8px 8px 0;
    border-color: transparent #9a9fba transparent transparent;
}
/* Scrollbar Right Arrow Button */
.dark ::-webkit-scrollbar-button:single-button:horizontal:increment {
    border-width: 8px 0 8px 8px;
    border-color: transparent transparent transparent #9a9fba;
}
/*autofill input color-profile styles*/
.dark input:-webkit-autofill,
.dark input:-webkit-autofill:hover,
.dark input:-webkit-autofill:focus,
.dark input:-webkit-autofill:active,
.dark select:-webkit-autofill,
.dark select:-webkit-autofill:hover,
.dark select:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 30px var(--dark-bg) inset !important;
    -webkit-text-fill-color: var(--text-color) !important;
}
/*breadcrumb hover style*/
 .bread a:hover {
    color: #f90 !important;
    text-decoration: none;
}

.dark .table-green-box-heading {
    background: var(--dark-bg) !important;
    color: var(--text-color) !important;
    border: none;
}

.dark input[id^="txt"],
.dark input[type="text"],
.dark input[type="search"],
.dark input[type="password"],
.dark select,
.dark textarea,
.dark div[title="Select"],
.dark input.form-control {
    color: var(--text-color) !important;
    background: var(--dark-bg) !important;
}

.dark .p-instructions,
.dark .well,
.dark .info-block,
.dark .custom-gradient-two {
    background: var(--dark-bg) !important;
}

.dark .table {
    color: var(--text-color);
}

/* Default Button */
.dark .down-up-block .btn-outline-light {
    color: var(--text-color) !important;
    background: linear-gradient(to bottom, var(--light-bg), var(--dark-bg));
    text-shadow: none !important;
    transition: 0.3s;
    border: 1px solid #878787;
}

.dark .down-up-block .btn-outline-light:hover {
    transform: scale(1.1);
    border-color: var(--text-color);
}

.dark .table-bordered {
    border-left: 1px solid #cdd2d2 !important;
}


/*blue text color to white*/
.dark a {
    color: #fff;
}

.dark .text-primary {
    color: var(--text-color) !important;
}

.dark .down-up-div:hover,
/*.dark .table-div:hover, .split_view ~ div:hover,*/
.dark .define_search_criteria ~ div:hover {
    color: #fff;
}

.dark .search-section .active div {
    color: var(--text-white) !important;
}

/*delete & edit white icons*/
.dark .i-edit-blue {
    background: url('../../Styles/veg-new-master/images/edit-white.svg');
    opacity: 0.8;
}

.dark .i-delete-red {
    background: url('../../Styles/veg-new-master/images/delete-white.svg');
}

.dark .i-mail-active {
    background: url('../../Styles/veg-new-master/images/mail-active-white.svg');
}

.dark .icon-muted {
    opacity: 0.4;
}

.dark .fa-suitcase {
    color: #0089d4;
}