/* -------------------- Basic HTML tags -------------------- */
:root {
    --bodyBgColor: #1E2124;
    --headerSidebarBgColor: #2E3136;
    --textPrimary: #f5f5f5;
    --formBorderColor: #424351;
    --text-primary-color: #8db037;
    --text-primary-button-color-focus: rgba(141, 176, 55, 0.5);
    --text-primary-button-color-focus-normal-button: 0 2px 2px 0 rgba(141, 176, 55, 0.14), 0 3px 1px -2px rgba(141, 176, 55, 0.2), 0 1px 5px 0 rgba(141, 176, 55, 0.12);
    --sidebar: rgba(141, 176, 55, .4);
    --text-primary-dark-color: #527302;
    --text-white: #fff;
}


/* @font-face {
    font-family: 'blessedday_regular';
    src: url('../fonts/blessedday/blessedday-dylk-webfont.woff2') format('woff2'),
        url('../fonts/blessedday/blessedday-dylk-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

} */


/* @font-face {
    font-family: 'KrinkesDecorPERSONALUSE';
    src: url('../fonts/decor/KrinkesDecorPERSONALUSE.eot?#iefix') format('embedded-opentype'),
        url('../fonts/decor/KrinkesDecorPERSONALUSE.woff') format('woff'),
        url('../fonts/decor/KrinkesDecorPERSONALUSE.ttf') format('truetype'),
        url('../fonts/decor/KrinkesDecorPERSONALUSE.svg#KrinkesDecorPERSONALUSE') format('svg');
    font-weight: normal;
    font-style: normal;
} */



/* ------------------ Blue Theme Mode ------------------ */

body.blueMode {
    background: #f3f3f3;
}

body.blueMode,
.blueMode .dataTables_wrapper .dataTable thead tr th,
.blueMode .dataTables_wrapper .dataTable tbody tr td,
.blueMode .content-wrapper table thead th,
.blueMode .content-wrapper table tbody td,
.blueMode .chosen-container-single .chosen-single,
.blueMode .content-wrapper table tbody td a,
.blueMode .text-dark,
.blueMode .table th, .blueMode .table td {
    color: #4b4f89 !important;
}

body.blueMode .brand-title, .auth-form-light h4 {
    color: #4b4f89 !important;
}

.blueMode .card,
.blueMode .navbar .navbar-menu-wrapper,
.blueMode .navbar .navbar-brand-wrapper,
.blueMode .sidebar,
.blueMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown,
.blueMode .auth .auth-form-light,
.blueMode .list-group-item {
    background: #ebedf6;
}

.blueMode .form-control,
.blueMode .dataTables_wrapper select,
.blueMode .dataTables_filter input.form-control.form-control-sm,
.blueMode .chosen-container-single .chosen-single,
.blueMode .chosen-container .chosen-drop,
.blueMode .displaytOnlyName {
    border: 1px solid #4b4f89;
    background: #fff;
    color: #000;
}

.blueMode .form-control:focus,
.blueMode .dataTables_wrapper select:focus,
.blueMode .dataTables_filter input.form-control.form-control-sm:focus,
.blueMode .chosen-container-active.chosen-with-drop .chosen-single,
.blueMode .chosen-container .chosen-drop {
    border: 1px solid #4b4f89;
    background: #fff;
    color: #000;
}

.blueMode .sidebar .nav .nav-item.active>.nav-link i,
.blueMode .sidebar .nav .nav-item.active>.nav-link .menu-title,
.blueMode .sidebar .nav .nav-item.active>.nav-link .menu-arrow,
.blueMode .sidebar .nav:not(.sub-menu)>.nav-item:hover>.nav-link {
    color: #4b4f89;
}

.blueMode .navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand,
.blueMode .text-primary,
/* .blueMode .btn-primary, */
.blueMode .btn-outline-primary,
.blueMode .chosen-container .chosen-results li.no-results {
    color: #4b4f89 !important;
}

.blueMode .btn-primary,
.blueMode .btn-primary:hover,
.blueMode .btn-primary:focus,
.blueMode .btn-primary:active,
.blueMode .btn-outline-primary:hover,
.blueMode .btn-outline-primary:focus,
.blueMode .btn-outline-primary:active {
    background-color: #4b4f89 !important;
    border-color: #4b4f89 !important;
    color: #fff !important;
    border-color: #4b4f89 !important;
    box-shadow: 0 2px 2px 0 rgba(75, 79, 137, 0.14), 0 3px 1px -2px rgba(75, 79, 137, 0.2), 0 1px 5px 0 rgba(75, 79, 137, 0.12) !important;
}

.blueMode .pagination .page-item.active .page-link,
.blueMode .paginate_button.current {
    background-color: #4b4f89 !important;
    border-color: #4b4f89 !important;
    color: #fff !important;
}

.blueMode .pagination a:hover,
.blueMode .page-link:hover {
    color: #4b4f89;
}

.blueMode .dataTables_wrapper .dataTables_filter input:focus {
    background: #4b4f89 !important;
    color: #fff !important;
}

.blueMode .form-check .form-check-label input[type="checkbox"]+.input-helper:before,
.blueMode .form-check .form-check-label input[type="radio"]+.input-helper:before {
    border: 2px solid #4b4f89;
}

.blueMode .form-check .form-check-label input[type="checkbox"]:checked+.input-helper:before,
.blueMode .form-check .form-check-label input[type="radio"]:checked+.input-helper:before {
    background: #4b4f89;
}

.blueMode a.dashboard-module,
.blueMode a.dashboard-module:visited {
    background: #4b4f89;
    color: #fff;
}

.blueMode a.dashboard-module:hover,
.blueMode a.dashboard-module:active {
    background: #4b4f89;
    color: #fff;
    opacity: 0.9;
}

.blueMode ul.theme-change li a.active {
    background: #4b4f89 !important;
    color: #fff !important;
}

.blueMode .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: #4b4f89 !important;
    color: white;
}
.blueMode h2.pageHeading {
    color:#4b4f89 !important;
    margin-top: 10px;
}
.blueMode h2.ownerTitle {
    color: #4b4f89 !important;
    margin: 0;
}
.blueMode .dataTable i, #body_detail_matter i {
    display: inline-block;
    font-size: 20px;
    width: 20px;
    text-align: left;
    color: #4b4f89 !important;
}

.blueMode .my_tabs_customs.nav-tabs .nav-item .nav-link.active {
    border: 0;
    border-bottom: 3px solid #4b4f89;
    color: #4b4f89;
}
.blueMode .my_tabs_customs.nav-tabs .nav-link {
    color: #4b4f89 !important;
}



/* ------------------ Blue Theme Mode END ------------------ */



body {
    /* font-family: 'Rubik', sans-serif; */
    /* font: 12px/1.5 "Roboto", "Lucida Sans Unicode", "Lucida Grande", sans-serif; */
    font: 12px/1.5 "Rubik", sans-serif; 
    color: #000;
    background-color: #f3f3f3;
}

a:focus {
    outline: 1px dotted invert;
}

hr {
    border-color: #ccc;
    border-style: solid;
    border-width: 1px 0 0;
    clear: both;
    height: 0;
}


h1 {
    font-size: 30px;
    letter-spacing: -1.5px;
}

h2 {
    margin-top: 40px;
    font-size: 18px;
    font-weight: 500;
    line-height: 1;
    letter-spacing: 0.2px;
}

ol {
    list-style: decimal;
    list-style-position: inside;
}

ul.bullets {
    list-style: disc;
    list-style-position: inside;
}

ul.bullets li {
    margin-left: 20px;
    margin-bottom: 5px;
}

p,
dl,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
pre,
table,
address,
fieldset {
    margin-bottom: 15px;
}

a,
a:visited {
    color: #1a5fff;
    text-decoration: none;
}

a:hover,
a:active {
    text-decoration: underline;
}

h1 a,
h1 a:visited,
h2 a,
h2 a:visited,
h3 a,
h3 a:visited,
h4 a,
h4 a:visited,
h5 a,
h5 a:visited,
h6 a,
h6 a:visited {
    color: #444444;
}

h1 a:hover,
h1 a:active,
h2 a:hover,
h2 a:active,
h3 a:hover,
h3 a:active,
h4 a:hover,
h4 a:active,
h5 a:hover,
h5 a:active,
h6 a:hover,
h6 a:active {
    color: #0063be;
}


b,
strong {
    font-weight: 700;
}



/* --------------------  Custom general classes -------------------- */

.align-left {
    text-align: left;
}

.align-right {
    text-align: right;
}

.align-center {
    text-align: center;
}

.align-justify {
    text-align: justify;
}

.float-left {
    float: left;
}

.float-right {
    float: right;
}

.bottom-spacing {
    margin-bottom: 20px;
}



/* -------------------- Page elements -------------------- */


#mobile {
    display: none !important;
}

#header {
    margin-bottom: 20px;
}

#header-status {
    background: #000000;
    padding: 0;
    color: #aaaaaa;
}

#text-invitation {
    display: block;
    float: left;
    padding: 9px 0 11px 0;
}

#message-notification {
    display: block;
    float: left;
    background: url(../images/mail-q-bg.jpg) top left no-repeat;
    color: #6dc6e7;
    padding: 9px 0 11px 0;
    text-decoration: none;
    margin-left: 10px;
}

#message-notification span {
    color: #444444;
    margin-right: 15px;
    text-align: center;
    display: block;
    float: left;
    width: 32px;
}

#message-notification a:hover,
#message-notification a:active {
    color: #ffffff;
}

a#logout,
a#logout:visited {
    display: block;
    float: right;
    background: url(../images/icon-logout.gif) center right no-repeat;
    color: #6dc6e7;
    padding: 9px 20px 11px 0px;
    text-decoration: none;
}

a#logout:hover,
a#logout:active {
    color: #ffffff;
}

#header-main {
    background: #005195 url(../images/header-bg.jpg) repeat-x top left;
    height: 0px;
}

#header-main #logo {
    background: url(../images/logo.jpg) no-repeat right 10px;
    width: 100%;
    height: 70px;
}

#subnav {
    background: #ffffff url(../images/submenu-bg.gif) repeat-x bottom left;
    height: 48px;
}

#subnav ul {
    list-style: none;
    margin: 0;
    padding: 0;

}

#subnav ul li {
    float: left;
    margin: 0 18px 0 0;
    padding: 0;
}

#subnav ul a,
#subnav ul a:visited {
    display: block;
    float: left;
    color: #0063be;
    font-size: 14px;
    padding: 9px 0 0 0;
    text-decoration: none;
}

#subnav ul a:hover,
#subnav ul a:active {
    text-decoration: underline;
}

#footer {
    padding: 0;
    color: #aaaaaa;
    padding: 12px 0 15px 0;
    margin-top: 30px;
    border-top: 1px solid #cccccc;
}



/* -------------------- Nav tabs (sliding door technique) -------------------- */


ul#nav {
    float: left;
    margin-top: 60px;
    list-style: none;
    font-size: 14px;
    margin-bottom: 0;

}

ul#nav li {
    background: transparent url(../images/tab-left.gif) no-repeat scroll left top;
    float: left;
    margin: 0 5px 0 0;
    padding: 0 0 0 9px;
}

ul#nav li a,
ul#nav li a:visited {
    background: transparent url(../images/tab-right.gif) no-repeat scroll right top;
    color: #FFFFFF;
    display: block;
    float: left;
    padding: 7px 15px 6px 6px;
    text-decoration: none;
}

ul#nav li a:hover {
    padding: 8px 15px 5px 6px;
}

ul#nav li#current {
    /* give the id="current" to the currently selected tab */
    background: transparent url(../images/tab-active-left.gif) no-repeat scroll left top;
}

ul#nav li#current a {
    background: transparent url(../images/tab-active-right.gif) no-repeat scroll right top;
    color: #444444;
}




/* -------------------- Box module -------------------- */

div.module {
    background: url(../images/module-body-left-bg.gif) no-repeat scroll bottom left;
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

div.module div.module-body {
    background: url(../images/module-body-right-bg.gif) no-repeat scroll bottom right;
    padding: 20px 3% 20px 3%;
    float: left;
    width: 94%;
}

/* Percentage padding in the module dependant on the cell width */
.grid_1 div.module div.module-body {
    padding: 20px 8% 20px 8%;
    float: left;
    width: 84%;
}

.grid_2 div.module div.module-body {
    padding: 20px 7% 20px 7%;
    float: left;
    width: 86%;
}

.grid_3 div.module div.module-body {
    padding: 20px 6% 20px 6%;
    float: left;
    width: 88%;
}

.grid_4 div.module div.module-body {
    padding: 20px 5% 20px 5%;
    float: left;
    width: 90%;
}

.grid_5 div.module div.module-body {
    padding: 20px 4% 20px 4%;
    float: left;
    width: 92%;
}

.grid_6 div.module div.module-body {
    padding: 20px 3% 20px 3%;
    float: left;
    width: 94%;
}

.grid_7 div.module div.module-body {
    padding: 20px 2.75% 20px 2.75%;
    float: left;
    width: 94.5%;
}

.grid_8 div.module div.module-body {
    padding: 20px 2.5% 20px 2.5%;
    float: left;
    width: 95%;
}

.grid_9 div.module div.module-body {
    padding: 20px 2.25% 20px 2.25%;
    float: left;
    width: 95.5%;
}

.grid_10 div.module div.module-body {
    padding: 20px 2% 20px 2%;
    float: left;
    width: 96%;
}

.grid_11 div.module div.module-body {
    padding: 20px 1.75% 20px 1.75%;
    float: left;
    width: 96.5%;
}

.grid_12 div.module div.module-body {
    padding: 20px 1.5% 20px 1.5%;
    float: left;
    width: 97%;
}



div.module div.module-table-body {
    background: url(../images/module-body-right-bg.gif) no-repeat scroll bottom right;
    padding: 0;
    float: left;
    width: 100%;
}

div.module h2 {
    /* Sliding right image */
    background: url(../images/module-header-left-bg.gif) no-repeat scroll top left;
    display: block;
    float: left;
    height: 32px;
    /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
    margin-right: 0px;
    padding-right: 0px;
    /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
    /* FONT PROPERTIES */
    text-decoration: none;
    color: #444444;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-family: 'Rubik', sans-serif;
    font-size: 12px;
    font-weight: bold;
    width: 100%;
    margin-bottom: 0;
    letter-spacing: normal
}

div.module h2 span {
    /* Background left image */
    background: url(../images/module-header-right-bg.gif) no-repeat top right;
    display: block;
    line-height: 20px;
    /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
    padding: 7px 0 5px 18px;

}

div.module table {
    width: 100%;
    margin: 0 0 10px 0;
    border-left: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
}

div.module table.tr {
    border-collapse: separate;
    border-right: 1px solid #aaaaaa;
    border-left: 1px solid #aaaaaa;
}

div.module table th {
    background-color: #eeeeee;
    color: #444444;
    padding: 5px;
    text-align: left;
    border-right: 1px solid #d9d9d9;
    border-bottom: 1px solid #d9d9d9;
}

div.module table td {
    background-color: #ffffff;
    padding: 5px;
    ;
    border-right: 1px solid #d9d9d9;

}

/*
 white-space: -moz-pre-wrap !important;  
white-space: -pre-wrap;     
white-space: -o-pre-wrap;    
white-space: pre-wrap;      
word-wrap: break-word;      
word-break: break-all;
white-space: normal;
*/
div.module table tr.odd td {
    /* You can use this style if you want to do zebra-colored tables with other technique than Table Sorter script used here */
    background-color: #f1f5fa;
}

.table-apply {
    width: 40%;
    float: right;
    text-align: right;
    margin-right: 10px;
}




/* -------------------- Pager -------------------- */
.pager {
    display: block;
    padding: 0px 10px 10px 10px;
    width: 40%;
    float: left;
}

.pager .first,
.pager .prev,
.pager .next,
.pager .last {
    margin-bottom: -2px;
}





/* -------------------- Button (sliding door technique) -------------------- */

/* button outside a module box */
a.button {
    /* Sliding right image */
    background: transparent url(../images/button-right-bg-m.gif) no-repeat scroll top right;
    display: block;
    float: left;
    height: 26px;
    /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
    padding-right: 11px;
    /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
    /* FONT PROPERTIES */
    text-decoration: none;
    color: #444444;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-family: 'Rubik', sans-serif;
    font-size: 12px;
}

a.button span {
    /* Background left image */
    background: transparent url(../images/button-left-bg-m.gif) no-repeat top left;
    display: block;
    line-height: 15px;
    /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
    padding: 4px 0 7px 10px;
}

a.button:hover {
    background-position: bottom right;
    color: #0063be;
}

a.button:hover span {
    background-position: bottom left;
    color: #0063be;
}

/* button inside a module box */
div.module a.button {
    /* Sliding right image */
    background: transparent url(../images/button-right-bg.gif) no-repeat scroll top right;
    display: block;
    float: left;
    height: 26px;
    /* CHANGE THIS VALUE ACCORDING TO IMAGE HEIGHT */
    padding-right: 11px;
    /* CHENGE THIS VALUE ACCORDING TO RIGHT IMAGE WIDTH */
    /* FONT PROPERTIES */
    text-decoration: none;
    color: #444444;
    /* font-family: Arial, Helvetica, sans-serif; */
    font-family: 'Rubik', sans-serif;
    font-size: 12px;
}

div.module a.button span {
    background: transparent url(../images/button-left-bg.gif) no-repeat top left;
    display: block;
    line-height: 15px;
    /* CHANGE THIS VALUE ACCORDING TO BUTTONG HEIGHT */
    padding: 4px 0 7px 10px;
}



/* -------------------- Pagination -------------------- */

.pagination {
    margin-bottom: 20px;
    float: right;
}

.pagination a.button {
    margin-right: 10px;
}

.pagination a.last {
    margin-right: 0;
}

.pagination .numbers {
    float: left;
    padding-top: 3px;
    margin-right: 15px;
}

.pagination .numbers span {
    padding: 0 5px 0 5px;
}

.pagination .current {
    font-weight: bold;
}




/* -------------------- Forms -------------------- */
.search_box {
    width: 20% !important;
}

fieldset {
    margin-top: 15px;
    margin-bottom: 15px;
}

legend {
    margin-bottom: 10px;
    display: block;
}

label {
    display: block;
    margin-bottom: 5px;
}

select {
    padding: 2px;
}

textarea {
    padding: 3px;
}

/* .form-control {
	width: 46%
} */

.input-medium {
    width: 46%
}

.input-long {
    width: 75%
}




/* -------------------- Text input and select input notifications -------------------- */

.notification-input {
    background: 10px 50% no-repeat;
    margin: 0 0 0 5px;
    padding: 5px 0 5px 32px;
    font-size: 12px;
}

.ni-correct {
    background-image: url(../images/tick-on-white.gif);
    color: #00ae42;
}

.ni-error {
    background-image: url(../images/cross-on-white.gif);
    color: #c9282d;
}




/* --------------------  Boxed notifications -------------------- */

.notification {
    display: block;
    padding: 20px 20px 20px 45px;
    border: 1px solid;
    margin-bottom: 20px;
    background-repeat: no-repeat;
    background-position: 20px 20px;
}

.n-success {
    background-color: #a3e6bd;
    border-color: #68d59b;
    background-image: url(../images/notification-tick.gif);
}

.n-information {
    background-color: #9fddea;
    border-color: #5fceea;
    background-image: url(../images/notification-information.gif);
}

.n-attention {
    background-color: #f9e497;
    border-color: #ffcb4f;
    background-image: url(../images/notification-exclamation.gif);
}

.n-error {
    background-color: #ffc6ca;
    border-color: #efb9c3;
    background-image: url(../images/notification-slash.gif);
}

/* -------------------- Indicators -------------------- */


.indicator {
    width: 220px;
    height: 12px;
    background: url(../images/indicator-bg.gif) no-repeat top left;
}

.indicator div {
    height: 12px;
    background: url(../images/indicator-green-to-red.gif) no-repeat top left;
}

.indicator div.reverse {
    background: url(../images/indicator-red-to-green.gif) no-repeat top left;
}




/* -------------------- Category list -------------------- */

a.removable,
a.removable:visited {
    padding: 5px 18px 5px 0px;
}

a.removable:hover,
a.removable:active {
    background: url(../images/cross-small.gif) no-repeat center right;
}




/* -------------------- To-do list -------------------- */

a.checkable,
a.checkable:visited {
    padding: 5px 18px 5px 0px;
}

a.checkable:hover,
a.checkable:active {
    background: url(../images/tick-small.gif) no-repeat center right;
}

a.completed,
a.completed:visited {
    color: #aaaaaa;
}




/* -------------------- Messages -------------------- */
.separated {
    border-top: 1px solid #cccccc;
    padding-top: 15px;
}

.user {
    display: block;
    padding-left: 22px;
    background: url(../images/user.gif) left 50% no-repeat;
    font-size: 14px;
    color: #666666;
    font-weight: normal;
}

.user-female {
    display: block;
    padding-left: 22px;
    background: url(../images/user-female.gif) left 50% no-repeat;
    font-size: 14px;
    color: #666666;
    font-weight: normal;
}

.reply {
    padding-left: 20px;
    background: url(../images/arrow-curve-180-left.gif) left 50% no-repeat;
    margin-right: 7px;
}

.forward {
    padding-left: 20px;
    background: url(../images/arrow-curve-000-left.gif/) left 50% no-repeat;
    margin-right: 7px;
}

a.delete,
a.delete:visited {
    padding-left: 16px;
    background: url(../images/cross-small.gif) left 50% no-repeat;
    color: #C00;
}

h3.mail {
    display: block;
    padding: 20px 0px 20px 70px;
    background: url(../images/Crystal_Project_mail_open.gif) left 50% no-repeat;
}

#p-messages {
    padding: 20px;
}





/* -------------------- Login page -------------------- */

form.login {
    background: url(../images/Crystal_Clear_locked.gif) 87% 10px no-repeat;
}





/* -------------------- Dashboard -------------------- */

ul.dashboard-grid {
    list-style: none;
    padding: 0;
}

ul.dashboard-grid li {
    width: 14%;
    display: inline-block;
}

a.dashboard-module,
a.dashboard-module:visited {
    /* width: 142px;
	height: 142px; */
    padding: 10px;
    display: block;
    /* float: left; */
    background: #fff;
    border-radius: 10px;
    margin: 0 8px 8px 0;
    text-align: center;
    color: #444444;
    box-shadow: 3px 3px 5px 1px #cfcfcf;
}

a.dashboard-module:hover,
a.dashboard-module:active {
    background-position: bottom left;
    text-decoration: none;
    color: var(--text-primary-color);
}

a.dashboard-module .icon-holder {
    font-size: 45px;
}

/* a.dashboard-module img {
	margin-top: 20px;
} */

a.dashboard-module span {
    margin-top: 10px;
    display: block;
}

/* HOME PAGE*/
#header-main {
    box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.4);
    background: -webkit-linear-gradient(#7a7a7a, #ededed);
    background: -moz-linear-gradient(#7a7a7a, #ededed);
}

body.home-page div#header-status,
#subnav {
    display: none;
}

body.home-page .main-part {
    width: 100%;
    float: left;
    margin-top: 7%
}

body.home-page .main-part div.module {
    width: 48%;
    padding: 18px 17px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 1px 4px 15px rgba(0, 0, 0, 0.5);
}

body.home-page .main-part div.module div.module-body {
    background: none;
    border: 2px solid #eee;
    border-radius: 5px;
    float: right;
    width: 60%;
}

body.home-page .main-part div.module div.module-body form p {
    padding-bottom: 22px;
}

body.home-page .main-part div.module div.module-body form p label {
    width: 35%;
    float: left
}

body.home-page .main-part div.module div.module-body form p input {
    background: none;
    background-color: #fff;
    border: 1px solid #eee;
    border-radius: 3px;
    width: 55%;
    padding: 5px 8px;
}

body.home-page .main-part div.module div.module-body form fieldset {
    width: 65%;
    float: right
}

body.home-page .main-part div.module .left-module-part {
    width: 30%;
    float: left;
}

body.home-page .main-part div.module .left-module-part div.login-image {
    background: url(../images/lock-icon.png) no-repeat;
    width: 152px;
    height: 137px;
    float: left;
    margin: 15px 0 25px 10px;
}

body.home-page .main-part div.module .left-module-part .left-info {
    width: 85%;
    text-align: justify
}

body.home-page .main-part div.module2 {
    width: 40%;
    float: left;
    margin-left: 4%;
    padding: 18px 17px;
    background: #fff;
    border-radius: 3px;
    box-shadow: 1px 4px 15px rgba(0, 0, 0, 0.5);
}

body.home-page .main-part div.module2 .m-container {
    width: 100%;
    float: left;
}

body.home-page .main-part div.module2 .m-container .l-img {
    width: 40%;
    float: left;
}

body.home-page .main-part div.module2 .m-container .l-img img {
    width: 84%;
    float: left;
}

body.home-page .main-part div.module2 .m-container .right-text {
    width: 50%;
    float: left;
    padding-top: 10px;
    padding-left: 30px;
}

body.home-page .main-part div.module2 .m-container .right-text p {
    padding-bottom: 10px;
}

body.home-page .main-part div.module2 .m-container .bottom-text {
    width: 100%;
    float: left;
}

body.home-page .main-part div.module2 .m-container .bottom-text p {
    text-align: justify;
    padding-top: 10px;
}

#header-status {
    background: #353535;
    color: #fff;
}

a#cpassword,
a#cpassword:visited,
a#logout,
a#logout:visited {
    color: #fff !important
}

a {
    cursor: pointer
}

.success_row{
    background: #dff0d8 !important;
}
.danger_row{
    background: #f2d5d5 !important;
}

.s-btn {
    background: gray;
    padding: 3px 10px;
    color: #fff;
    border-radius: 3px;
    margin-left: 10px;
    cursor: pointer
}

.p-btn {
    background: #353535;
    padding: 3px 10px;
    color: #fff;
    border-radius: 3px;
}

ul#nav {
    margin-top: 9px;
}

.empty-list {
    height: 150px;
}

/*-------RESPONSIVE--------*/
@media only screen and (min-width:240px) and (max-width:414px) {
    body {
        overflow-x: hidden
    }

    body.home-page .main-part div.module {
        width: 85% !Important;
        float: left;
    }

    body.home-page .main-part div.module2 {
        width: 85%;
        margin-left: 0px;
    }

    body.home-page .main-part div.module .left-module-part {
        float: right;
    }

    body.home-page .main-part div.module div.module-body {
        float: left
    }

    body.home-page .main-part div.module .left-module-part div.login-image {
        width: 124px;
        margin: 0px 0px 24px -30px;
    }

    body.home-page .main-part div.module div.module-body form fieldset {
        float: left
    }

}

@media only screen and (min-width:415px) and (max-width:768px) {
    body {
        overflow-x: hidden
    }

    body.home-page .main-part div.module {
        width: 85% !Important;
        float: left;
    }

    body.home-page .main-part div.module2 {
        width: 85%;
        margin-left: 0px;
    }
    #myTable .form-control{
        width: auto;
    }

}

@media only screen and (min-width:769px) and (max-width:1024px) {
    body.home-page .main-part div.module .left-module-part div.login-image {
        margin: 15px 0px -5px 10px
    }
}

.dataTable {
    width: 100%;
}

h2.pageHeading {
    color: var(--text-primary-color);
    ;
    margin-top: 10px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

div#listing {
    /* padding: 0rem 1.04rem; */
}

.permissions .form-check {
    margin: 0px;
}

.container#listing,
.container {
    max-width: 100%;
    padding: 0 !important;
}

.tableCard {
    float: left;
    width: 50%;
    margin-bottom: 5px;
}

.tableCard.store {
    width: 33%;
    position: relative;
}

.tableCard.addNewCard {
    text-align: right;
}

.multiButtns {
    display: inline-block;
    margin: 10px 2px;
}

.multiButtns a,
.multiButtns a:visited {
    color: #fff;
}

.dataTable i,
#body_detail_matter i {
    display: inline-block;
    font-size: 20px;
    width: 20px;
    text-align: left;
    color: var(--text-primary-color);
    ;
}

.trash i {
    color: #ff4747 !important;
    cursor: pointer;
}

.trash.faded i {
    cursor: no-drop;
}


.dataTables_wrapper .dataTable tbody tr td,
table thead th {
    font-size: 14px !important;
}

.dataTables_wrapper .dataTable thead .sorting:before,
.dataTables_wrapper .dataTable thead .sorting_asc:before,
.dataTables_wrapper .dataTable thead .sorting_desc:before,
.dataTables_wrapper .dataTable thead .sorting_asc_disabled:before,
.dataTables_wrapper .dataTable thead .sorting_desc_disabled:before {
    top: 1.5rem;
    bottom: auto;
}

.dataTables_filter input.form-control.form-control-sm {
    margin: 0;
    border-radius: 0;
    height: auto;
    border: 1px solid #efefef;
    margin-left: 5px;
}

.text-muted a {
    color: #686868 !important;
}

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

select.search_box {
    width: 100% !important;
    color: #000;
    border: 1px solid #000;
}

.dataTables_wrapper .dataTable .btn.shortBtn {
    padding: 3px 9px;
    display: inline-flex;
}

a.shortBtn,
a.shortBtn:visited {
    color: #fff !important;
}

.auth .brand-logo>img {
    width: 100%;
}

.auth .brand-logo {
    width: 30%;
    display: inline-block;
    margin-right: 3%;
    vertical-align: middle;
    margin-bottom: 0px;
}

.logo-header {
    margin-bottom: 1rem;
    width: 100%;
    float: left;
}


.brand-title {
    display: inline-block;
    vertical-align: middle;
    width: 66%;
}

.brand-title h1 {
    padding: 0;
    margin: 0;
}

.top-error {
    color: #000 !important;
    background: #ffdada;
    padding: 10px 15px;
}

.top-error araier_massege_admin {
    color: #000 !important;
}

.top-error p {
    margin: 0px;
    color: #000 !important;
}

.sidebar .nav.sub-menu .nav-item::before {
    content: none;
}

.sidebar .nav.sub-menu {
    padding: 0.25rem 0 0.6rem 2.35rem;
}


li.nav-item.hover-open .nav.flex-column.sub-menu li a span {
    left: -24px !important;
    padding-left: 48px !important;
    box-shadow: none !important;
}

li.nav-item.hover-open .nav.flex-column.sub-menu li a i {
    z-index: 999999;
    position: relative;
    left: -25px;
}

.fileUploadSection {
    display: flex;
}

.fileUploadSection .input-group-append {
    display: block;
}

.fileUploadSection .input-group-append button {
    line-height: 1.4;
}

.row.editFormRow {
    margin-left: 0px;
    margin-right: 0px;
}

.labelMarginZero {
    margin: 0px !important;
}

.uploadedLogoOuter {
    float: left;
    width: 100%;
    text-align: right;
    padding-right: 10px;
}

.dt-buttons {
    float: left;
    margin-bottom: 10px;
    width: 320px;
}

.dataTables_filter {
    float: right;
}

.dataTables_filter input {
    padding: 5px 8px !important;
}

/* .tableWithNoExport .dt-buttons {
	display: none;
}

.truck .tableWithNoExport .dt-buttons {
	display: inline-block;
} */

.dataTables_length {
    float: left;
}

.dataTables_length select {
    background: transparent;
}

div#err_id {
    margin-bottom: 15px;
}
div#err_id p{
    margin: 2px;
}
.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}
.alert-danger {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1;
}

body .chosen-container {
    width: 100% !important;
}

.chosen-container-single .chosen-single {
    border: 1px solid #000000;
    padding: 0.875rem 1.375rem;
    height: auto;
    background: #e9ecef;
    border-radius: 0;
    line-height: normal;
    box-shadow: none;
    color: #000000;
}


.chosen-container-multi .chosen-choices {
    border: 1px solid #000000;
    padding: 0.500rem 1.375rem;
    height: auto;
    background: #e9ecef;
    border-radius: 0;
    line-height: normal;
    box-shadow: none;
    color: #000000;
}

.chosen-container-active.chosen-with-drop .chosen-single {
    border: 1px solid #000000;
    padding: 0.875rem 1.375rem;
    height: auto;
    background: #e9ecef;
    border-radius: 0;
    line-height: normal;
    box-shadow: none;
    color: #000000;
}

.chosen-container .chosen-drop {
    border: 1px solid #000000;
    color: #000000;
}

.chosen-container-single .chosen-search input[type="text"] {
    padding: 0.500rem;
    border: 1px solid #000;
}

.chosen-container-single .chosen-search input[type="text"]:focus {
    border: 1px solid #80bdff;
}

.chosen-container .chosen-results li {
    color: #000000;
}

.form-control,
.dataTables_wrapper select {
    border: 1px solid #000;
}

.modal-content {
    color: #000;
}


.contain-row {
    float: left;
    width: 95%;
    max-width: 1170px;
    margin: 0 auto;
}

ul.theme-change {
    padding: 0px;
    text-align: right;
    font-size: 0;
}

ul.theme-change li {
    list-style: none;
    padding: 0px;
    display: inline-block;
}

ul.theme-change li a {
    font-size: 14px;
    background: #efefef;
    padding: 5px 25px;
    color: #000;
}



ul.theme-change li:first-child a {
    border-top-left-radius: 15px;
    border-bottom-left-radius: 15px;
}

ul.theme-change li:last-child a {
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
}

ul.theme-change li a:hover {
    text-decoration: none;
}

.displaytOnlyName {
    padding: 0.875rem 1.375rem;
    border: 1px solid #aaa;
    background: #e9ecef;
}

.displaytOnlyName p {
    margin: 0px;
    font-weight: 100;
}

.port-div,
.biller-div,
.qty-div,
.ref-div,
.remarks-div,
.vessel-do-div {
    display: none;
}

.calendar-table * {
    color: #000;
}


.form-control:disabled,
.dataTables_wrapper select:disabled,
.form-control[readonly],
.dataTables_wrapper select[readonly] {
    color: #000;
}

.form-control[readonly],
.dataTables_wrapper select[readonly] {
    background: rgba(233, 236, 239, 0.4);
    cursor: not-allowed;
    border: 1px solid rgba(0, 0, 0, 0.3);
}

#new_datepickers {
    cursor: pointer;
    background: #e9ecef;
}

.form-control,
.dataTables_wrapper select,
.form-control[disabled],
.dataTables_wrapper select[disabled] {
    background: #e9ecef;
    color: #000;
}


.chosen-container .chosen-results li.no-results {
    background: #e9ecef;
    color: #000;
}

.auth form .form-group .form-control:focus,
.auth form .form-group .dataTables_wrapper select:focus,
.dataTables_wrapper .auth form .form-group select:focus {
    background: #e9ecef;
    color: #000;
}


h1.welcomeText {
    color: var(--text-primary-color);
    ;
    /* font-family: 'blessedday_regular'; */
    font-family: 'Rubik', sans-serif;
    font-size: 60px;
}

.table td img {
    border-radius: 0px;
}

h2.ownerTitle {
    color: var(--text-primary-color);
    ;
    margin: 0;
}

.ownerDetails {
    margin-bottom: 20px;
}

.ownerDetails p {
    margin: 0;
}

.brand-title.full-length {
    text-align: center;
    width: 100%;
}

.brand-title,
.auth-form-light h4 {
    color: var(--text-primary-color);
    ;
}

.auth form .form-group .form-control,
.auth form .form-group .dataTables_wrapper select,
.dataTables_wrapper .auth form .form-group select {
    background: #e9ecef;
    color: #000000;
}

::placeholder {
    color: rgba(0, 0, 0, 0.7) !important;
    opacity: 1;
}

:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.7) !important;
}

::-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.7) !important;
}

body div.dataTables_wrapper div.dataTables_length select {
    color: #000 !important;
    border: 1px solid rgba(151, 151, 151, 0.18) !important;
}

.form-check-auto-approve .form-check {
    margin: 17px 0;
}

.chosen-container-multi .chosen-choices li.search-choice {
    box-shadow: none;
    color: #ffffff;
    border: 0;
    background: var(--text-primary-color);
}


a.search-choice-close {
    position: relative;
}

a.search-choice-close::after {
    position: absolute;
    content: "x";
    top: -2px;
    right: 0;
    color: #ffffff;
    z-index: 12;
    font-size: 13px;
    background: transparent;
    width: 14px;
    height: 14px;
    text-align: center;
    border-radius: 100%;
}

.staff_type {
    display: none;
}

.staff_type.active {
    display: flex;
}


.chosen-disabled {
    /* opacity: 1;
	color: #000;
	border: 1px solid #aaa; */
}

#filter div#dealer_div {
    float: left;
    width: 100%;
}

form#filter {
    float: left;
    width: 100%;
    padding-left: 12px;
}

#filter .chosen-container-single .chosen-single {
    background: #fff;
    color: #000000;
}

.dataTable .currency-holder i {
    font-size: 15px !important;
    color: #000;
    /* display: none; */
}

.dataTable .currency-holder a i {
    color: #1a5fff;
}

.filter-search-box input {
    background: #e9ecef;
    color: #000;
    border: 1px solid rgba(151, 151, 151, 0.18);
    font-weight: 100;
    padding: 7px 10px;
    font-size: 12px;
    /* max-width: 100% !important; */
}

.filter-search-box input:focus {
    border-color: #80bdff;
}

@media (min-width: 992px) {
    nav#sidebar {
        position: fixed;
        left: 0;
        height: 0px;
    }

    .main-panel {
        margin-left: 257px;
    }

    .sidebar-icon-only .main-panel {
        margin-left: 70px;
    }

    body.sidebar-open nav#sidebar {
        overflow-y: auto;
        overflow-x: hidden;
    }


    /* scrollbar when collapse side menu */
  

    body.sidebar-icon-only nav#sidebar .nav-item.hover-open .collapse::-webkit-scrollbar {
        width: 8px;
    }

    
    body.sidebar-icon-only nav#sidebar .nav-item.hover-open .collapse::-webkit-scrollbar-thumb{
        border-radius: 10px;
        box-shadow: inset 0 0 6px var(--sidebar);
        background-color: var(--text-primary-color);
        border: 1px solid var(--text-primary-color);
    }

    body.sidebar-icon-only nav#sidebar .nav-item.hover-open .collapse {
        height: 200px;
        overflow-y: auto;
        overflow-x: hidden;
    }

    /* end scrollbar when collapse side menu */

}

.chosen-container-single .chosen-single div {
    width: 10px;
    height: 20px;
    top: 45%;
    transform: translateY(-50%);
    right: 10px;
    background: transparent;
}

h2#swal2-title {
    text-transform: capitalize;
}

.hide {
    display: none;
}

.form-check .form-check-label {
    margin-top: 0.9rem;
}

.dt-buttons a {
    color: #fff;
}

.dt-buttons.wide {
    width: 100%;
}


form#searchData {
    margin-top: 45px;
}

div#loader {
    position: fixed;
    background: rgba(0, 0, 0, 0.6);
    content: '';
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: none;
}

.loaderHolder {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translateY(-50%);
    width: 110px;
    text-align: center;
    color: #fff;
}

.loader {
    border: 3px solid #f3f3f3;
    border-radius: 50%;
    border-top: 3px solid var(--text-primary-color);
    width: 40px;
    height: 40px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    margin: auto;
    margin-bottom: 0;
}



.darkMode div#loaderMain {
    background: var(--bodyBgColor) !important;
}

div#loaderMain {
    position: fixed;
    background: #f3f3f3;
    content: '';
    z-index: 9999;
    width: 100%;
    height: 100%;
    display: none;
}

.loaderHolderMain {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 45%;
    width: 110px;
    text-align: center;
    color: #fff;
}

.loaderMain {
    margin: auto;
    margin-bottom: 0;
}

.loaderHolderMain img {
    width: 150px;
    height: auto;
}
.darkMode .loaderHolderMain .dark-logo{
    display: block !important;
}
.darkMode .loaderHolderMain .main-logo{
    display: none !important;
}



tfoot {
    font-size: 14px;
}

div#listLoader {
    position: absolute;
    background: rgba(0, 0, 0, 0.6);
    content: '';
    z-index: 99999999999999;
    width: 90%;
    height: 100px;
}

.listloaderHolder {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    top: 50%;
    transform: translateY(-50%);
    width: 110px;
    text-align: center;
    color: #fff;
}

.loader-handle {
    border: 3px solid #f3f3f3;
    border-radius: 50%;
    border-top: 3px solid #3498db;
    width: 40px;
    height: 40px;
    -webkit-animation: spin 2s linear infinite;
    animation: spin 2s linear infinite;
    margin: auto;
    margin-bottom: 0;
}


#searchFilterData input.btn.btn-primary.mr-2 {
    padding: 14px 25px;
}

.search_filter_div {
    margin-bottom: 30px;
}

.form-group label {
    width: 100%;
}


.search_filter_div .multiButtns {
    margin: 0;
}

.search_filter_div .multiButtns a {
    padding: 10px 20px;
}


.tableStructDetails {
    display: table;
}

.tableHeadDetails,
.tableBodyDetails {
    display: table-row;
}


.tableHeadDetails>div,
.tableBodyDetails>div {
    display: table-cell;
    border: solid;
    border-width: thin;
    padding-left: 5px;
    padding-right: 5px;
}



/* DivTable.com */
.divTable {
    display: table;
    width: 100%;
}

.divTableRow {
    display: table-row;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
}

.divTableCell,
.divTableHead {
    border: 1px solid #999999;
    display: table-cell;
    padding: 15px 10px;
}

.divTableHeading {
    background-color: #EEE;
    display: table-header-group;
    font-weight: bold;
}

.divTableFoot {
    background-color: #EEE;
    display: table-footer-group;
    font-weight: bold;
}

.divTableBody {
    display: table-row-group;
}

.divTableRow.divTableHeadBody {
    font-weight: 800;
}

h3.currentDateTime {
    margin: 0;
    font-size: 18px;
    color: #4a4a4a;
}


.swal2-container {
    z-index: 106060 !important;
}

.sidebar .nav.sub-menu .nav-item .nav-link {
    white-space: break-spaces;
    display: flex;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show>.btn-primary.dropdown-toggle {
    color: #fff;
    background-color: var(--text-primary-color);
    border-color: var(--text-primary-color);
    box-shadow: 0 2px 2px 0 var(--text-primary-button-color-focus-normal-button);
}

.btn-primary:not(:disabled):not(.disabled):active:focus,
.btn-primary:not(:disabled):not(.disabled).active:focus,
.show>.btn-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0.2rem var(--text-primary-button-color-focus);
}


.navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand,
.navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand:hover {
    color: var(--text-primary-dark-color);
}

.sidebar .nav .nav-item.active>.nav-link i,
.sidebar .nav .nav-item.active>.nav-link .menu-title,
.sidebar .nav .nav-item.active>.nav-link .menu-arrow,
.sidebar .nav:not(.sub-menu)>.nav-item:hover>.nav-link {
    color: var(--text-primary-color);
}

.navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand img {
    height: auto;
    width: 45%;
    margin: 0 auto;
}

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



.page-item.active .page-link, .paginate_button.current {
    background-color: var(--text-primary-color) !important;
    border-color: var(--text-primary-color) !important;
}

.page-link:hover {
    color: var(--text-primary-color);
}

a,
a:hover,
a:visited,
.page-link,
.page-link:hover,
.page-link:visited {
    /*color: var(--text-primary-color);*/
    color: #000;
}

.darkMode td span a,
.darkMode td span a:hover,
.darkMode td span a:visited {
    color: var(--text-primary-color);
}

body .dataTables_wrapper .dataTable tbody tr td .highlightData a {
    font-size: 0.86rem !important;
}

.form-check .form-check-label input[type="checkbox"]+.input-helper:before {
    border: 2px solid var(--text-primary-color);
}

.form-check .form-check-label input[type="checkbox"]:checked+.input-helper:before {
    background: var(--text-primary-color);
}

a.btn.btn-primary:visited {
    color: #fff !important;
}


.logo-w {
    display: none;
}

.darkMode .logo-m {
    display: none;
}

.darkMode .logo-w {
    display: inline;
}


.darkMode .auth .login-half-bg {
    background: url(../images/auth/login-bg-d.jpg);
    background-size: cover;
}

.posAB {
    position: absolute;
    left: 0;
    width: 100%;
    top: 0;
    z-index: 193323;
    max-width: 100%;
    padding: 20px 40px;
}

.darkMode .auth-img-bg ul.theme-change li a {
    background-color: var(--text-white);
    color: #4a4a4a;
}

.darkMode .auth-img-bg ul.theme-change li a.active {
    background-color: var(--text-primary-color);
    color: var(--text-white);

}


.brand-info {
    margin-top: 40px;
}

.auth.auth-img-bg .auth-form-transparent {
    width: 65%;
    margin: auto;
}


.totalListdiv {
    display: inline-block;
    width: 100%;
}

.dataTables_wrapper .dataTable .totalListdiv .btn {
    padding: 0.6rem 1rem;
}

.btn-primary.disabled,
.btn-primary:disabled {
    color: #fff;
    background-color: var(--text-primary-dark-color);
    border-color: var(--text-primary-dark-color);
}



#dataTable input.form-control {
    height: 0.2em;
}

.btn-outline-primary {
    color: var(--text-primary-color);
    border-color: var(--text-primary-color);
}

.btn-outline-primary:hover {
    color: var(--text-white);
    border-color: var(--text-primary-color);
    background-color: var(--text-primary-color);
}

#calendar .my-calender-bg-info {
    background-color: var(--text-primary-color) !important;
    color: var(--text-primary-color) !important;
    cursor: pointer;
}

#calendar .my-calender-bg-info a {
    color: var(--text-white) !important;
}

.taskAuthor {
    text-align: right;
    position: relative;
}

.commentAuthor {
    float: left;
    width: 30%;
}

.commentDetails {
    float: left;
    width: 58%;
}

.taskAuthor .commentAuthor {
    float: right;
}

.edit_task_comment {
    position: absolute;
    top: 7px;
    left: 10px;
    display: none;
}

#mytaskTable tr:hover .edit_task_comment {
    display: block;
}

.taskAuthor {
    text-align: right;
    position: relative;
}

.dataTables_wrapper .dataTable thead .sorting:before,
.dataTables_wrapper .dataTable thead .sorting_asc:before,
.dataTables_wrapper .dataTable thead .sorting_desc:before,
.dataTables_wrapper .dataTable thead .sorting_asc_disabled:before,
.dataTables_wrapper .dataTable thead .sorting_desc_disabled:before,
.dataTables_wrapper .dataTable thead .sorting:after,
.dataTables_wrapper .dataTable thead .sorting_asc:after,
.dataTables_wrapper .dataTable thead .sorting_desc:after,
.dataTables_wrapper .dataTable thead .sorting_asc_disabled:after,
.dataTables_wrapper .dataTable thead .sorting_desc_disabled:after {
    display: none;
}

span.comment_count {
    background: var(--text-primary-color);
    color: #fff;
    position: absolute;
    padding: 3px 5px;
    border-radius: 100%;
    font-size: 7px;
    display: inline-block;
    word-break: normal;
}

span.highlightData, a.highlightData {
    background: #FF0000 !important;
    color: #fff !important;
    width: 100%;
    display: grid;
}

span.highlightData a {
    color: #fff !important;
}











/* Dark Theme */

/* .darkMode .btn-primary {
	background: #008B46;
	border: #008B46;
} */

.darkMode .auth form .auth-link {
    color: var(--text-primary-color);
}

.darkMode .auth form .auth-link:hover {
    opacity: 0.9;
}

.darkMode .content-wrapper {
    background: var(--bodyBgColor);
}

.darkMode .footer,
.darkMode .navbar .navbar-menu-wrapper,
.darkMode .navbar .navbar-brand-wrapper,
.darkMode .sidebar,
.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown,
.darkMode .auth .auth-form-light ,
.darkMode .list-group-item {
    background: var(--headerSidebarBgColor);
}

.darkMode .card {
    background: var(--headerSidebarBgColor);
    border: 1px solid var(--headerSidebarBgColor);
}

.darkMode select.form-control,
.darkMode .dataTables_wrapper select {
    outline: none;
}


.darkMode .navbar .navbar-menu-wrapper,
.darkMode .navbar .navbar-brand-wrapper {
    border-bottom: 1px solid var(--headerSidebarBgColor);
}

.darkMode .navbar .navbar-brand-wrapper,
.darkMode .sidebar {
    border-right: 1px solid var(--headerSidebarBgColor);
}

.darkMode .sidebar .nav:not(.sub-menu)>.nav-item {
    border-bottom: 1px solid var(--headerSidebarBgColor);
}

.darkMode .text-muted,
.darkMode .text-muted a {
    color: var(--textPrimary) !important;
}

.darkMode .card .card-title {
    color: var(--textPrimary);
}

.darkMode .text-muted a:hover {
    opacity: 0.9;
}

.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown .dropdown-item:hover .text-primary {
    color: var(--text-white) !important;
}

.darkMode .navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-toggler,
.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.nav-profile .nav-link .nav-profile-name,
.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.nav-profile .nav-link::after,
.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown .dropdown-item {
    color: var(--textPrimary);
}

.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown .dropdown-item:hover {
    background: var(--text-primary-color);
    color: var(--text-white);
}

.darkMode .navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand {
    color: var(--text-primary-color);
}



.darkMode .sidebar .nav .nav-item .nav-link,
.darkMode .sidebar .nav .nav-item .nav-link i.menu-arrow {
    color: var(--textPrimary);
}


/* .darkMode .sidebar .nav:not(.sub-menu)>.nav-item:hover>.nav-link,
.darkMode .sidebar .nav:not(.sub-menu)>.nav-item.active a {
	background: var(--text-primary-color);
	color: var(--text-white);
} */

/* .darkMode .sidebar .nav .nav-item.active>.nav-link i,
.darkMode .sidebar .nav .nav-item.active>.nav-link .menu-title,
.darkMode .sidebar .nav .nav-item.active>.nav-link .menu-arrow {
	background: var(--text-primary-color);
	color: var(--text-white);
} */

.darkMode .sidebar .nav.sub-menu .nav-item .nav-link:hover {
    color: var(--text-primary-color);
}


/* .darkMode .sidebar .nav:not(.sub-menu)>.nav-item:hover>.nav-link i.menu-arrow,
.darkMode .navbar .navbar-menu-wrapper .navbar-nav .nav-item.dropdown .navbar-dropdown .dropdown-item:hover {
	background: var(--text-primary-color);
	color: var(--text-white);
} */
body.darkMode{
    background: var(--bodyBgColor);
}

body.darkMode,
.darkMode .dataTables_wrapper .dataTable thead tr th,
.darkMode .dataTables_wrapper .dataTable tbody tr td,
.darkMode .content-wrapper table thead th,
.darkMode .content-wrapper table tbody td,
.darkMode .chosen-container-single .chosen-single, 
.darkMode .content-wrapper table tbody td a ,
.darkMode .text-dark,
.darkMode .table th, .darkMode .table td{
    color: var(--textPrimary) !important;
}

.darkMode table thead th,
.darkMode table tbody td {
    border: 1px solid rgba(151, 151, 151, 0.18);
}


.darkMode .stretch-card>.card {
    border: 1px solid var(--headerSidebarBgColor);
}

.darkMode .form-control,
.darkMode .dataTables_wrapper select,
.darkMode .dataTables_filter input.form-control.form-control-sm,
.darkMode .chosen-container-single .chosen-single,
.darkMode .chosen-container .chosen-drop,
.darkMode .displaytOnlyName {
    border: 1px solid var(--formBorderColor);
    background: var(--bodyBgColor);
    color: var(--textPrimary);
}

.darkMode .form-control:focus,
.darkMode .dataTables_wrapper select:focus,
.darkMode .dataTables_filter input.form-control.form-control-sm:focus,
.darkMode .chosen-container-active.chosen-with-drop .chosen-single,
.darkMode .chosen-container .chosen-drop {
    border: 1px solid #80bdff;
    background: var(--bodyBgColor);
    color: var(--textPrimary);
}

.darkMode .dataTables_wrapper .dataTable tbody tr:nth-child(odd),
.darkMode .table-striped tbody tr:nth-of-type(odd) {
    background: var(--bodyBgColor);
}

.darkMode .chosen-container .chosen-results li.no-results {
    background: var(--bodyBgColor);
}

.darkMode .chosen-container .chosen-results li,
.darkMode .chosen-container-single .chosen-search input[type="text"] {
    color: var(--textPrimary);
}

.darkMode .page-item.disabled .page-link,
.darkMode .page-item:first-child .page-link,
.darkMode .page-item:last-child .page-link,
.darkMode .pagination a,
.darkMode .pagination a:visited {
    background: var(--bodyBgColor);
    color: var(--textPrimary);
    border: 1px solid var(--text-white);
}

.darkMode .page-item.active .page-link {
    background: var(--text-primary-color);
    color: var(--text-white);
    border: 1px solid var(--text-primary-color);
}

.darkMode .pagination a:hover,
.darkMode .page-item:first-child .page-link:hover,
.darkMode .page-item:last-child .page-link:hover {
    background: #fff;
    color: var(--text-primary-color);
}

.darkMode.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title,
.darkMode.sidebar-icon-only .sidebar .nav .nav-item.hover-open .collapse,
.darkMode.sidebar-icon-only .sidebar .nav .nav-item.hover-open .collapsing {
    background: var(--headerSidebarBgColor);
    color: var(--textPrimary);
    box-shadow: none;
}

.darkMode.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title:hover {
    background: var(--text-primary-color);
    color: var(--text-white);
}

.darkMode.sidebar-icon-only .sidebar .nav.sub-menu .nav-item .nav-link:hover {
    background: var(--text-primary-color);
    color: var(--text-white);
}

.darkMode.sidebar-icon-only .sidebar .nav .nav-item.active>.nav-link i {
    background: transparent;
}

.darkMode.sidebar-icon-only .sidebar .nav .nav-item .nav-link .menu-title {
    border-radius: 0px;
}

.darkMode a.dashboard-module,
.darkMode a.dashboard-module:visited {
    background: var(--text-primary-color);
    color: var(--text-white);
    box-shadow: none;
}

.darkMode a.dashboard-module:hover,
.darkMode a.dashboard-module:active {
    background: var(--text-primary-color);
    color: var(--text-white);
    text-decoration: none;
    opacity: 0.9;
}

.darkMode ul.theme-change li a {
    background: rgba(255, 255, 255, 0.1);
    color: var(--text-white);
}

.darkMode .auth form .form-group .form-control,
.darkMode .auth form .form-group .dataTables_wrapper select,
.darkMode .dataTables_wrapper .auth form .form-group select,
.darkMode .auth form .form-group .form-control:focus,
.darkMode .auth form .form-group .dataTables_wrapper select:focus,
.darkMode .dataTables_wrapper .auth form .form-group select:focus {
    background: var(--bodyBgColor);
    color: var(--text-white);
}

.darkMode ::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.darkMode :-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.darkMode ::-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.darkMode .form-control:disabled,
.darkMode .dataTables_wrapper select:disabled,
.darkMode .form-control[readonly],
.darkMode .dataTables_wrapper select[readonly] {
    background-color: var(--headerSidebarBgColor);
    color: var(--text-white);
}

.darkMode #new_datepickers {
    background-color: var(--headerSidebarBgColor);
}

.darkMode div.dataTables_wrapper div.dataTables_length select {
    color: var(--text-white) !important;
}

.darkMode .chosen-container-multi .chosen-choices {
    border: 1px solid var(--formBorderColor);
    padding: 0.500rem 1.375rem;
    height: auto;
    background: var(--bodyBgColor);
    border-radius: 0;
    line-height: normal;
    box-shadow: none;
    color: #000000;
}

.darkMode #filter .chosen-container-single .chosen-single {
    background: var(--headerSidebarBgColor);
    color: var(--text-white);
}

.darkMode .dataTable .currency-holder i {
    color: var(--textPrimary);
}

.darkMode .filter-search-box input {
    background: var(--headerSidebarBgColor);
    color: var(--text-white);
    border: 1px solid var(--formBorderColor);
    font-weight: 100;
    padding: 7px 10px;
}

.darkMode .filter-search-box input:focus {
    border-color: #80bdff;
}

.darkMode tfoot {
    color: var(--text-white);
}





ul.theme-change li a.active {
    background: var(--text-primary-color);
    color: var(--text-white);
}


nav#sidebar::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
.table-responsive::-webkit-scrollbar-track, .dataTables_scrollBody::-webkit-scrollbar-track {
    border: 1px solid var(--sidebar);
    padding: 2px 0;
    background-color: var(--sidebar);
}

nav#sidebar::-webkit-scrollbar,
body::-webkit-scrollbar, .dataTables_scrollBody::-webkit-scrollbar {
    width: 8px;
}

.table-responsive::-webkit-scrollbar, .dataTables_scrollBody::-webkit-scrollbar {
    height: 8px;
}

nav#sidebar::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb, .dataTables_scrollBody::-webkit-scrollbar-thumb {
    border-radius: 10px;
    box-shadow: inset 0 0 6px var(--sidebar);
    background-color: var(--text-primary-color);
    border: 1px solid var(--text-primary-color);
}


/* .navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand#desk {
	display: inline-block !important;
}

.navbar .navbar-brand-wrapper .navbar-brand-inner-wrapper .navbar-brand#mobile {
	display: none !important;
} */

.form-control:focus,
.dataTables_wrapper select:focus,
.chosen-container-single.chosen-container-active a.chosen-single,
.darkMode .form-control:focus,
.darkMode .dataTables_wrapper select:focus,
.darkMode .chosen-container-single.chosen-container-active a.chosen-single,
.filter-search-box input:focus,
.darkMode .filter-search-box input:focus,
.form-control#new_datepickers[readonly]:focus {
    background: var(--text-primary-color);
    color: #fff;
}

.form-group .btn-light:focus, .darkMode .form-group .btn-light:focus{
    background: #e2e6ea
}  
.form-group .btn-danger:focus, .darkMode .form-group .btn-danger:focus{
    background: #ff1414
}  
.form-group .btn-primary:focus, .darkMode .form-group .btn-primary:focus{
    background: var(--text-primary-dark-color);
}    



.darkMode .modal-content {
    background: var(--headerSidebarBgColor);
    color: var(--text-white);
}

.darkMode .modal-content .close {
    color: var(--text-white);
}


.darkMode h3.currentDateTime {
    color: var(--text-white);
}



.filter-search-box input:focus::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
    opacity: 1;
}

.filter-search-box input:focus:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.filter-search-box input:focus::-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}


.datepicker_filter:focus::placeholder,
.datepicker_filter2:focus::placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
    opacity: 1;
}

.datepicker_filter:focus:-ms-input-placeholder,
.datepicker_filter2:focus:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.datepicker_filter:focus::-ms-input-placeholder,
.datepicker_filter2:focus::-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.7) !important;
}

.dataTables_processing {
    display: none !important;
}

div.filter_date_div {
    display: none;
}

.out-logo-holder {
    float: left;
    width: 100%;
    margin-bottom: 20px;
}

.brand-logo {
    float: left;
}

.owner-logo {
    max-width: 80px;
    float: left;
}


.owner-logo img {
    width: 100%;
}



.form-check-primary.form-check label input[type="checkbox"]+.input-helper:before,
.form-check-primary.form-check label input[type="radio"]+.input-helper:before {
    border-color: var(--text-primary-color);
}

.form-check-primary.form-check label input[type="checkbox"]:checked+.input-helper:before,
.form-check-primary.form-check label input[type="radio"]:checked+.input-helper:before {
    background: var(--text-primary-color);
}

body .dataTables_wrapper .dataTable {
    width: 100% !important;
}

body .dataTables_wrapper #newDataTable.dataTable thead tr th,
body .dataTables_wrapper #newDataTable.dataTable tbody tr td,
body .dataTables_wrapper #newDataTable.dataTable tfoot tr td {
    white-space: break-spaces;
    /* padding: 0.5em 0.5em; */
    font-size: 13px !important;
}


body .dataTables_wrapper #newDataTable.dataTable thead tr th:first-child,
body .dataTables_wrapper #newDataTable.dataTable tbody tr td:first-child,
body .dataTables_wrapper #newDataTable.dataTable tfoot tr td:first-child {
    white-space: nowrap;
}

body .dataTables_wrapper .dataTable thead tr th,
body .dataTables_wrapper .dataTable tbody tr td,
body .dataTables_wrapper .dataTable tfoot tr td,
body .dataTables_wrapper .dataTable thead tr th,
body .dataTables_wrapper .dataTable tbody tr td,
body .dataTables_wrapper .dataTable tfoot tr td {
    word-break: break-word;
    padding: 0.5em 0.5em;
    font-size: 13px !important;
    white-space: unset;
}


body .dataTables_wrapper .dataTable thead tr th,
body .dataTables_wrapper .dataTable tbody tr td,
body .dataTables_wrapper .dataTable tfoot tr td,
body .dataTables_wrapper .dataTable thead tr th,
body .dataTables_wrapper .dataTable tbody tr td,
body .dataTables_wrapper .dataTable tfoot tr td {
    /* white-space: nowrap; */
    word-break: normal;
}

body .dataTables_wrapper .dataTable thead tr th a,
body .dataTables_wrapper .dataTable tbody tr td a,
body .dataTables_wrapper .dataTable tfoot tr td a {
    font-size: 13px !important;
    display: inherit;
    vertical-align: middle;
}

#unloadTable tbody tr td a {
    font-size: 20px !important;
    color: var(--text-primary-color) !important;
    display: inherit;
    vertical-align: middle;
}

.appendStackHold {
    display: block;
    margin-bottom: 15px;
}

.chosen-container .chosen-results {
    max-height: 170px !important;
}


.adjustable-icon {
    display: inline !important;
}

.my_tabs_customs.nav-tabs .nav-item .nav-link.active {
    border: 0;
    border-bottom: 3px solid var(--text-primary-color);
    color: var(--text-primary-color);
}

.my_tabs_customs.nav-tabs .nav-link {
    color: var(--text-primary-color);
}

.darkMode .my_tabs_customs.nav-tabs {
    border: 1px solid var(--formBorderColor);
}

#total_rej_qty,
#total_rec_qty,
.rec_qty,
.yeild_qty,
.rej_qty {
    padding: 10px;
}

.form-check .form-check-label input[type="radio"]:checked+.input-helper:before {
    background: var(--text-primary-color);
}

.form-check .form-check-label input[type="radio"]+.input-helper:before {
    border: 1px solid var(--text-primary-color);
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show>.btn-outline-primary.dropdown-toggle {
    background-color: var(--text-primary-color);
    border-color: var(--text-primary-color);
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show>.btn-outline-primary.dropdown-toggle:focus {
    box-shadow: 0 2px 2px 0 var(--text-primary-button-color-focus-normal-button);
}

body .dataTables_wrapper .dataTable.returnTruckDispatch thead tr th a,
body .dataTables_wrapper .dataTable.returnTruckDispatch tbody tr td a,
body .dataTables_wrapper .dataTable.returnTruckDispatch tfoot tr td a {
    display: inline-block;
}

span.italicTime {
    display: block;
    font-style: italic;
    font-size: 11px;
    margin: 6px 0 0 0;
}

.sidebar-icon-only .sidebar .nav .nav-item.hover-open .collapse,
.sidebar-icon-only .sidebar .nav .nav-item.hover-open .collapsing,
.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    width: 200px !important;
}

.sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    line-height: 14px;
}

#gentry_stack .appendStack,
#row_stack .appendStack, #stack_mapping_block .appendStack {
    font-size: 0.875rem;
}

#gentry_stack .appendStack .mdi-minus,
#gentry_stack .mdi-plus,
#row_stack .appendStack .mdi-minus,
#row_stack .mdi-plus, #stack_mapping_block .appendStack .mdi-minus, #stack_mapping_block .mdi-minus, #stack_mapping_block .mdi-plus {
    font-size: 1.35rem;
}

#gentry_stack .appendStack .appendStackHold,
#row_stack .appendStack .appendStackHold, #stack_mapping_block .appendStack .appendStackHold {
    margin-bottom: 0px;
}

#gentry_stack .mdi-plus,
#row_stack .mdi-plus, #stack_mapping_block .mdi-plus {
    color: var(--text-primary-color);
}

#gentry_stack .appendStackHold a.trash,
#row_stack .appendStackHold a.trash,
#stack_mapping_block .appendStackHold a.trash {
    vertical-align: middle;
}

.displayShortReport {
    margin: 40px 0;
}

.displayShortReport p {
    margin: 0;
}

.displayShortReport>table {
    display: inline-block;
    margin-right: 30px;
}

.tooltip {
    position: relative;
    display: inline-block;
    opacity: 1;
  }
  
  .tooltip .tooltiptext {
    visibility: hidden;
    width: 120px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
  
    /* Position the tooltip */
    position: absolute;
    z-index: 1;
  }
  
  .tooltip:hover .tooltiptext {
    visibility: visible;
  }

.sidebar-icon-only .sidebar .nav .nav-item-custom .nav-link i.menu-arrow {
    display: block !important;
}

.sidebar-icon-only .sidebar .nav .nav-item-custom .collapse {
    display: none !important;
    margin-left: 52px !important;
    margin-top: -8px !important;
}
.sidebar-icon-only .sidebar .nav .nav-item-custom .collapse.show {
    display: block !important;
}
.bg-light-danger{
	background-color: #ffbaba !important;
}
.tooltip{
    z-index: 0;
}
.dtfh-floatingparenthead{
    top: 50px !important;
    height: 48px !important;
}
.fixedHeader-floating{
    height: 48px !important;
}
.fixedHeader-floating.table th, .fixedHeader-floating.table td {
    vertical-align: middle;
    /* line-height: 1px; */
    white-space: break-spaces;
    padding: 0.5em 0.3em;
    font-size: 11px !important;
    /* text-wrap: nowrap; */
    /* padding-right: 30px !important;*/
}
.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #a7c265 !important;
    border-color: #a7c265 !important;
}
#myTable_paginate .paginate_button.current {
    color: #fff !important;
}
.dataTables_wrapper .dataTables_filter input {
    background-color: #e9ecef !important;
    color: #000 !important;
    margin: 0 !important;
    border-radius: 0 !important;
    height: auto !important;
    border: 1px solid #efefef !important;
    margin-left: 5px !important;
}
.dataTables_wrapper .dataTables_filter input:focus {
    background: var(--text-primary-color) !important;
    color: #fff !important;
}
.dataTables_wrapper .dataTable tbody tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.57);
}

.select2-container .select2-selection--single {
    height: 2.875rem !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 45px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 44px !important;
    position: absolute;
    top: 1px;
    right: 1px;
    width: 20px;
}
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--text-primary-color) !important;
    color: white;
}
.select2-container .select2-selection--multiple {
    min-height: 2.875rem !important;
}
body.darkMode .select2-container--default .select2-results__option .select2-results__option {
    background-color: var(--bodyBgColor) !important;
    color: #fff !important;
}
body.darkMode .select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
    background-color: var(--text-primary-dark-color) !important;
    color: white !important;
}
body.darkMode .select2-container--default .select2-results__option--group {
    color: #d9534f !important;
    background-color: var(--bodyBgColor) !important;
}
body.darkMode .select2-results__option--selectable {
    color: var(--text-primary-dark-color) !important;
    background-color: var(--bodyBgColor) !important;
}
body.darkMode .select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--text-primary-dark-color) !important;
    border: 1px solid var(--formBorderColor) !important;
}
body.darkMode .select2-container--default .select2-selection--single {
    background-color: var(--bodyBgColor) !important;
    border: 1px solid var(--formBorderColor) !important;
    border-radius: 4px;
}
body.darkMode .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #fff !important;
}
body.darkMode .select2-container--default .select2-selection--multiple {
    background-color: var(--bodyBgColor) !important;
}
body.darkMode .select2-search--dropdown {
    background-color: var(--bodyBgColor) !important;
}
body.darkMode .select2-container--default .select2-search--dropdown .select2-search__field {
    background-color: var(--bodyBgColor) !important;
    border: 1px solid var(--formBorderColor) !important;
}
body.darkMode .select2-dropdown {
    background-color: var(--bodyBgColor) !important;
    border: 1px solid var(--formBorderColor) !important;
}
.show-more-filters{
    font-size: 15px;
    text-decoration: underline;
    /* color: red; */
    color: white !important;
}
.show-more-filters:hover{
    font-size: 15px;
    text-decoration: underline;
    /* color: red; */
    color: white !important;
    opacity: 0.9;
}
.disabled-select {
    pointer-events: none;  /* Disable interactions */
    background-color: #eee;  /* Gray background */
    color: #777;            /* Faded text color */
    border: 1px solid #ccc; /* Lighter border */
  }
  .select2-container.readonly .select2-selection--single {
    background-color: #f5f5f5;
    pointer-events: none;
    cursor: not-allowed;
  }
.readonly-checkbox {
    pointer-events: none;
    opacity: 0.6; /* Optional: visual cue to look disabled */
}

.select2-container--open {
  z-index: 999999 !important;
  position: relative;
}




/* Blue Theme Scrollbar */

body.blueMode::-webkit-scrollbar-thumb,
.blueMode nav#sidebar::-webkit-scrollbar-thumb,
.blueMode.dataTables_scrollBody::-webkit-scrollbar-thumb,
.blueMode.table-responsive::-webkit-scrollbar-thumb {
    background-color: #4b4f89;
    border-radius: 10px;
    border: 1px solid #4b4f89;
    box-shadow: inset 0 0 6px rgba(75, 79, 137, 0.4);
}

.select2-container--readonly .select2-selection {
    pointer-events: none !important;
    background-color: #e9ecef !important;
    opacity: 0.6;
    cursor: not-allowed;
}