:root {
  --primary-color: #135AA4;
  --primary-light-color: #3D7EC2;
  --secondary-color: #F39420;
}
/* Buttons */
.custom-btn-icon{
  padding-left: 10px;
  padding-right: 12px;
}
.custom-btn-icon span{
  margin-left: 0;
  padding-left: 5px;
}
.custom-btn-icon.btn-xs{
  padding: 4px 7px;
}
.custom-btn-icon.btn-xs span{
  margin-left: 0;
  padding-left: 5px;
}
.btn-primary {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--primary-color);
  --bs-btn-border-color: var(--primary-color);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--primary-light-color);
  --bs-btn-hover-border-color: var(--primary-light-color);
  --bs-btn-focus-shadow-rgb: 151, 105, 255;
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--primary-color);
  --bs-btn-active-border-color: var(--primary-color);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(16, 25, 36, 0.125);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: var(--primary-color);
  --bs-btn-disabled-border-color: var(--primary-color);
}
.btn-outline-light, .dt-buttons .btn-secondary{
  border-color: #94a5c5;
}
.btn-outline-light:hover, .dt-buttons .btn-secondary:hover{
  border-color: var(--primary-color);
  color: var(--primary-color);
}
.dot-primary{
  background: var(--primary-color);
}
.user-avatar, [class^=user-avatar]:not([class*=-group]){
  background-color: var(--primary-light-color);
}
.form-control:focus, .dual-listbox .dual-listbox__search:focus, div.dataTables_wrapper div.dataTables_filter input:focus{
  border-color: var(--primary-light-color);
}
.pagination {
  --bs-pagination-padding-x: 0.625rem;
  --bs-pagination-padding-y: 0.5625rem;
  --bs-pagination-font-size: 0.8125rem;
  --bs-pagination-color: #526484;
  --bs-pagination-bg: #fff;
  --bs-pagination-border-width: 1px;
  --bs-pagination-border-color: #e5e9f2;
  --bs-pagination-border-radius: 4px;
  --bs-pagination-hover-color: var(--primary-color);
  --bs-pagination-hover-bg: #ebeef2;
  --bs-pagination-hover-border-color: #e5e9f2;
  --bs-pagination-focus-color: var(--bs-link-hover-color);
  --bs-pagination-focus-bg: #e9ecef;
  --bs-pagination-focus-box-shadow: none;
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: var(--primary-color);
  --bs-pagination-active-border-color: var(--primary-color);
  --bs-pagination-disabled-color: #dbdfea;
  --bs-pagination-disabled-bg: #fff;
  --bs-pagination-disabled-border-color: #e5e9f2;
  display: flex;
  padding-left: 0;
  list-style: none;
}
a:hover, .nav-link:hover, .nav-link:focus{
  color: var(--secondary-color);
}
a{
  color: var(--primary-light-color);
}
.nav-link, .nk-menu-link:hover, .active > .nk-menu-link, .is-light .nk-menu-link:hover, .is-light .active > .nk-menu-link,
.nk-menu-link:hover .nk-menu-icon, .nk-menu-item.active > .nk-menu-link .nk-menu-icon, .nk-menu-item.current-menu > .nk-menu-link .nk-menu-icon, .link-list-opt a:hover{
  color: var(--primary-color);
}
.nk-menu-main.nk-menu {
  padding-top: 0.75rem;
}
.nk-menu-main .nk-menu-link {
  color: #526484;
  padding-left: 24px;
}
.nk-menu-main .nk-menu-sub {
  padding: 0;
  margin: 0;
  transition: none;
}
.nk-menu-main .nk-menu-sub .nk-menu-link {
  color: #526484;
}
.nk-menu-main .nk-menu-sub .nk-menu-sub {
  border-left: 1px solid #dbdfea;
  margin: 0.25rem 0 0.25rem 24px;
  padding-bottom: 0;
}
.nk-menu-main .nk-menu-sub .nk-menu-sub .nk-menu-link {
  padding-left: 0.875rem;
}
.nk-menu-main .nk-menu-link:hover, .nk-menu-main .nk-menu-link:focus, .nk-menu-main .nk-menu-item.active > .nk-menu-link, .nk-menu-main .nk-menu-item.current-menu > .nk-menu-link, .nk-menu-main .nk-menu-item:hover > .nk-menu-link {
  color: var(--primary-color);
}
.nk-menu-main .nk-menu-heading {
  padding: 0.75rem 1.25rem 0.5rem;
}
.nk-menu-main .nk-menu-item + .nk-menu-heading {
  padding-top: 1.25rem;
}
.nk-menu-main > li > .nk-menu-link {
  font-family: Roboto, sans-serif;
  font-weight: 500;
  letter-spacing: -0.01rem;
}
.nk-menu-main.ui-s2 > li > .nk-menu-link {
  font-family: Nunito, sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05rem;
  font-weight: 700;
}

@media (max-width: 991.98px) {
  .nk-menu-main.nk-menu {
    max-height: calc(100vh - 65px);
    overflow: auto;
  }
}
@media (min-width: 992px) {
  .nk-menu-main.nk-menu {
    padding: 0 1.5rem 0 2rem;
  }
  .nk-menu-main > li {
    padding: 0;
    display: inline-block;
  }
  .nk-menu-main > li.nk-menu-item {
    padding: 0;
  }
  .nk-menu-main > li.nk-menu-item > .nk-menu-link {
    padding: 1.25rem 1rem;
    font-size: 15px;
    border-radius: 0;
  }
  .nk-menu-main > li > .nk-menu-link:before {
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--primary-color);
    border-radius: 3px 3px 0 0;
    opacity: 0;
  }
  .nk-menu-main > li.nk-menu-item.active > .nk-menu-link:before, .nk-menu-main > li.nk-menu-item.current-menu > .nk-menu-link:before {
    opacity: 1;
  }
  .nk-menu-main > li > .nk-menu-sub {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
  }
  .nk-menu-main .nk-menu-link {
    padding: 0.5rem 1.25rem;
    font-size: 13px;
  }
  .nk-menu-main .nk-menu-icon {
    display: none;
  }
  .nk-menu-main .nk-menu-text {
    line-height: 1.5rem;
  }
  .nk-menu-main .nk-menu-item .nk-menu-toggle:after {
    line-height: 1;
    position: static;
    transform: translateY(0);
    content: "\e9c5";
    vertical-align: middle;
    color: rgba(128, 148, 174, 0.7);
    margin-left: 0.5rem;
    margin-right: -2px;
    margin-top: -1px;
    transition: color 0.1s;
  }
  .nk-menu-main .nk-menu-item:hover > .nk-menu-sub {
    opacity: 1;
    visibility: visible;
    margin-top: 0;
  }
  .nk-menu-main .nk-menu-sub {
    position: absolute;
    left: 0;
    top: 100%;
    width: 200px;
    background: #fff;
    border: 1px solid #e5e9f2;
    box-shadow: 0 0.125rem 0.25rem rgba(43, 55, 72, 0.15);
    border-radius: 4px;
    padding: 0.5rem 0;
    opacity: 0;
    visibility: hidden;
    margin-top: 6px;
    transition: opacity 0.4s, margin 0.2s;
    display: block !important;
  }
  .nk-menu-main .nk-menu-sub .nk-menu-link {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
  .nk-menu-main .nk-menu-sub .nk-menu-sub {
    top: -9px;
    padding: 0.5rem 0;
    border: 1px solid #e5e9f2;
    margin: 0;
    margin-top: 6px;
    left: 100%;
    margin-left: -0.75rem;
  }
  .nk-menu-main .nk-menu-sub .nk-menu-sub .nk-menu-link {
    padding-left: 1.5rem;
  }
  .nk-menu-main .nk-menu-sub .nk-menu-item:hover > a {
    background: #f5f6fa;
  }
  .nk-menu-main .nk-menu-sub .nk-menu-toggle:after {
    content: "\e9d3";
  }
  .nk-aside .nk-menu-main {
    display: none;
  }
  .is-dark .nk-menu-main > li > .nk-menu-link:before, .is-theme .nk-menu-main > li > .nk-menu-link:before {
    border-radius: 0;
    bottom: auto;
    top: 0;
  }
  .is-dark .nk-menu-main > li > .nk-menu-link {
    color: #9faec2;
  }
  .is-dark .nk-menu-main > li > .nk-menu-link.nk-menu-toggle:after {
    color: rgba(128, 148, 174, 0.7);
  }
  .is-dark .nk-menu-main > li:hover > .nk-menu-link, .is-dark .nk-menu-main > li.active > .nk-menu-link, .is-dark .nk-menu-main > li.current-menu > .nk-menu-link, .is-dark .nk-menu-main > li > .nk-menu-link:hover {
    color: #fff;
  }
  .is-theme .nk-menu-main > li > .nk-menu-link {
    color: #c4cefe;
  }
  .is-theme .nk-menu-main > li > .nk-menu-link.nk-menu-toggle:after {
    color: rgba(196, 206, 254, 0.7);
  }
  .is-theme .nk-menu-main > li:hover > .nk-menu-link, .is-theme .nk-menu-main > li.active > .nk-menu-link, .is-theme .nk-menu-main > li.current-menu > .nk-menu-link, .is-theme .nk-menu-main > li > .nk-menu-link:hover {
    color: #fff;
  }
}
.dark-mode .nk-menu-link, .dark-mode .link-dark, .dark-mode .nk-menu-main .nk-menu-sub .nk-menu-link, .dark-mode .link-list a {
  color: #8094ae;
}
.dark-mode .nk-menu-link:hover, .dark-mode .link-dark:hover, .dark-mode .nk-menu-main .nk-menu-sub .nk-menu-link:hover, .dark-mode .link-list a:hover {
  color: #6576ff;
}
.dark-mode .nk-menu-hr, .dark-mode .nk-menu-main .nk-menu-sub, .dark-mode .nk-sidebar .nk-menu > li .nk-menu-sub .nk-menu-sub,
.dark-mode .user-avatar-group .user-avatar {
  border-color: #203247;
}
.dark-mode .nk-menu-main .nk-menu-sub {
  background: #15202f;
}
.dark-mode .nk-menu-main .nk-menu-sub .nk-menu-item:hover > a {
  background-color: #101924;
}
.fc .fc-button-primary{
  background-color: var(--primary-color);
  border-color: var(--primary-color);
}
.fc .fc-button-primary:hover{
  background-color: var(--primary-light-color) !important;
  border-color: var(--primary-light-color) !important;
}
.fc .fc-button-primary:disabled{
  background-color: var(--primary-light-color) !important;
  border-color: var(--primary-light-color) !important;
}
.fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk .fc-prev-button:hover, .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk .fc-prev-button:focus, .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk .fc-next-button:hover, .fc .fc-toolbar.fc-header-toolbar .fc-toolbar-chunk .fc-next-button:focus{
  background-color: var(--primary-light-color) !important;
}
.link-primary{
  color: var(--primary-color) !important;
}
.link-primary:hover{
  color: var(--secondary-color) !important;
}

.form-control-required-wrap{
  display: flex;
  flex-direction: column;
}
.form-control-required-wrap select.form-select{
  order: 0;
}
.form-control-required-wrap .select2-container{
  order: 1;
}
.form-control-required-wrap .parsley-errors-list{
  order: 2;
}
.custom-control-input:checked ~ .custom-control-label::before{
  border-color: var(--primary-color);
  background-color: var(--primary-color);
}
.custom-control-input:focus:not(:checked) ~ .custom-control-label::before{
  border-color: var(--primary-color);
}
.custom-control-input:not(:disabled):active ~ .custom-control-label::before{
  border-color: var(--primary-color);
  background-color: var(--primary-color);
}
/* Parsley CSS */
.parsley-errors-list{
  font-size: 13px;
}
.parsley-errors-list .parsley-required{
  color: #FF0000;
}
input.parsley-error, select.parsley-error, textarea.parsley-error {
  color: #3c4d62 !important;
  background-color: #FFF !important;
  border: 1px solid #dbdfea !important;
}
input.parsley-success, select.parsley-success, textarea.parsley-success {
  color: #3c4d62 !important;
  background-color: #FFF !important;
  border: 1px solid #dbdfea !important;
}
/* view list */
.view-list li{
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.view-list li .label{
  font-weight: 500;
  color: #364a63;
  width: calc(40% - 15px);
  max-width: calc(140px - 15px);
  padding-right: 15px;
  cursor: auto;
}
.view-list li .value{
  width: 60%;
}
.view-list li:last-child{
  margin-bottom: 0;
}

.timeline-wrapper{
  max-height: 670px;
  overflow: auto;
}
.timeline-date{
  width: 110px;
}
.timeline-title{
  margin-bottom: 0.5rem;
}

#approver_users > div:first-child .delete_input,
#reviewer_users > div:first-child .delete_input{
  display: none;
}
/* Filter Tag List */
#filter_tag_list ul{
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
}
#filter_tag_list ul li.filterby-text{
  color: #AAA;
  padding: 4px 0 4px 0;
  border: none;
  background: none;
}
#filter_tag_list ul li{
  font-size: 12px;
  line-height: 1;
  margin: 0 3px 10px 3px;
  padding: 4px 10px 5px 10px;
  background: rgba(255, 255, 255, 0.5);
  border: 1px solid #CCC;
  border-radius: 100px;
  text-transform: capitalize;
  display: flex;
  align-items: center;
}
#filter_tag_list ul li:first-child{
  margin-left: 0;
}
#filter_tag_list ul li a{
  cursor: pointer;
  font-size: 13px;
  padding-left: 3px;
  font-weight: bold;
  color: #AAA;
}
#filter_tag_list ul li:hover a{
  color: #FF8000;
}
.bg-success {
  border-color: #26b874;
  background-color: #26b874 !important;
}
.card-icon-box{
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.5rem;
  height: 60px;
  width: 60px;
  border-radius: 6px;
}
.back-to{
  position: relative;
  top: 2px;
}
.w-1{
  width: 1% !important;
}

.calendar-legends{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 2px 18px;
  margin: 0;
}
.calendar-legends li{
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 5px;
}
.calendar-legends li span.dot{
  width: 14px;
  height: 14px;
  border-radius: 100px;
  border: 1px solid transparent;
}
.calendar-legends li span.dot.green-color{
  background-color: #097054;
}
.calendar-legends li span.dot.blue-color{
  background-color: #003366;
}
.calendar-legends li span.dot.yellow-color{
  background-color: #FF9900;
}
.calendar-legends li span.dot.red-color{
  background-color: #FF0000;
}
.action-col{
  width: auto !important;
  max-width: inherit !important;
  text-align: right !important;
}
.data-separator{
  border-top: 1px solid #e4e4e4;
  margin-top: 20px;
  padding-top: 27px;
}
.progress-bar-item{
  display: flex;
  flex-direction: column;
}
.progress-bar-item .label{
  flex: 1;
}
.progress-bar-item-label{
  display: flex;
  justify-content: space-between;
}
.progress-bar-item-label .label:last-child{
  text-align: right;
}
.custom-task-progress.progress{
  background-color: #f2ac5f;
}
.custom-legend{
  margin: 5px 0 0 0;
  font-size: 13px;
}
.custom-legend li{
  display: flex;
  align-items: center;
  gap: 10px;
}
.custom-legend li .custom-legend-color{
  display: inline-block;
  width: 12px;
  height: 10px;
  background-color: #003366;
}
.custom-legend li .custom-legend-color.green{
  background-color: #57dba5;
}
.custom-legend li .custom-legend-color.yellow{
  background-color: #f2ac5f;
}
.custom-legend li .custom-legend-color.green-dark{
  background-color: #00b360;
}
.custom-legend li .custom-legend-color.blue{
  background-color: #1d74b9;
}
.doughnut-center-text{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  font-size: 0.75rem;
  line-height: 1.4;
  font-weight: 600;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.doughnut-center-text span{
  font-size: 1.5rem;
  color: #f2ac5f;
  border-bottom: 1px solid #e4e4e4;
  display: flex;
  align-items: flex-end;
  gap: 4px;
}
.doughnut-center-text span:last-child{
  color: #57dba5;
  border-bottom: none;
}
.doughnut-center-text span span{
  font-size: 0.65rem !important;
  color: var(--bs-body-color) !important;
  padding-bottom: 6px;
}
.doughnut-center-text span.green-dark{
  color: #00b360;
}
.doughnut-center-text span.blue{
  color: #1d74b9;
}
canvas.doughnut-chart{
  background: url('../images/doughnut_chart_bg.png') no-repeat center center;
  background-size: contain;
  background-position: center;
}
.due-task-table thead tr.nk-tb-item th.nk-tb-col{
  background-color: #ef8c21 !important;
  color: #FFF;
  font-size: 1.1em;
  letter-spacing: 0.04em;
}
.due-task-table tbody tr.nk-tb-item td.nk-tb-col{
  background-color: #ffe6cb !important;
  letter-spacing: 0.04em;
  color: #000;
  font-size: 1.2em;
  padding-top: 6px;
  padding-bottom: 5px;
}
.completed-task-table thead tr.nk-tb-item th.nk-tb-col{
  background-color: #1d74b9 !important;
  color: #FFF;
  font-size: 1.1em;
  letter-spacing: 0.04em;
}
.completed-task-table tbody tr.nk-tb-item td.nk-tb-col{
  background-color: #c5e5ff !important;
  letter-spacing: 0.04em;
  color: #000;
  font-size: 1.2em;
  padding-top: 6px;
  padding-bottom: 5px;
}

/* Report Download CSS */
.report-download-header{
  display: none;
  margin: 1rem 0 1rem 0;
}
.report-download-header p{
  margin: 1rem 0 0 0;
  font-size: 1rem;
  line-height: 1.5;
  color: #333;
}
.report-download-header-logo{
  display: flex;
  align-items: center;
  gap: 20px;
}
.report-download-header-logo h1{
  font-size: 1.75rem;
  font-weight: bold;
  color: #002060;
}
.report-download-header-logo img{
  width: 186px;
}
.report-download-table{
  background-color: #FFF;
  border: 1px solid #999;
}
.report-download-table thead tr th{
  border-right: 1px solid #999;
  border-bottom: 1px solid #999 !important;
  color: #000 !important;
  font-size: 0.875rem !important;
}
.report-download-table thead tr th.bg-light-blue{
  background-color: #c0e6f5;
}
.report-download-table thead tr th.bg-light-red{
  background-color: #fbe2d5;
}
.report-download-table tbody tr td{
  border-right: 1px solid #999;
  border-bottom: 1px solid #999 !important;
  color: #000;
  padding: 0.5rem 0.5rem;
  font-size: 0.875rem;
}
.report-download-table tbody tr:last-child td{
  background-color: #FFC000;
}
.report-sample-size-text {
  padding-top: 20px;
  text-align: right;
  display: none;
  color: #000;
  font-size: 10px;
}
.text-right{
  text-align: right;
}
.nav-tabs .nav-link.active {
  color: var(--primary-color);
}
.nav-tabs .nav-link:after {
  background-color: var(--primary-color);
}
/* Tasks History Print CSS */
@media print {
  @page { size: landscape; }
  body{
    padding: 0 !important;
    margin: 0 !important;
    -webkit-print-color-adjust: exact;
  }
  .nk-sidebar,
  .nk-header {
    display: none !important;
  }
  .nk-header-fixed + .nk-content{
    padding: 0 !important;
    margin: 0 !important;
  }
  .nk-content {
    padding: 0;
    margin: 0;
  }
  .nk-content .nk-block-head {
    display: none !important;
  }
  .timeline-wrapper {
    max-height: inherit;
  }
  .card{
    border: 1px solid #dbdfea;
  }
  .user-card .user-avatar{
    display: inline-block !important;
    text-align: center;
    line-height: 39px;
  }
  .user-card .user-info .tb-lead .dot{
    display: none;
  }
  .row .col-md-6{
    float: left !important;
    width: 50% !important;
  }

  /* Report Download Print CSS */
  .report-download-header{
    display: block;
  }
  .report-download-table{
    margin-top: 20px;
    border: 1px solid #999 !important;
  }
  .report-download-table thead tr th{
    border-right: 1px solid #999 !important;
    border-bottom: 1px solid #999 !important;
  }
  .report-download-table tbody tr td{
    border-right: 1px solid #999 !important;
    border-bottom: 1px solid #999 !important;
  }
  .report-sample-size-text {
    display: block;
  }
  .card-inner {
    padding: 1.5rem;
  }
  .nk-ecwg .data-group {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  h6, .h6 {
    font-size: 1.05rem;
  }
  .row {
    --bs-gutter-x: 28px;
    --bs-gutter-y: 0;
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(-1* var(--bs-gutter-y));
    margin-right: calc(-0.5* var(--bs-gutter-x));
    margin-left: calc(-0.5* var(--bs-gutter-x));
  }
  .col-lg-3 {
    flex: 0 0 auto;
    width: 33.33%;
  }
  .col-lg-5 {
    flex: 0 0 auto;
    width: 41.66666667%;
  }
}