.btn-primary {
  --bs-btn-bg: #46bda6;
  --bs-btn-border-color: #46bda6;
  --bs-btn-hover-bg: rgb(190, 232, 224);
  --bs-btn-hover-border-color: rgb(190, 232, 224);
} 

.btn-warning {
  --bs-btn-bg: rgb(234, 179, 8);
  --bs-btn-border-color: rgb(234, 179, 8);
  --bs-btn-hover-bg: rgb(213, 162, 8);
  --bs-btn-hover-border-color: rgb(213, 162, 8);
  
}

.btn-danger {
  --bs-btn-bg: rgb(213, 94, 12);
  --bs-btn-border-color: rgb(213, 94, 12);
  --bs-btn-hover-bg: rgb(185, 82, 10);
  --bs-btn-hover-border-color: rgb(185, 82, 10);
  font-size: 14px;
}

body {
  font-family: 'Urbanist', sans-serif;
}

.table-danger {
  border-color: #dc3545;
}

.loader-wrapper {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.8);
  z-index: 1050; 
  justify-content: center;
  align-items: center;
}

::placeholder {
  color: #343a40;
  opacity: 1; 
}

::-ms-input-placeholder {
  color: #343a40;
}

.offset-ph-input {
  text-align: left;
  text-indent: 47%;
}

/* Tailwind-style width utilities */
.w-4 {
  width: 1rem !important;
} /* 16px  */
.w-8 {
  width: 2rem !important;
} /* 32px  */
.w-12 {
  width: 3rem !important;
} /* 48px  */
.w-16 {
  width: 4rem !important;
} /* 64px  */
.w-20 {
  width: 5rem !important;
} /* 80px  */
.w-24 {
  width: 6rem !important;
} /* 96px  */
.w-32 {
  width: 8rem !important;
} /* 128px */
.w-40 {
  width: 10rem !important;
} /* 160px */
.w-48 {
  width: 12rem !important;
} /* 192px */
.w-64 {
  width: 16rem !important;
} /* 256px */

.max-w-4 {
  max-width: 1rem !important;
}
.max-w-8 {
  max-width: 2rem !important;
}
.max-w-12 {
  max-width: 3rem !important;
}
.max-w-16 {
  max-width: 4rem !important;
}
.max-w-20 {
  max-width: 5rem !important;
}
.max-w-24 {
  max-width: 6rem !important;
}
.max-w-32 {
  max-width: 8rem !important;
}
.max-w-40 {
  max-width: 10rem !important;
}
.max-w-48 {
  max-width: 12rem !important;
}
.max-w-64 {
  max-width: 16rem !important;
}

/* Tabulator overrides*/
.tabulator .tabulator-header .tabulator-col {
  font-size: 0.875rem;
}

.tabulator .tabulator-cell {
  font-size: 0.875rem;
}

.tabulator .tabulator-footer {
  font-size: 0.875rem;
}

.tabulator {
  font-size: 0.875rem;
}

.tabulator .tabulator-col {
  padding: 0.25rem 0.5rem !important;
}

.tabulator .tabulator-cell {
  padding: 0.25rem 0.5rem !important;
}

.tabulator .tabulator-page {
  margin: 0 2px !important;
  padding: 2px 6px !important;
  min-width: 28px;
  color: #212529 !important;

}

.tabulator .tabulator-page.active {
  background-color: #46bda6 !important;
  color: #ffffff !important;
  border-color: #46bda6 !important;
}

.container-xxl {
  max-width: 1600px !important;
}