/* theme colors */
*,
*::after,
*::before {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
:root {
  --text-dark: #2c2d34;
  --text-normal: #474952;
  --text-light: #616771;

  --text-header: #222326;
  --text-title: #293146;
  --text-sub-title: #4d5770;
  --text-span: #4a4e5a;
  --text-placeholder: #808595;
  --text-link-normal: #222326;

  --primary-code: 0, 71, 112;
  --primary: rgb(var(--primary-code));
  --tr-hover: #2541b214;
  --tr-hover: #f2f4f8;

  --txt-primary: #1f1f1f;
  --txt-secondary: #212121;
  --txt-tertiary: #424242;
  --txt-light: #626262;

  --surface-color: rgba(var(--primary-code), 0.05);
  --container-color: rgba(var(--primary-code), 0.2);
  --on-container-color: hsla(202, 100%, 12%, 1);
  --table-header-color: #eceff2;

 /* green */
  --amt-green: #007500;
  --amt-green: #12b76a;
  --amt-green: #027a48;
  --amt-red: #b42318;
  --amt-blue: #3538cd;

  --border-light: #e2e5e9;
  --body-color: rgb(241, 242, 244);
  --on-body-color: rgb(255, 255, 255);
}

*::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
*::-webkit-scrollbar-track {
  opacity: 0;
  background: transparent;
}
*::-webkit-scrollbar-thumb {
  width: 5px;
  background-color: var(--primary);
  background-color: #a3a3a3;
  border-radius: 6px;
}
*::-webkit-scrollbar-thumb:hover {
  background-color: #808595;
  background-color: #2541b2;
  /* cursor: all-scroll; */
}
*:disabled {
  cursor: not-allowed !important;
}
.rounded_0 {
  border-radius: 0 !important;
}

.form-group.is-focused .form-control {
  background-image: linear-gradient(var(--primary), var(--primary)),
    linear-gradient(#d2d2d2, #d2d2d2);
}

.blur_out {
  opacity: 0.4;
  pointer-events: none;
}
.modal .modal-header {
  background-color: var(--primary) !important;
}

.custom_table_cont {
  height: 100%;
  overflow: auto;
  padding-bottom: 2rem;
}

.cursor_pointer {
  cursor: pointer;
}

.hover_underline:hover {
  text-decoration-line: underline;
}

/* utility classes */

@keyframes slideUp {
  0% {
    bottom: -120px;
    opacity: 0;
  }

  100% {
    opacity: 1;
    bottom: 0;
  }
}

.modal {
  margin-top: 3rem;
}

.img_thumbnail {
  border-radius: 50%;
  width: 100px;
  height: 100%;
  aspect-ratio: 1/1;
}
.photo_cont {
  position: relative;
}
.photo_edit_btn {
  position: absolute;
  bottom: 0px;
  right: 0px;
  background: #263e9d;
  color: #fff;
  border-radius: 50%;
  width: 25px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 0px 0px 2px #fff;
  margin: 0;
  padding: 0;
}
/* .inline_edit_cont:hover .inline_edit_btn{
  display: inline-block;
} */
.edit_btn {
  background: #263e9d;
  color: #fff;
  width: 25px;
  height: 25px;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 0px 0px 2px #fff;
  margin: 0;
  padding: 0;
}

.edit_btn:hover {
  background: #fff !important;
}

input {
  background-color: #fff;
  color: #000;
}

.error {
  color: #cd1212 !important;
  font-size: 13px;
}

select option[value=""][disabled] {
  display: none;
  color: var(--text-placeholder);
}
.input_field_info {
  color: var(--txt-light);
  font-size: small;
}
.input_field_info.text-danger {
  color: #f44336;
}
.rotate_180 {
  transform: rotateZ(180deg);
}

.order_1 {
  order: 1;
}
.order_2 {
  order: 2;
}
.order_3 {
  order: 3;
}
.order_4 {
  order: 4;
}
.order_5 {
  order: 5;
}
.order_6 {
  order: 6;
}
.order_7 {
  order: 7;
}
.order_8 {
  order: 8;
}
.order_9 {
  order: 9;
}

.d_inline {
  display: inline-block;
}
.d_flex {
  display: flex;
}
.flex_wrap {
  flex-wrap: wrap;
}
.flex_column {
  flex-direction: column;
}
.flex_1 {
  flex: 1;
}
.justify_start {
  justify-content: flex-start;
}
.justify_end {
  justify-content: flex-end;
}
.justify_center {
  justify-content: center;
}
.justify_space_between {
  justify-content: space-between;
}
.justify_space_around {
  justify-content: space-around;
}
.justify_space_evenly {
  justify-content: space-evenly;
}
.align_start {
  align-items: flex-start;
}
.align_end {
  align-items: flex-end;
}
.align_center {
  align-items: center;
}
.align_stretch {
  align-items: stretch;
}
.h_0 {
  height: 0;
}
.h_100 {
  height: 100%;
}

.m_0 {
  margin: 0;
  margin-right: 0;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 0;
}
.p_0 {
  padding: 0;
  padding-right: 0;
  padding-left: 0;
  padding-top: 0;
  padding-bottom: 0;
}
.p_02 {
  padding: 2px;
}
.p_03 {
  padding: 3px;
}
.p_04 {
  padding: 4px;
}
.p_05 {
  padding: 5px;
}
.p_05 {
  padding: 5px;
}
.p_1 {
  padding: 1rem;
}
.p_2 {
  padding: 2rem;
}
.p_3 {
  padding: 3rem;
}
.pt_1 {
  padding-top: 1rem;
}
.pt_2 {
  padding-top: 2rem;
}
.pt_3 {
  padding-top: 3rem;
}
.pt_4 {
  padding-top: 4rem;
}
.pb_0 {
  padding-bottom: 0;
}
.pb_1 {
  padding-bottom: 1rem;
}
.pb_2 {
  padding-bottom: 2rem;
}
.pb_3 {
  padding-bottom: 3rem;
}
.pb_4 {
  padding-bottom: 4rem;
}
.pl_0 {
  padding-left: 0;
}
.pl_1 {
  padding-left: 1rem;
}
.pl_2 {
  padding-left: 2rem;
}
.pl_3 {
  padding-left: 3rem;
}
.pl_4 {
  padding-left: 4rem;
}

.pr_0 {
  padding-right: 0;
}
.pr_1 {
  padding-right: 1rem;
}
.pr_2 {
  padding-right: 2rem;
}

.pr_3 {
  padding-right: 3rem;
}
.pr_4 {
  padding-right: 4rem;
}
.mt_0{
  margin-top: 0;
}
.mt_1 {
  margin-top: 1rem;
}
.mt_2 {
  margin-top: 2rem;
}
.mt_3{
  margin-top: 3rem;
}
.mt_4{
  margin-top: 4rem;
}
.mb_1 {
  margin-bottom: 1rem;
}
.mb_2 {
  margin-bottom: 2rem;
}
.mb_3 {
  margin-bottom: 3rem;
}
.ml_05 {
  margin-left: 5px;
}
.ml_1 {
  margin-left: 1rem;
}
.ml_2 {
  margin-left: 2rem;
}
.ml_3 {
  margin-left: 3rem;
}
.ml_4 {
  margin-left: 4rem;
}
.mr_1 {
  margin-right: 1rem;
}
.mr_2 {
  margin-right: 2rem;
}
.mr_3 {
  margin-right: 3rem;
}
.mr_4 {
  margin-right: 4rem;
}
.font_300 {
  font-weight: 300;
}
.font_600 {
  font-weight: 600;
}
.font_700 {
  font-weight: 700;
}
.sm_text {
  font-size: 13px;
}
.border_lite {
  border: 1px solid #ddd;
}
.p_relative {
  position: relative;
}
.p_absolute {
  position: absolute;
}
.top_0 {
  top: 0;
}
.left_0 {
  left: 0;
}
.right_0 {
  right: 0;
}
.bottom_0 {
  bottom: 0;
}
.form_close_btn {
  position: absolute;
  top: 0;
  right: 0;
  padding: 8px;
  font-size: 16px;
}
/* .custom_view .error {
  position: absolute;
  background: #fff;
  margin-top: 2px;
  display: none;
} */

body {
  min-height: 100vh;
  background-color: #ffffff;
  background-color: #e8e9ef;
  background-color: #eaebef;
}

#footer-divider {
  /* height: 50px; */
  width: 100%;
  background-color: transparent;
}

#footer {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: -1;
}
#footer footer {
  color: var(--text-dark);
  background: #edf1ff;
}

*::selection {
  background: rgba(17, 113, 230, 0.7) !important;
  color: #ffffff;
}
a {
  color: var(--primary);
}
a:hover,
a:focus {
  color: var(--primary);
  cursor: pointer;
}
.text_lg {
  padding: 0;
  font-size: 18px;
  font-weight: 500;
  color: #293146;
  padding-left: 1rem;
  margin-bottom: 5px;
}

.text_dark {
  color: var(--text-dark);
}
.text_normal {
  color: var(--text-normal);
}

.sub_header {
  color: #444;
  font-size: 18px;
  color: var(--primary);
}

.topHeader {
  background-color: var(--primary);
  height: auto;
  z-index: 100;
}

.topHeader .title-name img {
  width: 40px;
  height: 26px;
  margin-top: -19px;
}

.topHeader .title-name .title-hero {
  font-size: 24px;
}

#navbar-main {
  color: #616771;
  border-bottom: 1px solid #e6e6e6;
  box-shadow: none;
}
/* .navbar .navbar-nav li.active {
  color: var(--primary);
  background-color: #dae1ff;
} */

.active_sub_nav {
  border-radius: 5px !important;
  // background: #b7cfff !important;
}
.active_sub_nav > a {
  // color: var(--text-dark) !important;
}

.navbar .navbar-nav li > span.fa {
  font-size: 16px;
}

.mainBody {
  margin-top: 1rem !important;
}

.page .page-info {
  padding: 0px;
  font-size: 18px;
  font-weight: 500;
  color: #293146;
  margin: 0;
}
.btn {
  background: #fff;
  padding: 0.75rem 1.5rem !important;
  outline: none !important;
  border: 1px solid;
  margin-right: 5px;
}
.btn:hover {
  background: var(--primary) !important;
  color: #fff;
  border-color: var(--primary);
}
.btn.active {
  background: var(--primary) !important;
  color: #fff !important;
  outline: none !important;
  padding: 0.75rem 1.5rem !important;
  font-weight: 500;
  border: 1px solid var(--primary);
}
.btn.active:hover {
  // background: #fff !important;
  // color: var(--primary) !important;
  // border-color: var(--primary);
}

/* table */
.dataTable {
  tr:hover {
    background-color: var(--tr-hover) !important;
  }
}
table.dataTable th {
  border: none !important;
  color: #a2a8b1 !important;
  background-color: #ffffff !important;
}
table.dataTable td a {
  color: #474952 !important;
}

table.dataTable td a.active {
  color: #2c2d34 !important;
  color: var(--primary) !important;
}
table.dataTable td a.status-col,
table.dataTable thead th.status-col,
table.dataTable tfoot th.status-col {
  text-align: center;
}
table.dataTable thead th {
  border-bottom: 1px solid #e6e6e6 !important;
  padding: 10px 10px !important;
}
table.dataTable tfoot th {
  border-top: 1px solid #e6e6e6 !important;
  background-color: #fff !important;
  padding: 10px 10px !important;
}
/* table.dataTable thead th.status,
table.dataTable tfoot th.status,
table.dataTable td a.status {
  text-align: center;
} */

table.dataTable td {
  padding: 0.3rem 0rem !important;
}
.w_fit {
  width: fit-content;
  width: -moz-fit-content;
}
.w_full {
  width: 100%;
}

/* side navigation */
.page-sideNav.box {
  /* background: #edf1ff; */
  background: #ffffff;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}
/* .leftSidebar .page-sideNav ul li {
  padding: 0.5rem 1.5rem;
} */
.leftSidebar .page-sideNav ul li a {
  color: #616771;
}
/* .leftSidebar .page-sideNav ul li.active {
  border-radius: 5px;
  background: #b7cfff;
}
.leftSidebar .page-sideNav ul li.active > a {
  color: var(--text-dark);
} */
.leftSidebar .page-sideNav ul li:hover {
  background-color: #dee4ff;
  color: var(--text-dark);
  border: none;
}
.dropdown:hover .dropdown-menu li:hover {
  background-color: #dee4ff;
}
.dropdown:hover .dropdown-menu li:hover > a {
  color: var(--primary);
}

.w_132 {
  display: inline-block;
  width: 132px;
}
.w_100 {
  display: inline-block;
  width: 100px;
  min-width: 100px;
  max-width: 100px;
}
.w_130 {
  display: inline-block;
  width: 130px;
  min-width: 130px;
  max-width: 130px;
}
.first_row,
.second_row {
  display: flex;
  justify-content: stretch;
  align-items: stretch;
}
.left_layout,
.right_layout {
  display: flex;
  flex-direction: column;
  justify-content: start;
  align-items: stretch;
  border: 1px solid #bfc9f2;
  padding: 0;
  margin: 1rem;
  border-radius: 1rem;
}
/* grid table */
.grid_table {
  display: grid;
}
.grid_table_head {
  border-top: 1px solid #ddd;
  border-right: 1px solid #ddd;
}
.grid_table_row {
  border-right: 1px solid #ddd;
}
.grid_table_cells_1 {
  grid-template-columns: repeat(1, 1fr);
}
.grid_table_cells_2 {
  grid-template-columns: repeat(2, 1fr);
}
.grid_table_cells_3 {
  grid-template-columns: repeat(3, 1fr);
}
.grid_table_cells_4 {
  grid-template-columns: repeat(4, 1fr);
}
.grid_table_cells_5 {
  grid-template-columns: repeat(5, 1fr);
}
.grid_table_cells_6 {
  grid-template-columns: repeat(6, 1fr);
}
.grid_table > * {
  padding: 8px 4px;
  border-left: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
}
.grid_table > * {
  display: flex;
  align-items: center;
  justify-content: center;
}
.grid_header_cell {
  text-transform: capitalize;
  font-weight: 700;
}
.grid_body_cell {
  text-transform: capitalize;
}
.grid_table .center {
  justify-content: center;
}
.grid_table .start {
  justify-content: start;
}
.grid_table .end {
  justify-content: end;
}

.border_less_table .grid_table {
  border: none;
  border-bottom: 1px solid #ddd;
}
.border_less_table .grid_body_cell {
  border: none;
}
.border_less_table .grid_header_cell {
  border: none;
}
.border_less_table .grid_table_row {
  border: none;
}
.grid_table_row:hover {
  background-color: var(--tr-hover);
}

/* grid table end */
.grid_head {
  background-color: transparent;
}
.grid_title {
  background-color: transparent;
  color: var(--primary);
  margin: 0;
  padding: 1rem;
  padding-left: 0px;
  padding-top: 1.5rem;
}
.d_grid {
  display: grid;
}
.grid_body {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
}
.grid_group {
  background: #626f8d1c;
  margin: 1rem;
  border-radius: 5px;
  padding-top: 1rem;
  padding-bottom: 1rem;
}
.grid_col_5 {
  grid-template-columns: repeat(5, 1fr);
}
.grid_col_4 {
  grid-template-columns: repeat(4, 1fr);
}
.grid_col_3 {
  grid-template-columns: repeat(3, 1fr);
}
.grid_col_2 {
  grid-template-columns: repeat(2, 1fr);
}
.grid_auto_fill_240 {
  grid-template-columns: repeat(auto-fill, minmax(200px, 240px));
}
.grid_auto_fill_200_1fr {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
}
.grid_auto_fill_150_1fr {
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
}

.col_span_2 {
  grid-column: span 2;
}
.col_span_3 {
  grid-column: span 3;
}
.col_span_4 {
  grid-column: span 4;
}
.col_span_5 {
  grid-column: span 5;
}
.col_span_full {
  grid-column: 1/-1;
}

/* form styles start */
.c_label {
  color: #70757a;
  margin-right: 8px;
  text-transform: capitalize;
}
.c_value {
  color: #2c2d34;
  margin-right: 25px;
  font-weight: 600;
}
.panel-title {
  margin-bottom: 1rem;
  line-height: 30px;
}
.panel-group {
  margin-bottom: 1rem;
}
.viewDetails .panel-title a {
  padding: 0 15px;
  padding-right: 40px;
}

.viewDetails .panel-heading a::before,
.viewDetails .panel-heading a::after {
  top: 0px !important;
}

/* form styles end */

/* forumula editor styles */
.formula-container {
  background-color: #efefef;
  background-color: #f1f1f1;
}

.formula-container .formula-unit,
.formula-container .formula-operator,
.formula-container .formula-item {
  height: 30px !important;
  padding: 5px !important;
  border-radius: 2px;
  text-align: center !important;
  width: max-content !important;
  box-shadow: none !important;
  line-height: 1.5em !important;
  box-shadow: 3px 3px 3px -3px #999, 0px 0px 47px 1px #c9c9c9 !important;
  box-shadow: -2px -2px 3px -4px #000, 0px 0px 7px -4px #000 !important;
}
.formula-container .formula-bracket {
  background-color: #ffffff;
}
.formula-drop-items {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.formula_drop_operators {
  width: 30%;
  height: max-content;
  justify-content: flex-start;
  border-right: 1px solid #bccbe4;
  padding-right: 1rem;
}

.formula-drop-items a.formula-custom.ui-draggable {
  border-radius: 2px !important;
  border: 1px solid;
  padding: 3px;
  margin: 2px;
}

.modal_formula .modal-dialog {
  width: 1000px;
}

/* labels start */
.formAdd fieldset legend,
.formUpdate fieldset legend {
  padding: 0px 10px;
  width: 190px;
  margin-bottom: 20px;
  line-height: inherit;
  color: var(--primary);
  font-size: 15px;
  font-weight: 300;
  margin-left: 4px;
}
.label {
  text-align: center !important;
}
.label.label-inactive,
.label.label-primary,
.label.label-success,
.label.label-warning,
.label.label-danger,
.label.label-default,
.status_label {
  letter-spacing: 1px;
  font-weight: 900;
  font-size: 13px;
  padding: 0.75rem 1.75rem;
  /* width: 100px; */
  display: inline-block;
  width: 100%;
  width: fit-content;
}
.label.w_fit {
  width: fit-content;
  width: -moz-fit-content;
}
.label.label-success,
.status_label.label_success {
  background: #c2ffe8;
  color: #16a085;
}
.label.label-success > i {
  color: #16a085 !important;
}
.label.label-warning,
.status_label.label_pending {
  background: #ffe5d7;
  color: #b26025;
}
.label.label-warning > i {
  color: #b26025 !important;
}
// .label.label-warning {
//   background: #dfdfdf;
//   color: #707070;
// }
.label.label-inactive,
.status_label.label-inactive,
.status_label.label_default {
  background: #dfdfdf;
  color: #707070;
}
// .label.label-warning > i {
//   color: #707070 !important;
// }
.label.label-danger,
.status_label.label_error {
  background: #ffc6c2;
  color: #a01616;
  color: #ff3a2c;
}
.status_label.label_canceled, .status_label.label_cancelled {
  background: #ffc6c2;
  color: #a01616;
  color: #ff3a2c;
}
.label.label-danger > i {
  color: #a01616 !important;
}
.label.label-default,
.label.label-primary {
  background: #dfe5ff;
  color: var(--primary);
}
.label.label-default > i,
.label.label-primary > i {
  color: var(--primary) !important;
}
.required_label::after {
  content: " *";
  box-sizing: content-box;
  color: #ff3400;
  font-size: 16px;
  position: absolute;
  right: -8px;
  top: -2px;
}
/* labels end */
/* spinner */
.custom_btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 25px;
  width: 75px;
  margin-top: 2rem;
  font-size: 12px;
  font-weight: 600;
  background: #18d3cc;
  color: #fff;
  border-style: none;
  outline-style: none;
  border-radius: 3px;
  text-transform: uppercase;
}
.status_success {
  background: #15c39a;
}
.status_error {
  background: #fff;
  border: 1px solid #ff6666;
  border: 1px solid #dc3545;
}
.form_error {
  // background-image: linear-gradient(#009688, #009688),
  //   linear-gradient(#dc3545, #dc3545) !important;
  // color: #dc3545;
  /* background: #fff6f6 !important; */
  /* border-color: #e0b4b4 !important; */
}

.spinner_custom {
  position: relative;
}
._tick::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 2px;
  width: 18px;
  height: 10px;
  margin-top: -11px;
  margin-left: -10px;
  color: #fff;
  font-size: 20px;
  font-weight: 300;
  border-left: 2px solid;
  border-bottom: 2px solid;
  transform: rotateZ(-45deg);
}
._error::before {
  content: "\2715";
  position: absolute;
  top: 3px;
  left: 2px;
  width: 15px;
  height: 15px;
  margin-top: -13px;
  margin-left: -28px;
  color: #fff;
  font-size: 20px;
  font-weight: 300;

  content: "INVALID";
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 1px;
  color: #ff6666;
  color: #dc3545;
}

.spinit::before {
  content: "";
  box-sizing: border-box;
  position: absolute;
  top: 3px;
  left: 2px;
  width: 15px;
  height: 15px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border: 2px solid #fff;
  border-top-color: #18d3cc;
  animation: spinit 0.8s linear infinite;
}

@keyframes spinit {
  to {
    transform: rotate(360deg);
  }
}

.border_none {
  border: none;
}

/* .clearfix {
 height: 0;
} */
// .leftSidebar {
//   margin-top: 3px;
// }
/* .page .page-info .page-nav{
  margin-top: 0px;
} */

/* organization settings */
.orgSettingsView label.error {
  /* display: none !important; */
}
.custom_view {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.custom_view .org_settings_form_cont {
  padding-top: 1rem;
}
.custom_form_fieldset.divider {
  border-top: 1px solid #ddd;
}
.custom_view label.custom_label,
.custom_label {
  font-size: 16px;
  color: #555555;
  color: #8f929f;
  color: #56575e;
  font-weight: 400;
  text-transform: capitalize;
  line-height: 1.4;
  color: #6d707c;
  width: fit-content;
  width: -moz-fit-content;
  color: var(--txt-tertiary);
  position: relative;
  /* margin: 0; */
}

.custom_view .custom_select_box > select,
.custom_view input.custom_input,
.custom_select_box > select,
input.custom_input {
  outline-style: none;
  border-style: none;
  outline: 1px solid #ddd;
  border-radius: 3px;
  padding: 5px;
  padding-left: 10px;
  font-size: 16px;
  background: #fff;
  color: var(--text-dark);
}
.custom_view .custom_select_box > select,
.custom_select_box > select {
  padding-right: 30px;
}
.custom_view .custom_select_box,
.custom_select_box {
  position: relative;
}
.custom_view textarea.custom_input,
textarea.custom_input {
  width: 100%;
  max-width: 350px;
  padding: 10px;
  resize: none;
  border: none;
  border-radius: 3px;
  outline: 2px solid #ddd;
  max-height: 100px;
  color: var(--text-dark);
}
.custom_select_box > select:focus,
.custom_view input.custom_input:focus,
input.custom_input:focus,
.custom_view textarea.custom_input:focus,
textarea.custom_input:focus {
  outline: 1px solid #496dff;
  box-shadow: 0px 0px 4px 1px #496dff;
}
.custom_view textarea.custom_input:focus,
textarea.custom_input:focus {
  outline-width: 2px;
}
.custom_input_sm {
  width: 140px;
}
.custom_input_md {
  width: 240px;
}
.custom_input_lg {
  width: 350px;
}

.custom_select_box > select > option {
  border-bottom: 1px solid #ddd;
  padding: 10px;
}

input.custom_input[type="number"] {
  -webkit-appearance: textfield;
  -moz-appearance: textfield;
  appearance: textfield;
}

.custom_select_box > select,
input.custom_input[type="number"]::-webkit-inner-spin-button,
input.custom_input[type="number"]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  appearance: none;
  -moz-appearance: none;
}
.custom_textarea {
  width: 100%;
}
.custom_view .custom_select_box::before,
.custom_select_box::before {
  content: "\2304";
  position: absolute;
  top: -6px;
  right: 0;
  height: 100%;
  width: 30px;
  border-radius: 3px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 25px;
  font-weight: 300;
  color: #555;
  pointer-events: none;
}
.custom_input_icon {
  position: relative;
  width: fit-content;
  width: -moz-fit-content;
}
.custom_input_icon_right > input.custom_input {
  padding-right: 40px;
}
.custom_input_icon_left > input.custom_input {
  padding-left: 40px;
}
.custom_input_icon::after,
.custom_input_icon::before {
  position: absolute;
  top: 0;
  height: 100%;
  width: 30px;
  background-color: #c5c7d1;
  outline: 1px solid #c5c7d1;
  border-radius: 3px;
  text-align: center;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 18px;
  font-weight: 300;
}
.custom_input_icon::after {
  right: 0;

  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
}

.custom_input_icon::before {
  left: 0;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
.custom_input_icon_percentage::after {
  /* content: ""; */
  content: "\0025";
}
.custom_input_icon_rupee::after {
  /* content: "₹"; */
  content: "\20B9";
}
.custom_input_icon_mailbox::after {
  /* content: "₹"; */
  content: "\2709";
  font-size: 27px;
}
.custom_input_icon_calender::after {
  /* content: "₹"; */
  content: "\1F4C5";
  filter: hue-rotate(0deg);
  background-color: #fff;
}
.custom_input_icon_mobilenumber > input.custom_input {
  width: 180px;
  padding-left: 50px;
  letter-spacing: 2px;
}

input.custom_input::-webkit-input-placeholder,
input.custom_input::placeholder,
input.custom_input::-moz-placeholder {
  color: #9fa2ab;
}

.custom_input_icon_mobilenumber::before {
  /* content: "₹"; */
  content: "+91";
  font-size: 16px;
  width: 40px;
}

.custom_input_icon_none::after,
.custom_input_icon_none::before {
  all: unset;
}

.orgSettingsViewSection section,
.contractSettingsViewSection {
  display: block !important;
}

/* .orgSettingsCont::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color: #009688;
  margin: 10px 0px 80% 0px;
  opacity: 0.5;
} */

.layoutCont {
  position: relative;
}
.layoutNav {
  position: absolute;
  top: 0;
  right: 0;
}
.layoutSidebar,
.orgSettingsSidebar,
.contractSettingsSidebar {
  border-right: 1px solid #d5d5d5;
}
.layoutSidebar,
.layoutMain,
.orgSettingsSidebar,
.contractSettingsSidebar,
.orgSettings_template_cont,
.contractSettings_template_cont {
  overflow: auto;
  scroll-behavior: smooth;
}
/* .intersectionObserver_wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #009688;
  opacity: 0.5;
  margin: 0px 0px 75% 0px;
  pointer-events: none;
} */

.layoutMain {
  width: 100%;
  height: 100%;
}
.sidebar_item,
.settings_item {
  position: relative;
  /* padding: 5px;
  padding-block: 3px; */
  cursor: pointer;
}
.sidebar_item a,
.settings_item a {
  color: unset;
  display: block;
  padding: 5px;
  padding-top: 3px;
  padding-bottom: 3px;
  padding-left: 10px;
}
.sidebar_item,
.settings_item.parent {
  margin-top: 8px;
  margin-bottom: 8px;
  text-transform: uppercase;
}
.settings_item.parent {
  padding: 3px;
}
.sidebar_item a,
.settings_item.parent a {
  font-weight: 700;
}
.settings_item.child {
  margin: 0;
  margin-left: 1rem;
  margin-bottom: 5px;
}
.settings_item.child a {
  font-weight: 300;
  text-transform: capitalize;
  line-height: 20px;
  padding: 5px;
  padding-left: 8px;
}
.settings_toggle_icon {
  position: absolute;
  display: flex;
  justify-content: center;
  align-items: center;
  right: 20px;
  top: 0;
  bottom: 0;
  font-size: 24px;
  padding-left: 8px;
  padding-right: 8px;
}
.settings_toggle_icon > i {
  pointer-events: none;
  transition: transform ease 200ms;
}
.sidebar_item.active::before,
.settings_item.parent.active::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 3px;
  background-color: var(--primary);
  border-radius: 15px;
}
.settings_item.parent.active {
  background-color: var(--container-color);
}

.sidebar_item:hover,
.settings_item:hover {
  background-color: var(--container-color);
  border-radius: 0px;
}

.settings_nested {
  -moz-transition: height 0.5s;
  -ms-transition: height 0.5s;
  -o-transition: height 0.5s;
  -webkit-transition: height 0.5s;
  transition: height 0.5s;
  height: 0;
  overflow: hidden;
}
.sidebar_item.active a,
.settings_item.active a {
  color: var(--primary);
}
.settings_item.child.active a {
  color: var(--primary);
  font-weight: 700;
}
.custom_view *::-webkit-scrollbar {
  width: 2px;
}
.custom_view *::-webkit-scrollbar-track {
  opacity: 0;
  background: transparent;
}
.custom_view *::-webkit-scrollbar-thumb {
  width: 5px;
  background-color: var(--primary);
}
.custom_view *::-webkit-scrollbar-thumb:hover {
  background-color: #808595;
  cursor: all-scroll;
}
.orgSettings_template_cont::-webkit-scrollbar-thumb,
.contractSettings_template_cont::-webkit-scrollbar-thumb {
  width: 8px !important;
}
.orgSettings_template_cont::-webkit-scrollbar,
.contractSettings_template_cont::-webkit-scrollbar {
  width: 8px !important;
}
.settings_section.animate,
.custom_form_fieldset > h3.animate {
  -webkit-animation: fadeinout 2s ease-out;
  animation: fadeinout 2s ease-out;
}

@keyframes fadeinout {
  0%,
  100% {
    background-color: #ffffff;
  }
  20%,
  80% {
    background-color: var(--surface-color);
  }
  40%,
  60% {
    background-color: var(--surface-color);
  }
  50% {
    background-color: var(--container-color);
  }
}

.no_templateImage {
  width: 200px;
  outline: 2px solid #ddd;
  height: 150px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.no_templateImage > * {
  color: #555;
}
.settings_space_extend {
  width: 100%;
  height: 500px;
  padding-top: 5rem;
  background-color: transparent;
}
/* organization settings */

/* report template  */
.form_cont {
  height: auto;
  margin-bottom: 3rem;
  margin-top: 2rem;
}
.createReportTemplateFormCont,
.updateReportTemplateFormCont {
  overflow: auto;
  padding-left: 2rem;
  padding-right: 2rem;
  border-right: 1px solid #ddd;
}
.template_fields_head_row {
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-block: 1px solid #ddd;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}
.custom_select_box {
  position: relative;
  width: fit-content;
  width: -moz-fit-content;
}

.custom_select_box .dropdown_list_cont {
  display: none;
  position: absolute;
  width: 100%;
  margin-top: 5px;
  border: 1px solid #ddd;
  border-radius: 5px;
  z-index: 999;
  background: #fff;
}
.custom_select_box ul {
  list-style: none;
}
.custom_select_box li {
  padding: 5px 10px;
  text-transform: uppercase;
  cursor: pointer;
}
.custom_select_box li:hover {
  background-color: var(--tr-hover);
}
/* .custom_select_box .custom_input:focus + .dropdown_list_cont {
  display: block;
} */
table.dataTable.stripe tbody tr.odd.selected,
table.dataTable.display tbody tr.odd.selected,
table.dataTable tbody tr.selected {
  background-color: #bad2ff;
}

table.dataTable td input[type="checkbox"] {
  width: 20px !important;
  height: 20px !important;
}

.step_cont {
  position: relative;
}
.step_cont::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  height: 1px;
  background-color: #c0ccff;
  z-index: -1;
}
.step_cont {
  padding-left: 9rem;
  padding-right: 9rem;
}
.step {
  padding: 0.5rem 1.5rem;
  background: #fff;
  outline-style: none;
  border-style: none;
  border-radius: 15px;
  text-align: center;
  text-transform: capitalize;
  color: var(--primary);
  outline: 2px solid #c0ccff;
  transition: ease-in-out 150ms;
}
.step:hover {
  box-shadow: 0px 0px 4px 5px #fff, 0px 0px 5px 4px #1d3dbf;
  outline-color: #5f7eff;
  color: var(--primary);
  /* color: #2cca5c; */
  /* color: #e07740; */
}
.step.active {
  box-shadow: 0px 0px 4px 5px #fff, 0px 0px 5px 4px #e07740;
  outline-color: #e07740;
  color: #e07740;
  /* color: #2cca5c; */
}

.specific_step {
  position: relative;
  outline: 1px solid var(--primary);
  padding: 3px;
  border-radius: 15px;
  padding-right: 2rem;
  padding-left: 7px;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 19px;
  font-size: 12px;
}
.specific_step::after {
  content: "\002934";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  padding-right: 4px;
  font-size: 11px;
}

/* report template  */

/* template settings */
.letter_heads_cont,
.content_templates_cont,
.letter_heads_cont_cts,
.content_templates_cont_cts,
.templates-grid {
  padding: 2rem;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 250px));
  gap: 3rem;
}
.templateCard_cont {
  position: relative;
}
.templateImage {
  outline: rgb(0, 0, 0) solid 1px;
  /* min-width: var(--pdf-portrait-width); */
  /* max-width: var(--pdf-portrait-width); */
  width: fit-content;
  width: -moz-fit-content;
  height: 460px;
  display: flex;
  flex-direction: column;
  height: 510px;
  outline: 2px solid #555;
  line-height: 1;
}
.template_card {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  position: relative;
}
.template_card .page-header,
.template_card .page-footer,
.template_card .page-body {
  margin: 0;
  padding: 0;
}
.hover_menu_items_cont {
  position: absolute;
  left: 0;
  bottom: 0;
  display: none;
  -webkit-animation: slideUp 500ms ease-out;
  animation: slideUp 500ms ease-out;
}

.template_card:hover .footer {
  justify-content: space-between;
}
/* .template_card:hover .default_tag {
  visibility: hidden;
} */
.template_card:hover .template_edit_btn {
  display: block;
}
.template_card .cont {
  justify-content: space-between;
  height: 100%;
}
.template_card .header {
  text-transform: none;
  letter-spacing: 1px;
  color: #1e1e23;
  height: 25px;
}
.context_menu {
  position: relative;
  width: fit-content;
  height: 100%;
}
.dots_cont {
  position: absolute;
  padding: 10px;
  cursor: pointer;
  right: 0px;
  top: -8px;
}
.dots {
  --bg-primary: #555555;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background-color: var(--bg-primary);
  box-shadow: var(--bg-primary) 0px 6px 0px, var(--bg-primary) 0px -6px 0px;
  pointer-events: none;
}
.menu_box {
  position: absolute;
  color: rgb(85, 85, 85);
  right: 0px;
  top: -5px;
  background: #fff;
  box-shadow: #555 0px 3px 6px 0px;
}

.setDefault_label {
  width: 100%;
  z-index: 9;
  cursor: pointer;
}
.blur_box {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: transparent;
  opacity: 0;
  z-index: 1;
}
.template_card .body {
  flex: 1;
  background: #cecece;
  background: #dcdee0;
  padding: 24px;
}
.template_card .body_cont {
  position: relative;
  border-radius: 4px;
  overflow: hidden;
  background-color: #fff;
}
.template_card .templateImageCont {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  transform: scale(0.3);
  pointer-events: none;
  background-color: #ddd;
  transform-origin: top left;
}
.template_card .templateImage {
  outline: rgb(0, 0, 0) solid 1px;
  min-width: var(--pdf-portrait-width);
  max-width: var(--pdf-portrait-width);
  height: 460px;
  display: flex;
  flex-direction: column;
  height: 510px;
  outline: 2px solid #555;
}
.template_card .footer {
  position: relative;
  width: 100%;
  padding: 14px;
  background-color: #fff;
}
.template_card_title {
  text-transform: capitalize;
  margin: 0;
  font-size: 14px;
  line-height: 16px;
}
.footer .template_edit_btn {
  padding: 3px 6px;
  color: #3351df;
  background: #fff;
  /* font-weight: 700; */
  border: 1px solid #c7d1ff;
  border-radius: 3px;
  text-transform: capitalize;
  font-size: 14px;
  /* position: absolute; */
  /* margin-top: 0px; */
  right: 0;
  border: none;
  margin-left: 4px;
  line-height: 1;
}
.footer .template_edit_btn:hover {
  background: #3351df;
  border-color: #3351df;
  color: #ffffff;
  cursor: pointer;
}
.footer .template_reset_btn {
  padding: 2px 4px;
  border: none;
  outline: none;
  display: flex;
  line-height: 1;
  background: white;
  text-transform: capitalize;
  /* border: 1px solid #d61f1f; */
  color: #d61f1f;
  border-radius: 2px;
}
.footer .template_reset_btn:hover {
  background-color: #db0000;
  color: #fff;
}

.footer-fill::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  transition: all 0.25s ease-in;
  box-shadow: inset 0 0 0 0px var(--primary);
}
.footer-fill::after {
  content: "Select template";
  font-size: 16px;
  letter-spacing: 1px;
  font-weight: 600;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: transparent;
  color: #fff;
  width: 100%;
  height: 100%;
  visibility: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.25s ease-in;
}
.template_card .cover {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  background-color: transparent;
  cursor: pointer;
  z-index: 9;
}
.template_card:hover .footer-fill::before {
  box-shadow: inset 0 -60px 0 0px var(--primary);
}
.template_card:hover .footer-fill::after {
  visibility: visible;
}
.template_card:hover .footer-fill {
  color: #fff;
}
.template_add_btn {
  background: #e7e7e7;
  border-radius: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0rem;
  position: relative;
  cursor: pointer;
}
.template_add_btn::before {
  content: "";
  width: 30%;
  height: 1px;
  background: #929292;
  position: absolute;
}
.template_add_btn::after {
  content: "";
  height: 30%;
  background: #929292;
  position: absolute;
  width: 1px;
}
.menu_items_cont {
  background: #fff;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: start;
  -webkit-box-shadow: 0px 2px 8px -2px rgb(148 169 255);
  -moz-box-shadow: 0px 2px 8px -2px rgba(148, 169, 255, 1);
  box-shadow: 0px 2px 8px -2px rgb(148 169 255);
}
.menu_title {
  padding-left: 10px;
  padding-right: 10px;
}
.menu_item {
  width: 100%;
}
.setDefault_label {
  width: 100%;
  padding: 5px;
  margin: 0;
  padding-left: 10px;
  justify-content: start;
  z-index: 9;
  cursor: pointer;
  font-size: 14px;
  color: #555;
}
.setDefault_label:hover {
  background: var(--container-color);
}
.menu_item > label > input {
  margin: 0;
  height: 18px;
  width: 18px;
  border: none;
  border-radius: 2px;
  margin-right: 5px;
  cursor: pointer;
}
.menu_item > label > input:focus {
  outline: 2px solid var(--bg-primary);
}
.card_defaults {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  margin-top: 8px;
}
.default_tag {
  margin-right: 5px;
  /* margin-right: 10px; */
  /* border-radius: 15px; */
  padding-left: 10px;
  padding-right: 10px;
  font-weight: 500;
  font-size: 14px;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
  background: #ee9e42;
  /* background: #e7e7e7; */
  color: #2a2a2a;
  margin: 0;
  background: var(--container-color);
  background: var(--container-color);
  /* color: #fff; */
  border-radius: 20px;
  padding: 0px 12px;
  letter-spacing: 1px;
  text-transform: capitalize;
}
.payslip_tag {
  /* background: #ff9490;
  background: #ffadaa; */
}
.bill_tag {
  /* background: #62a4ff;
  background: #b2d2ff; */
}

/* template settings */

.expiring-contracts-list,.auditLog-list ul {
  padding-left: 3rem;
  // height: 300px;
  // overflow: auto;
}

.updateEmployeeAccountDetailsForm .select2,
.employeeAddForm .select2 {
  min-width: 300px;
  max-width: 350px;
  margin-top: 1rem;
}
.tag_label {
  margin-left: 1rem;
  font-size: 11px;
  text-transform: uppercase;
  border: 1px solid #ddd;
  padding: 3px 6px;
  line-height: 1;
  color: #d61414;
  border-color: #ffe7e7;
  border-radius: 4px;
  background: #ffe7e7;
}

@media (max-width: 768px) {
  .first_row,
  .second_row {
    display: block;
  }

  /* .grid_body {
    display: block;
  } */
  .panel-title a {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .grid_body,
  .grid_col_5,
  .grid_col_4,
  .grid_col_3,
  .grid_col_2 {
    grid-template-columns: 1fr;
  }
}

/* utility classes */
.appearance_none {
  border: none;
  outline: none;
}

.c_label.w_85 {
  width: 85px;
}
.d_none {
  display: none;
}

.d_inline {
  display: inline-block;
}
.d_flex {
  display: flex;
}

.bg_transparent {
  background-color: #fff;
  background-color: transparent;
}
.bg_primary {
  background-color: var(--primary);
}
.text_primary {
  color: var(--primary) !important;
}
.text_white {
  color: #fff;
}

/* subscription plans */
.subscription-plan-limit {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 13px;
  padding: 0.75rem 1rem;
  border-radius: 6px;
  margin-top: 0.5rem;
  font-weight: 500;
}

.subscription-plan-limit .icon {
  font-size: 1rem;
}

.subscription-plan-limit .info_text {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
.info_primary {
  color: #0a2238;
  background: #c9e5ff;
  color: #3538cd;
  background: #eef4ff;
}
.info_warning {
  /* color: #56390b;
  background: #ffe4bb; */
  color: #472f08;
  background: #ffeacb;
}
.info_danger {
  color: #7e150b;
  background: #ffd7d3;
}

/* overrides */
.billBox {
  height: unset;
  max-height: 1250px;
}
.billBox .billViewBox {
  height: unset;
  max-height: 1125px;
}
.billBox .reportNav {
  background-color: #ffffff;
  margin-bottom: 3rem;
}

@media (min-width: 1500px) {
  .col-xl-1,
  .col-xl-2,
  .col-xl-3,
  .col-xl-4,
  .col-xl-5,
  .col-xl-6,
  .col-xl-7,
  .col-xl-8,
  .col-xl-9,
  .col-xl-10,
  .col-xl-11,
  .col-xl-12 {
    float: left;
  }

  .col-xl-1 {
    width: 8.3333333333%;
  }

  .col-xl-2 {
    width: 16.6666666667%;
  }

  .col-xl-3 {
    width: 25%;
  }

  .col-xl-4 {
    width: 33.3333333333%;
  }

  .col-xl-5 {
    width: 41.6666666667%;
  }

  .col-xl-6 {
    width: 50%;
  }

  .col-xl-7 {
    width: 58.3333333333%;
  }

  .col-xl-8 {
    width: 66.6666666667%;
  }

  .col-xl-9 {
    width: 75%;
  }

  .col-xl-10 {
    width: 83.3333333333%;
  }

  .col-xl-11 {
    width: 91.6666666667%;
  }

  .col-xl-12 {
    width: 100%;
  }
}

@media screen and (max-width: 767px) {
  .orgSettingsSidebar,
  .contractSettingsSidebar {
    display: none;
  }
}
.dropdown-menu {
  margin: 0;
}
.dropdown-menu li {
  padding: 0px;
}
.billBox .reportNav a {
  padding: 6px 12px;
  border-radius: 0;
  margin: 0;
}

.org_btn {
  margin: 0;
  line-height: 1.2;
  font-size: 18px;
  border-radius: 4px;
  outline: none;
  border: none;
  padding: 10px 16px;
  background-color: transparent;
  color: #fff;
  text-transform: capitalize;
}
.org_btn:hover {
  color: #fff;
  background-color: var(--on-container-color) !important;
}

.orgProfileView_cont {
  display: flex;
  justify-content: center;
  background-color: #fff;
}
.orgProfileView_wrapper {
  border-radius: 8px;
  background-color: #fff;
}
.org_profile_details * {
  /* margin: 0; */
  line-height: unset;
}
.org_profile_details div {
  line-height: 1;
}
.bg_cover {
  /* height: 150px; */
  padding: 16px;
  background-color: var(--container-color);
}
.org_logo_wrapper {
  width: 100%;
  height: 60px;
}
.org_logo_cont {
  position: absolute;
  background: #fff;
  width: 130px;
  height: 130px;
  left: 50%;
  top: -50%;
  transform: translate(-50%, -28%);
  border-radius: 50%;
  overflow: hidden;
}
.org_logo {
  object-fit: cover;
  height: 100%;
  width: 350px;
  border-radius: 4px;
}
.org_profile_details {
  padding: 16px;
}
.org_profile_details .org_name {
  font-size: 22px;
  font-weight: 700;
  text-align: center;
  color: var(--primary);
  margin: 0;
}
.org_status {
  font-size: 16px;
  font-weight: 600;
  color: var(--text-placeholder);
}
.org_status::before {
  content: "";
  width: 8px;
  height: 8px;
  display: block;
  border-radius: 50%;
  margin-right: 4px;
}
.org_status.active::before {
  background-color: #12b76a;
}
.org_status.inactive::before {
  background-color: #474952;
}
.orgProfileView_wrapper .edit_btn_cont {
  right: 0;
  top: 0;
  line-height: 1;
}
.orgProfileView_wrapper .edit_btn {
  margin: 0;
  padding: 0;
  outline: 0;
  border: 0;
  background: transparent;
  line-height: 1;
  font-size: 20px;
  color: var(--text-dark);
  box-shadow: none;
  padding: 16px 24px;
  margin: 4px 8px;
  background-color: var(--container-color);
  border-radius: 6px;
}
header .navbar-right .dropdown-menu .dropdownView {
  padding: 0;
}
.profile_menu a {
  padding: 8px 16px !important;
  font-size: 14px;
  line-height: 14px;
  display: flex;
  align-items: center;
}
.profile_menu a:hover {
  background-color: var(--container-color) !important;
}
.profile_menu a i.fa {
  margin: 0 !important;
  margin-right: 8px !important;
  pointer-events: none;
}
.fa.fa-trash,
.fa.fa-trash-o {
  color: #ff1212;
}
.amount_w {
  width: 120px;
}

.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 5px;
  margin: auto;
  margin-top: 8px;
  margin-bottom: 8px;
  gap: 8px;
  text-align: center;
  max-width: 100%;
}

.flex {
  display: flex;
}

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

.justify-center {
  justify-content: center;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.my-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.space-y-8 > * {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

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

.sm\\:max-w-md {
  max-width: 28rem; /* This assumes a breakpoint for small screens. You can adjust as needed. */
}

.w-40 {
  width: 10rem;
}

.h-40 {
  height: 10rem;
}

.dark\\:text-gray-600 {
  color: #718096; /* Dark mode text color */
}

.fill-current {
  fill: currentColor;
}

.w-32 {
  width: 8rem;
}

.h-32 {
  height: 8rem;
}

.x-168 {
  x: 4.25rem;
}

.y-320 {
  y: 8rem;
}

.bg-violet-400 {
  background-color: #9f7aea; /* Dark mode background color */
}

.text-gray-900 {
  color: #1a202c; /* Dark mode text color */
}

.text-3xl {
  font-size: 1.875rem; /* 30px */
}

.px-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.py-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.font-semibold {
  font-weight: 600;
}

.rounded {
  border-radius: 0.25rem;
}
.rounded_4 {
  border-radius: 4px;
}
.rounded_15 {
  border-radius: 15px;
}
.line_height_1 {
  line-height: 1;
}
.line_height_17 {
  line-height: 17px;
}
.btn_sm {
  padding: 8px 12px !important;
  line-height: 1;
}

.border_bottom_1 {
  border-bottom: 1px solid #eee;
}
.border_top_1 {
  border-top: 1px solid #eee;
}
.pointer_none{
  pointer-events: none;
}
.h_70vh{
  height: 70vh;
}

.datepicker.datepicker-dropdown{
  z-index: 9999 !important;
}