:root {
  --primary-color: #444497;
}
* {
  box-sizing: border-box;
}
body {
  background-color:#F3F5FF;
  overflow: hidden;
}
img {
  max-width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 5px;
}
::-webkit-scrollbar {
  background: rgba(152, 166, 173, .1);
  position: absolute;
  width: 7px;
  right: 8px;
  top: 8px;
  bottom: 8px;
  opacity: .01;
  border-radius: 5px;
  transition: .3s;
}
.table-responsive::-webkit-scrollbar {
  height: 7px;
}
::-webkit-scrollbar-thumb {
  background: #DCDCFE;
  position: relative;
  border-radius: 3px;
  transition: .3s;
  transition-property: background;
}
::-webkit-scrollbar-thumb:hover {
  background: #444497;
}
.left-side-menu::-webkit-scrollbar-thumb,.left-side-menu::-webkit-scrollbar,.left-side-menu ::-webkit-scrollbar-thumb:hover {
  display: none;
}

.table-responsive .row .col-sm-12 {
  overflow-x: auto;
}
.table-responsive .row .col-sm-12::-webkit-scrollbar {
  height: 7px;
}

h4 {
  /* font-size: 20px; */
  font-size: 1.32vw;
  font-weight: 600;
  margin-top: 0px;
  margin-bottom: 17px;
  /* line-height: 28px; */
}
h5 {
  /* font-size: 15px; */
  font-size: 1vw;
  font-weight: 600;
  margin-top: 0px;
  /* line-height: 21px; */
}
h6  {
  /* font-size: 14px; */
  font-size: 0.92vw;
  font-weight: 400;
  margin-top: 0px;
  /* line-height: 19.6px; */
}

.form-check-input:checked {
  background-color: #444497;
  border-color: #444497;
}
.custom-control-input:checked {
  background-color: green; /* Change the color of the toggle when it is checked */
  border-color: green; /* Change the border color of the toggle when it is checked */
}
.nav-second-level li {
  position: relative;
  color: #fff;
  list-style-type:disc;
}
.nav-second-level li:hover {
  color: #ffcd6b;
}
/* .nav-second-level li::before {
  content: url("../images/icons-logo/list.svg");
  position: absolute;
  color: #fff;
  top: 50%;
  transform: translateY(-65%);
} */

/* btn */
.btn-create {
  background-color: #DDDDFF;
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
  border-radius: 5px;
  /* font-size: 13px; */
  font-size: 0.85vw;
  font-weight: 600;
  padding: 0.2rem 1rem;
  /* padding: 0.3rem 0.5rem; */
  /* padding: 0.4rem 1rem; */
}
.btn-create:hover {
  background-color: var(--primary-color);
  color: #DDDDFF;
}
.btn-deactivate {
  background-color: #FFEFEF;
  color: #EC0000;
  border: 1px solid #EC0000;
  border-radius: 5px;
  font-weight: 600;
  font-size: 0.9vw;
  /* padding: 0.3rem 0.5rem; */
  padding: 0.4rem 1rem;
}
.btn-deactivate:hover {
  background-color: #EC0000;
  color: #FFEFEF;
}
.btn-delete {
  background-color: #FFEFEF;
    color: #EC0000;
    border: 1px solid #EC0000;
    border-radius: 5px;
    font-weight: 600;
    font-size: 0.9vw;
    padding: 0.1rem 0.7rem;
}
.btn-delete:hover {
  background-color: #EC0000;
  color: #FFEFEF;
}
.btn-mail {
  background-color: #FFF5E2;
  /* font-size: 17px; */
  color: #FFB800;
  padding: 0.3rem 0.6rem;
  border-radius: 5px;
}
.btn-mail:hover {
  color: #FFB800;
}
.btn-printer {
  background-color: #DDDDFF;
  color: #444497;
  padding: 0.3rem 0.5rem;
  border-radius: 5px;
}
.btn-back {
  background-color: #DDDDFF;
  color: var(--primary-color);
  padding: 0px 7px;
  border-radius: 5px;
  margin-right: 10px;
  font-weight: 700;
  /* padding: 0.4rem 1.5rem; */
}
.btn-back:hover {
  color: var(--primary-color);
}
.btn-submit {
  background-color: #444497;
  color: #fff;
  border-radius: 5px;
  /* font-size: 12.66px; */
  font-size: .85vw;
  font-weight: 500;
  margin-right: 10px;
  padding: 6px 36px;
}
.btn-submit:hover {
  color: #fff;
}
.btn-cancel {
  background-color: #fff;
  color: #444497;
  border: 1px solid #444497;
  border-radius: 5px;
  /* font-size: 12.66px; */
  font-size: .85vw;
  font-weight: 700;
  padding: 6px 36px;
}
.btn-cancel:hover {
  color: #444497;
}
.btn-create i {
  margin-right: 5px;
  padding: 0px !important;
}

.btn-clear {
  background-color: #FFE2E2;
  /* font-size: 12px; */
  font-size: 0.9vw;
  border: 1px solid #F80000;
  border-radius: 5px;
  padding: 0.2rem 1rem;
}
.btn-clear i {
  color: #F80000;
  margin-right: 5px;
  padding: 0px !important;
}
.btn-clear:hover{
  color: #F80000;
}
.btn-filter{
  background-color: #DBF3FF;
  /* font-size: 12px; */
  font-size: 0.9vw;
  border: 1px solid #00AAFF;
  border-radius: 5px;
  padding: 0.2rem 1rem;
}
.btn-filter i {
  color: #00AAFF;
  margin-right: 5px;
  padding: 0px !important;
}
.btn-filter:hover{
  color: #00AAFF;
}

.btn-eye {
  background-color: #F3F2F7;
  color: #444497;
  padding: 0px 4px;
  /* padding: 2px 7px; */
  border-right: 10px;
}
.btn-eye:hover{
  color: #444497;
}
.btn-pencil {
  background-color: #CBE9FF;
  color: #46B0FF;
  padding: 0px 3px;
  /* padding: 2px 7px; */
  border-right: 10px;
}
.btn-pencil:hover{
  color: #00AAFF;
}
.btn-trash-can {
  background-color: #FF5B5B38;
  color: #EC0000;
  padding: 0px 4px;
  /* padding: 2px 7px; */
  border-right: 10px;
}
.btn-trash-can:hover{
  color: #EC0000;
}

.btn-action-renew {
  background: #E7F5FF;
  color: #0085E8;
  /* font-size: 12px; */
  font-size: .8vw;
  font-weight: 600;
  padding: .2rem .5rem;
  border-radius: 5px;
  border: 1px solid #48B1FF;
  margin: 5px 0px;
  margin-right: 10px;
}
.btn-action-renew:hover {
  color: #0085E8;
}
.btn-action-dactivate {
  background: #FFEFEF;
  color: #EC0000;
  /* font-size: 12px; */
  font-size: .8vw;
  font-weight: 600;
  padding: .2rem .5rem;
  border-radius: 5px;
  border: 1px solid #FF4343;
}
.btn-action-dactivate:hover {
  color: #EC0000;
}
.btn-action-log {
  background: #FFEEDF;
  color: #FF7A00;
  /* font-size: 12px; */
  font-size: .8vw;
  font-weight: 600;
  padding: .2rem 1rem;
  border-radius: 5px;
  border: 1px solid #FF9D42;
}
.btn-action-log:hover {
  color: #FF7A00;
}
.btn-action-activate {
  background: #E5FFF3;
  color: #009652;
  /* font-size: 12px; */
  font-size: .8vw;
  font-weight: 600;
  padding: .2rem .5rem;
  border-radius: 5px;
  border: 1px solid #33B97C;
}
.btn-action-activate:hover {
  color: #009652;
}

/* btn */

#nav-not_expired-tab {
  color: #009652;
  background-color: #D3FFEB;
}
#nav-not_expired-tab::before {
  background-color: #009652 !important;
}

#nav-expiring_soon-tab{
  color: #F36600;
  background-color: #FFEBDC;
}
#nav-expiring_soon-tab::before {
  background-color: #F36600 !important;
}

#nav-disputed-tab{
  color: #474747;
  background-color: #E7E7E7;
}
#nav-disputed-tab::before {
  background-color: #474747 !important;
}

#nav-expired-tab{
  color: #EC0000;
  background-color: #FFD9D9;
}
#nav-expired-tab::before {
  background-color: #EC0000 !important;
}

#nav-decommissioned-tab{
  color: #E49700;
  background-color: #FFE9BF;
}
#nav-decommissioned-tab::before {
  background-color: #E49700 !important;
}
#nav-pending-tab {
  color: #F36600;
  background-color: #FFEBDC;
}
#nav-pending-tab::before {
  background-color: #F36600 !important;
}
#nav-resolved-tab {
  color: #009652;
  background-color: #D3FFEB;
}
#nav-resolved-tab::before {
  background-color: #009652 !important;
}

.btn-group-sm>.btn, .btn-sm {
padding: 0rem 0rem !important;
/* font-size: unset; */
height: 25px;
width: 25px;
}
.input-box-pass {
  position: relative;
}
.pass-show{
  position: absolute;
  top: 50%;
  right: 10px;
  font-size: 16px;
  transform: translateY(-50%);
  cursor: pointer;
}

.table>:not(caption)>*>th {
  padding: 8px 20px;
  /* font-size: 14px; */
  font-size: 0.92vw;
  font-weight: 600;
  color: #464255;
  background-color: #EAEAEA;
  border-bottom-width: 1px;
  border-color: #D7D7D7;
  box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg);
  /* white-space: nowrap; */
  vertical-align: middle;
}
.table>:not(caption)>*>th:first-child {
  padding: 8px;
  width: fit-content !important;
  white-space: nowrap;
}
.table>:not(caption)>*>td {
  /* padding: 8px 20px; */
  padding: 5px 10px;
  background-color: var(--ct-table-bg);
  border-bottom-width: 1px;
  /* font-size: 13px; */
  font-size: 0.86vw;
  font-weight: 400;
  color: #464255;
  box-shadow: inset 0 0 0 9999px var(--ct-table-accent-bg);
  /* white-space: nowrap; */
  border-color: #D7D7D7;
  vertical-align: middle;
  }
.table_action {
  text-align: center;
  padding: 0px !important;
  white-space: nowrap;
}
.table_action a:nth-child(2) {
  margin-left: 5px;
}
.table_action a:nth-child(3) {
  margin-left: 5px;
}
#responsive-datatable, #datatable , .table
{
font-size: 12px;
}
.add-btn
{
padding:0.3rem 0.8rem 0.3rem 0.3rem  !important;
  font-size: .8rem;
}
.active-status {
  padding: 0.5rem 1.5rem;
  background-color: #E5FFF3;
  border-radius: 5px;
  width: fit-content;
}
.active-status h5 {
  color: #009652;
  margin: 0px;
  width: fit-content;
}
.btn-label {
margin: -0.55rem 0.9rem -0.55rem -0.9rem;
padding: 0.6rem 0.9rem;
background-color: rgba(50,58,70,.1);
}
/* .fa-plus, .fa-long-arrow-alt-left , .fa-info-circle{
padding-left: 10px !important;
} */
.fas{
padding-left: 10px !important;
}
.department-card{
  min-height: calc(100vh - 190px);
}
#sidebar-menu>ul>li>a {
  display: flex !important;
  align-items: center;
}
#sidebar-menu>ul>li>a>svg, #sidebar-menu>ul>li>a>i {
  margin-right: 10px;
  min-width: 14px;
}
.btn-success , .btn-danger , .btn-primary, .btn-secondary, .btn-warning
{
padding:3px 8px;
}
.btn-warning {
  color: #fff;
  background-color: #f9c851;
  border-color: #f9c851;
}
.btn-warning:hover {
  color: #fff;
  background-color: #f5ba30;
  border-color: #ddad3d;
}
.btn-outline-warning:hover {
  color: #fff;
  background-color: #f5ba30;
  border-color: #ddad3d;
}

/* tbody tr td:first-child
{
text-align: center;
} */
.tabledit-view-button, .tabledit-edit-button, .tabledit-delete-button {
height: 25px;
width: 25px;
padding: 2px 5px;
}
label span{
font-weight: 100;
}
td input[type="text"] {
width: 100%;
}
.add-stock tbody tr td
{
padding-bottom: 10px;
}
.add-new-btn
{
margin-top: 25px;
}
.plus-btn , .close-btn
{
padding:0px 5px;

}
.plus-btn i, .close-btn i
{
font-size: 20px;
}
.inbox-widget
{
border-radius: 5px;
  padding: inherit;
  margin: 17px 0px;
  background: #71b6f926;
}
.left-side-view
{
background: aliceblue;
border-radius: 5px;
padding: 9px 15px;
font-size: 12px;
}
.inbox-widget .inbox-item .inbox-item-img img {
width: 50px;
}
.inbox-widget .inbox-item .inbox-item-author {
display: block;
margin-bottom: 3px;
padding-top: 6px;
}
.inbox-widget .inbox-item .inbox-item-img {
display: block;
float: left;
margin-right: 15px;
width: unset;
}
.card-header {
padding: 0.8rem 1rem;
}
.status-cards .card-body
{
/* background: #ffe4c466; */
  border-radius: 5px;
  padding: 10px 15px;
  font-size: 12px;
}
.status-cards .card-body p{
margin-bottom: 0;
}
td
{
vertical-align: baseline;
}
.inbox-widget .inbox-item {
border-bottom: 1px solid rgba(222,226,230,.5);
overflow: hidden;
padding: 0rem 0;
position: relative;
}
.vendor-view-top-card , .vendor-view-bottom-card{
background: beige;
padding: 15px;
border-radius: 5px;
}
.vendor-view-bottom-card{
background: #bbc7dd45;
}
.view-vendor-document
{
padding: 15px;
}
.dropify-wrapper .dropify-message span.file-icon {
font-size: 18px !important;
color: #CCC !important;
}
.form-check {
  min-height: unset;
  margin-bottom: 0.125rem;
}
.form-check  input{
  cursor: pointer;
}
.pagination {
  display: flex;
justify-content: end;
}
.dataTables_length .form-label{
  display: flex;
  align-items: center;
  gap: 5px;
}
.dataTables_filter label{
  display: flex;
    align-items: center;
    justify-content: flex-end;
}
.dataTables_length .form-label select{
width: auto;
}
.dataTables_wrapper .dataTables_filter input {
  width: auto;
}
table tbody tr td:nth-child(1) {
  /* text-align: center; */
}
.item-code-select
{
  width: auto;
}
.pending-requisition-table , .rejected-requisition-table , .completed-requisition-table
{
  background: white;
  padding: 10px;
  border-radius: 5px;
  margin: 0;
}
.attendance-table .status{
  /* color: #10c469!important; */
  padding: 3px 8px;
  background: #4980801f;
  border-radius: 5px;
}
.attendance-card .attendance-note
{
margin: 9px 0;
}
.support-ticket-card span
{
  font-size: 12px;
}
.form-check.form-switch
{
  display: flex;
  justify-content: center;
}
.content
{
  padding-top: 15px;
}
#cims_data_table_wrapper .col-sm-12 {
  overflow-x:overlay;
  margin-bottom: 15px;
}
.form-control, .form-select{
  /* font-size: 0.8125rem; */
  font-size: 0.85vw;
}
.card-body {
  flex: 1 1 auto;
  /* padding: 1.5rem 1rem; */
  padding: 1rem;
  background-color: var(--ct-card-bg);
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
  border-radius: 5px;
}
.header-title {
  color: var(--primary-color);
  /* font-size: 18px;
  line-height: 21.6px; */
  font-size: 1.19vw;
  margin-bottom: 0rem !important;
}
.dataTables_info {
font-size: 0.75rem;
}
.dashboard-cards i
{
  font-size: 60px;
  color: #10c469;
}
.dashboard-cards .card-body
{
  transition: 0.3s ease-in;
}
.dashboard-cards .card-body:hover
{
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px !important;
}
.filter-card
{
  min-height: auto;
}
.filter-card .row
{
  align-items: center ;
}
.filter-card-main
{
  margin-bottom:0.5rem ;
}
.export-btn
{
  background: #0e8d4d;
}
.status-cards .support-ticket-card
{
  /* background: #ffe4c466; */
}
.card , .vendor-view-bottom-card
{
  font-size: 12px;
  /* border-top: 3px solid #79b9f73d; */
  border-radius: 0.5rem;
}
.fas.fa-filter
{
  padding-left: 0 !important;
}
.i-button .fas{
  cursor: pointer;
padding-left: 0px !important;
}
#sidebar-menu .menuitem-active > a {
  position: relative;
  color: #fff;
  border: 1px solid #FFFFFF;
  /* border-image: linear-gradient(269.8deg, #FFFFFF 0.15%, rgba(255, 255, 255, 0.28) 48.09%) 10; */
  background: linear-gradient(256.12deg, rgba(255, 255, 255, 0.0336) 0%, rgba(255, 255, 255, 0.3192) 80.18%);
  border-radius: 5px;
}

#sidebar-menu .menuitem-active a::before {
  content: "";
  position: absolute;
  top: 0px;
  left: -17px;
  height: 100%;
  width: 3px;
  background-color: #fff;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
  z-index: 1000;
}
#sidebar-menu .menuitem-active .nav-second-level a::before {
  content: none;
}
#sidebar-menu .nav-second-level .menuitem-active {
  color: #FFCD6B;
  border: none;
  background: transparent;
}
#sidebar-menu .nav-second-level .menuitem-active li::before{
  color: #FFCD6B;
}

/* table.dataTable>thead>tr>th:not(.sorting_disabled), table.dataTable>thead>tr>td:not(.sorting_disabled) {
  padding-right: 4px;
  padding-left: 6px;
} */
.chart-detail-list .list-inline-item i
{
  font-size: 10px;
}
.morris-chart tspan {
  font-size: 7px !important;
}
.morris-donut-example svg text tspan
{
  font-size: 10px !important;
}
.status-cards .badge
{
  font-size: 12px;
}
.status-cards .status-card-footer .btn-primary,.status-cards .status-card-footer .btn-danger{
  padding: 2px 8px;
}
.status-cards .badge .fas
{
  padding-left: 0px !important;
}
.status-cards .card-body .status-card-top {
  position: absolute;
  right: 10px;
  top: 10px;
}
.status-cards table td .fw-semi-bold{
  width: 80%;
}
.table-bordered tbody td:first-child
{
text-align: center;
}
.status-cards .dataTables_wrapper{
  background: #79baf91f;
  padding: 10px;
  border-radius: 6px;
  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important
}
.form-label {
  margin-bottom: 0.5rem;
  font-weight: 600;
  /* font-size: 14px; */
  font-size: 0.92vw;
  line-height: 19.6px;
  color: #2D3748;
}
.form-control {
  /* padding: 0.25rem 0.5rem; */
  padding: 0.4rem 0.5rem;
}
.form-select {
  /* padding: 0.25rem 2.7rem 0.25rem 0.9rem; */
  padding: 0.4rem 2.7rem 0.4rem 0.9rem;
  /* color: #212529; */
}
.footer {
  display: none;
  padding: 10px 10px 10px;
}
/* .content-page {
  padding: 0 12px 30px 12px;
} */
input[type="time" i]
{
  cursor: pointer !important;
}
input i
{
  cursor: pointer;
}
.dropify-wrapper {
  height: 170px !important;
}
.no-pad-right
{
  padding-right: 0;
}
.add-ticket-image-upload
{
  margin: 0 auto;
}
.gal-detail a img
{
  width: 100%;
  height: 200px;
}
.status-cards
{
  margin-bottom: 0.5rem;
}

.form-option {
  padding: 20px;
}


/*  */
.nav-tabs .nav-link {
  position: relative;
  padding: 6px 30px;
  margin: 0px;
  margin-right: 8px;
  border-radius: 10px 10px 0px 0px !important;
  /* font-size: 13px; */
  font-size: 0.86vw;
  font-weight: 500;
  /* line-height: 17.77px; */
}
.nav-tabs .nav-link.active {
  background-color: #fff !important;
  border: 0px;
}
.nav-tabs .nav-link.active::before{
  content: "";
  position: absolute;
  top: 50%;
  left: 0px;
  width: 3px;
  height: 20px;
  background: inherit;
  margin-top: 0px;
  transform: translateY(-50%);
}
/*  */