@import url("https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap");

@-webkit-viewport {
  width: device-width;
}

@-moz-viewport {
  width: device-width;
}

@-ms-viewport {
  width: device-width;
}

@-o-viewport {
  width: device-width;
}

@viewport {
  width: device-width;
}

:root {
  --primary-color: #0194ff;
  --secondary-color: #0c0e10;
  --light-color: #fff;
  --sidebar-bg: #0c0e10;
  --overlay-color: #e5f4ff;
  --text-color: #9e9e9e;
  /* --tertiary-color: #1c1c1c; */
  --border-color: #e0e0e0;
  --dark-color: #1a1a1a;
  --gray-color: #757575;
  --button-color: #1f73b7;
  --heading-color: rgb(26 26 26 / 75%) 75%;
  --input-placeholder-color: #8f9899;
  --card-hover-color: #f9f9f9;
  --input-value-color: #dbdbdb;
  --primary-gradient: linear-gradient(90deg, #0194ff 0%, #0b68b8 100%);
  --hover-color: #0283eb;
  --orange: orange;
  --hyperlink-color: #298bff;
  --success-color: #009f5b;
  --pending-color: #f7996b;
}

html {
  background-color: #fff !important;
}

body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-transition: 0.25s ease;
  transition: 0.25s ease;
  overflow-x: hidden;
  position: relative;
  font-family: "Outfit", sans-serif !important;
  color: var(--light-color);
  background-color: #fff !important;
  /* font-size: 14px !important; */
  /* font-size: calc(.5em + 0.4vw)!important; */
  font-size: calc(0.5 * (1.5vh + 1.1vw)) !important;
  /* letter-spacing: 0.8px; */
}

body.modal-open {
  overflow: auto !important;
}

body.modal-open[style] {
  padding-right: 0px !important;
}

.logo {
  max-height: 70px;
  object-fit: contain;
}

.navbar-logo img {
  max-height: 80px;
  object-fit: contain;
}

.header-nav-center {
  padding: 0em 0;
  border-bottom: 1px solid rgba(11, 34, 56, 0);
  -webkit-transition: 0.3s !important;
  -moz-transition: 0.3s !important;
  -o-transition: 0.3s !important;
  -ms-transition: 0.3s !important;
  transition: 0.3s !important;
  background-color: #000;
  padding-top: 1em;
  /*  position: fixed;
    left: 0;
    right: 0;
    z-index: 999;*/
}

.padding-btm-md {
  padding-bottom: 4em !important;
}

.header-nav-center .navbar .nav-link {
  font-size: 1.2em;
  font-weight: 600;
  text-transform: capitalize;
  opacity: 0.8;
  letter-spacing: 0.5px;
}

.dropdown-toggle::after {
  display: none;
}

.user-dropdown-sec .dropdown-toggle::after {
  display: none;
}

.user-dropdown-sec .dropdown-menu.show {
  left: -45px !important;
  border-radius: 12px !important;
}

.user-dropdown-sec .dropdown-menu a {
  display: flex;
  align-items: center;
  gap: 0.5em;
  color: #6e6d8e;
  font-size: 0.9em;
  padding: 0.8em 1em !important;
  text-decoration: none !important;
}

.user-dropdown-sec .dropdown-menu a svg {
  fill: #6e6d8e;
}

.user-dropdown-sec .dropdown-toggle span {
  color: var(--dark-color);
}

.user-dropdown-sec .dropdown-menu {
  border: 1px solid #e7e7e7 !important;
  border-radius: 0 !important;
}

.user-dropdown-sec .dropdown-toggle {
  background-color: transparent !important;
  border: 0 !important;
  display: flex;
  justify-content: flex-end;
  padding-right: 0;
  /* padding-left: 0; */
}

.hamburger-menu {
  width: 2em;
}

/* Admin UI CSS */

.main-content-wrapped {
  width: 100%;
  height: 100vh;
}

.admin-ui-sec {
  min-height: 100vh;
  background-color: #fff;
  display: flex;
  width: 100%;
  height: 100%;
  position: relative;
  overflow: hidden;
}

.admin-ui-sidebar {
  width: 5.5em;
  position: fixed;
  left: 0;
  top: 0;
  /* overflow: auto; */
  will-change: transform;
  display: flex;
  flex-direction: column;
  border-right: 1px solid #1c1c1c1a;
  /* box-shadow: 1px 0px 1px rgba(0, 0, 0, 0.15); */
  background: var(--sidebar-bg);
  bottom: 0;
  animation: fadeIn 1s;
  scrollbar-width: none;
  -ms-overflow-style: none;
  overflow: -moz-scrollbars-none;
  /* overflow: hidden; */
  z-index: 9;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar {
  width: 16.2em;
  /* padding: 1em; */
  position: relative;
  position: fixed;
  left: 0;
  top: 0;
  /* overflow: auto; */
  transition: width 1s ease-in;
  will-change: width;
  display: flex;
  flex-direction: column;
  /* box-shadow: 1px 0px 1px rgba(0, 0, 0, 0.15); */
  background: var(--sidebar-bg);
  bottom: 0;
  z-index: 9;
  -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s;
  border-right: 1px solid var(--sidebar-bg);
  /* overflow: hidden; */
}

.admin-ui-main-wrapper {
  width: 100%;
  /* margin-left: 6%; */
}

.admin-ui-logo-sec {
  padding: 1em;
  text-align: left;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar .admin-ui-logo-sec {
  display: flex;
  align-items: center;
}

.admin-ui-logo-sec a {
  display: block;
  width: 100%;
}

.admin-ui-main-wrapper {
  width: 100%;
  margin-left: 5.2em;
  /* margin-left: 5.5em; */
  background: #f7f8f8;
}

.graph-card h5 {
  font-size: 1em;
  color: var(--dark-color);
  font-weight: 600;
  margin-bottom: 0;
}

.alerts-warning-box .alert {
  margin-bottom: 0;
  padding: 0.5em 1em;
  font-size: 0.8em;
  display: grid;
  grid-template-columns: 30px auto;
  align-items: center;
}

.alerts-warning-box .alert svg {
  animation: blinking 1s infinite;
}

.alerts-warning-box .alert:hover svg {
  animation: none;
}

@keyframes blinking {
  0% {
    fill: #58151c;
  }

  50% {
    fill: #58151c;
  }

  51% {
    fill: white;
  }

  100% {
    fill: white;
  }
}

.my-anchor-element {
  text-decoration: none !important;
}

.tooltip-element-box {
  font-size: 0.8em !important;
  max-width: 400px;
  /* display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all; */
}

.admin-ui-header-sec {
  /* box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15);
  background-color: var(--light-color);
  padding: 0.5em 1.5em;
  position: relative;
  width: 100%; */
  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.15);
  background-color: var(--light-color);
  padding: 0.5em 1em;
  position: fixed;
  right: 0;
  /* left: 0; */
  /* width: 95.8%; */
  z-index: 1;
  width: calc(100vw - 5.2em);
}

.admin-ui-header-sec.sidebar-header {
  width: calc(100vw - 16.2em);
}

.admin-ui-main-wrapper.admin-collapse-main-wrapper {
  margin-left: 16.2em;
}

/* .admin-ui-header-sec .navbar{
  padding:0;
} */

.admin-ui-sidebar-list {
  display: flex;
  flex-direction: column;
  border-bottom: 0 !important;
  gap: 1em;
  margin-bottom: 0;
}

.admin-ui-sidebar-list li {
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  -ms-transition: 0.5s;
  -moz-transition: 0.5s;
  transition: 0.5s;
}

.admin-ui-sidebar-list li a {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 0.8em;
  justify-content: center;
  padding-top: 0.8em;
  font-weight: 500;
  color: var(--light-color);
  transition: 0.5s;
  padding-bottom: 0.8em;
  line-height: 1.8;
  font-size: 0.9em;
  text-decoration: none !important;
  border-radius: 0px;
  opacity: 1;
}

.admin-ui-sidebar-list li a.active {
  /* background-color:var(--secondary-color); */
  color: var(--light-color);
  position: relative;
  opacity: 1;
}

.admin-ui-sidebar-list li a.active::after {
  content: "";
  position: absolute;
  left: 0;
  border-top: 8px solid transparent;
  border-bottom: 8px solid transparent;
  border-left: 8px solid var(--light-color);
}

/* .admin-ui-sidebar-list li a svg {
  fill: var(--light-color);
} */

/* .admin-ui-sidebar-list li a.active svg {
  fill: var(--light-color) !important;
} */

.admin-ui-logo {
  /* max-width: 10em; */
  max-width: 3em;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar .admin-ui-logo {
  max-width: 12em;
}

.admin-ui-collapse-logo {
  max-width: 3.5em;
}

.admin-ui-collapse-logo-sec a {
  display: block;
  width: 100%;
}

.admin-ui-collapse-logo-sec {
  padding: 1.7em 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.admin-ui-title-sec h2 {
  margin-bottom: 0;
  font-size: 1.2em;
  color: var(--dark-color);
  font-weight: 600;
}

.admin-ui-title-sec {
  display: flex;
  align-items: center;
  gap: 1em;
}

.user-dropdown-sec .dropdown-toggle {
  background-color: transparent !important;
  border: 0 !important;
  display: flex;
  align-items: center;
  gap: 1em;
}

.user-dropdown-sec .dropdown-menu a {
  display: flex;
  align-items: center;
  gap: 0.5em;
  color: #6e6d8e;
  font-size: 0.9em;
  padding: 0.8em 1em !important;
  text-decoration: none !important;
}

.user-dropdown-sec .dropdown-menu a svg {
  fill: #6e6d8e;
}

.user-dropdown-sec .dropdown-toggle span {
  color: var(--dark-color);
  font-size: 0.9em;
  font-weight: 600;
}

.admin-ui-collapse-btn {
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 1em;
}

.offcanvas {
  width: 20% !important;
  background-color: var(--primary-color) !important;
}

.admin-ui-sidebar .admin-ui-collapse-body {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: calc(100vh - 69px);
  /* height: 100%; */
  overflow-y: auto;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar .admin-ui-sidebar-list li a {
  justify-content: flex-start;
  padding-left: 1em;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar .offcanvas-close {
  display: none;
}

.admin-ui-sidebar.admin-ui-collapse-sidebar .offcanvas-close::before,
.admin-ui-sidebar.admin-ui-collapse-sidebar .offcanvas-close::after {
  display: none;
}

.logo {
  max-height: 60px;
  object-fit: contain;
}

/* .admin-ui-collapse-logo-sec {
  padding: 1.05em 0;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
} */

.admin-ui-sidebar.admin-ui-collapse-sidebar .offcanvas-close {
  /* background-color: transparent !important;
  border: 0 !important;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding:0.2em!important;
  display: none; */
  background-color: transparent !important;
  border: 0 !important;
  padding-right: 0 !important;
  align-items: center;
  justify-content: flex-end;
}

.admin-ui-body-sec {
  padding: 2em;
  margin-top: 83px;
  position: relative;
}

.admin-user-details {
  display: flex;
  align-items: center;
  gap: 1em;
  border-bottom: 1px solid #efefef24;
  padding-bottom: 1em;
}

.admin-user-details .user-name {
  color: var(--dark-color);
  font-size: 0.9em;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
}

.admin-ui-collapse-body {
  /* padding-top: 2em;
  border-bottom: 1px solid #efefef24;
  padding-bottom: 2em; */
  /* padding: 1em; */
}

/* Form Style  */
.default-form-heading {
  color: var(--gray-color);
  display: flex;
  justify-content: space-between;
  font-size: 0.9em;
  font-weight: 400;
}

.modal-body {
  padding: 2em 2em !important;
  /* padding-top: 0!important; */
}

.efi-bank-default-form .submit-button {
  background: var(--primary-gradient);
  font-size: 0.95em;
  font-weight: 600;
  padding: 0.8em 2em !important;
  border: none;
  width: 100%;
  text-align: center;
  color: var(--light-color);
}

.efi-bank-default-form .submit-button:hover,
.efi-bank-default-form .submit-button:focus {
  background: var(--primary-gradient) !important;
}

.efi-bank-default-form .delete-button {
  background: #f34235;
  font-size: 0.95em;
  font-weight: 600;
  padding: 0.8em 2em !important;
  border: none;
  width: 100%;
  text-align: center;
}

.efi-bank-default-form .delete-button:hover,
.efi-bank-default-form .delete-button:active {
  background: #f34235 !important;
}

.efi-bank-default-form .submit-button:hover {
  background: var(--primary-gradient);
}

.efi-bank-default-form .submit-button:active {
  background: var(--primary-gradient) !important;
}

.efi-bank-default-form .cancel-button {
  background: var(--border-color);
  color: var(--dark-color);
  padding: 0.8em 2em !important;
  border: none;
  font-size: 0.95em;
  font-weight: 600;
  text-transform: capitalize;
  width: 100%;
  text-align: center;
}

.efi-bank-default-form .cancel-button:hover {
  background: var(--border-color);
  color: var(--dark-color);
}

.efi-bank-default-form .cancel-button:active {
  background: var(--border-color) !important;
  color: var(--dark-color) !important;
}

.efi-bank-default-form .form-modal-footer {
  display: flex;
  gap: 1em;
  align-items: center;
  justify-content: center;
}

.efi-bank-default-form .form-label {
  font-size: 0.85em;
  color: var(--dark-color);
  font-weight: 500;
}

.efi-bank-default-form .form-label span {
  color: red;
}

.efi-bank-default-form .form-control {
  font-size: 0.9em;
  color: var(--heading-color);
  /* padding: 1em; */
  height: 45px;
  border-radius: 8px;
}

.efi-bank-default-form .form-control:focus {
  border: 1px solid #dbdbdb;
  box-shadow: none;
}

.efi-bank-default-form .input-group:focus-within .form-control,
.efi-bank-default-form .input-group:focus-within .input-group-text {
  border: 1px solid #dbdbdb;
  box-shadow: none;
}

.open-account-btn-sec {
  margin-bottom: 2em;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.full-body-card-wrapped {
  padding: 1.5em;
  margin-top: 5em;
}

.full-body-card-wrapped .common-full-card {
  border-radius: 12px;
  background: var(--light-color);
  padding: 1.5em;
}

.onboarding-auth-header {
  display: flex;
  align-items: start;
  justify-content: space-between;
}

.onboarding-auth-header h5 {
  font-size: 1.2em;
  font-weight: 600;
  color: var(--dark-color);
  margin-bottom: 0em;
}

.head-two-space p {
  margin-bottom: 0;
  font-size: 0.9em;
  color: var(--dark-color);
  font-weight: 500;
}

.payment-tab-content {
  border-radius: 12px;
  background: var(--light-color);
  padding: 1.5em;
  box-shadow: 0px 0px 4px 0px #00000040;
  margin-top: 1em;
}

.efi-bank-card-form .form-label {
  font-size: 1em;
  color: var(--input-label-color);
  font-weight: 500;
}

.efi-bank-card-form input {
  width: 100%;
}

.efi-bank-card-form input::placeholder {
  font-size: 0.7em;
  color: var(--heading-color);
}

.efi-bank-card-form .card-form-heading {
  text-align: left;
  font-size: 1.3em;
  color: var(--input-label-color);
}

.efi-bank-card-form .form-control:focus {
  border: 1px solid #6359e9;
  box-shadow: none;
}

.efi-bank-card-form .form-control {
  font-size: 0.9em;
  color: var(--heading-color);
  padding: 1em;
}

.efi-export-btn {
  background: var(--primary-gradient) !important;
  color: var(--light-color) !important;
  padding: 0.7em 2em !important;
  display: flex !important;
  align-items: center;
  gap: 0.3em;
  border-radius: 4px;
  border: 0 !important;
  position: relative;
  font-size: 0.95em !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.efi-export-btn:hover,
.efi-export-btn:focus {
  background: linear-gradient(90deg, #ca9e0a 0%, #6d4901 100%) !important;
}

/* .efi-submit-btn:active {
  background: var(--button-color) !important;
} */
.efi-cancel-btn {
  background: var(--border-color) !important;
  color: var(--dark-color) !important;
  padding: 0.7em 2em !important;
  border: none !important;
  font-size: 0.95em !important;
  font-weight: 600 !important;
  width: 100%;
}

.efi-bank-card-form:hover {
  background: var(--border-color);
  color: var(--dark-color);
}

.efi-cancel-btn:active {
  background: var(--border-color) !important;
  color: var(--dark-color) !important;
}

.efi-date-picker .input-group-text {
  background: none;
  border-right: none;
  height: 37px;
  margin-top: 1px;
}

.efi-feature-transation-search-frame .rmdp-input {
  border-radius: 8px !important;
}

.efi-date-picker .rmdp-input {
  border: 1px solid #dbdbdb !important;
  border-radius: 0 12px 12px 0;
  border-left: none !important;
  height: 36px;
  margin-bottom: 1px;
  padding: 1.21em 1em;
  width: 14em;
  font-size: 0.9em;
  padding-left: 0;
}

.efi-date-picker .rmdp-input:focus {
  box-shadow: none;
}

.efi-date-picker .rmdp-button {
  background: var(--button-color) !important;
  font-size: 0.8em !important;
  padding: 0 2em !important;
  border: none !important;
  height: 2.9em;
}

.efi-date-picker .rmdp-week-day {
  color: var(--secondary-color);
}

.efi-date-picker .rmdp-range {
  background: var(--button-color);
}

.payment-link-dropdown .dropdown-toggle {
  background-color: var(--secondary-color) !important;
  border: 0 !important;
  /* display: flex;
  align-items: center;
  gap: 1em; */
  display: grid;
  grid-template-columns: 50px auto;
  align-items: center;
  border-radius: 25px;
  padding: 0.5em 0.8em 0.5em 0.5em;
}

.payment-link-dropdown .payment-link-icon-sec .lazyLoder {
  margin-right: auto;
}

.payment-link-dropdown .dropdown-toggle::after {
  display: none;
}

.payment-link-dropdown .dropdown-menu {
  border-radius: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  box-shadow: 0px 0px 5px #3332 !important;
  width: 100%;
  left: -30px !important;
}

.payment-link-dropdown .dropdown-menu .dropdown-item {
  display: flex;
  align-items: center;
  gap: 0.5em;
}

.payment-link-dropdown .dropdown-menu .dropdown-item:first-child {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}

.payment-link-dropdown .dropdown-menu .dropdown-item:active {
  background: none;
}

.payment-link-dropdown .dropdown-menu .dropdown-item:last-child {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.payment-link-dropdown .dropdown-menu a {
  color: var(--secondary-color) !important;
  font-size: 0.9em;
  padding: 0.8em 1em !important;
  text-decoration: none !important;
  display: flex;
  align-items: center;
  gap: 0.5em;
}

/* .payment-link-dropdown .dropdown-menu a svg {
  fill: #6e6d8e;
} */

.payment-link-dropdown .dropdown-toggle span {
  color: var(--dark-color);
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all;
  display: none;
}

.upload-file {
  font-size: 0.9em;
  color: var(--heading-color);
  border: 1px solid #dbdbdb;
  border-radius: 12px;
  height: auto;
}

.upload-file .upload-document-img {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.5em 0;
  position: relative;
  max-width: 90%;
  max-height: 90%;
  margin: auto;
}

.upload-file .upload-document-img img {
  width: 100%;
  height: 10em;
}

.upload-file .upload-document-img svg {
  position: absolute;
  top: 15%;
  right: 2%;
  transform: "translate(-42%, -50%)";
  cursor: "pointer";
}

.upload-file p {
  font-size: 0.9em;
  color: var(--heading-color);
}

.upload-file .upload-file-text {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.8em 1em 0 0.8em;
}

.upload-file .upload-file-text {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.upload-file .upload-file-text svg {
  margin-bottom: 0.8em;
}

.view-transaction-table tr td:first-child {
  color: #8b8f96;
  font-weight: 400;
  font-size: 0.85em;
  /* padding-right: 2em!important; */
}

.view-transaction-table tr td:nth-child(2) {
  color: var(--quinary-color);
  color: #8b8f96;
  font-weight: 400;
  font-size: 0.85em;
  text-align: right;
  display: flex;
  justify-content: flex-end;
}

.view-transaction-modal .modal-title {
  font-size: 1.2em;
  color: #8b8f96;
  font-weight: 600;
}

.withdraw-modal .modal-title {
  font-size: 1.2em;
  color: #8b8f96;
  font-weight: 600;
}

.view-transaction-modal .modal-header {
  border-bottom: 1px solid #e7e7e7 !important;
}

.view-transaction-modal .view-screen-shots {
  color: #5c9eeb;
  font-weight: 700;
  border: 0 !important;
  background-color: transparent !important;
  padding: 0 !important;
}

.view-transaction-table td {
  background-color: var(--secondary-color);
  box-shadow: none;
  font-weight: 600;
  font-size: 0.85em;
  vertical-align: middle;
  color: #252525;
  padding: 1em !important;
  border-color: #e7e7e7 !important;
}

.view-transaction-table .transaction-cancel {
  margin-left: auto;
}

.view-transaction-table table {
  border-bottom: 0 !important;
}

.view-transaction-modal .modal-dialog {
  max-width: 650px;
  margin: 2rem auto;
}

.green-badge {
  background-color: #f3fcf5;
  color: #30a75f;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.purple-badge {
  color: #483489e5;
  background: #edebf4;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.red-badge {
  color: #ff596c;
  background: #fff3f5;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.orange-badge {
  color: #efaa42;
  background: #fff3f5;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.teal-badge {
  color: #347f89;
  background: #f1f6f7;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.dark-pink-badge {
  color: #893462;
  background: #f7f1f4;
  padding: 0.5em 1.5em;
  border-radius: 1.5em;
  font-weight: 600;
  font-size: 0.9em;
  text-align: center;
  white-space: nowrap;
  display: flex;
  align-items: center;
  gap: 0.5em;
  max-width: 120px;
  justify-content: center;
}

.pie-graph {
  background: var(--light-color);
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
  border-radius: 1em;
  margin-top: 2em;
}

.pie-graph .recharts-layer:focus,
.pie-graph .recharts-sector:focus {
  outline: none !important;
}

.graph-header {
  padding: 1em 1em;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-radius: 1em 1em 0 0;
}

.graph-header h3 {
  font-size: 1em;
  color: var(--dark-color);
  font-weight: 600;
  margin-bottom: 0;
}

.dashed-wrapped {
  background: var(--light-color);
  border-radius: 8px;
  height: 100%;
}

.line-graph .line-graph-body {
  height: 330px;
  padding: 1em;
}

.line-graph {
  font-size: 0.8em;
}

.line-graph .recharts-cartesian-axis-ticks .recharts-text,
.recharts-layer text {
  fill: var(--secondary-color);
  margin-top: 1em !important;
  font-size: 0.8em;
  font-weight: 500;
}

.line-graph .recharts-cartesian-axis-ticks .recharts-xAxis {
  display: none;
}

.pie-cart-frame {
  height: 313px;
  padding: 0.5em;
  margin-top: 1em;
}

/* Wallet page style  */

.wallet-card-wrapped {
  border-radius: 12px;
  padding: 2em;
  background: #efefef;
}

.wallet-sec .wallet-card {
  background: var(--light-color);
  padding: 1.5em;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.15);
  grid-template-columns: 70px auto;
  display: grid;
  align-items: center;
  border-radius: 1em;
}

.wallet-table {
  background-color: rgb(28, 28, 28);
  padding: 2.5rem 4rem;
  border-radius: 1.5rem;
  margin-top: 2em;
}

.wallet-sec .wallet-card .wallet-icon-sec .wallet-icon-img {
  width: 1.5em;
}

.wallet-sec .wallet-card .wallet-icon-sec {
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  border: 0.1rem solid var(--primary-color);
  display: flex;
  align-items: center;
  justify-content: center;
}

.wallet-sec .wallet-card .wallet-info-sec .title {
  font-size: 1.4em;
  color: var(--dark-color);
  font-weight: 600;
  margin-bottom: 0.3em;
}

.wallet-sec .wallet-card .wallet-info-sec .desc {
  font-size: 1rem;
  color: #929191;
  margin-bottom: 0;
  font-weight: 500;
}

.wallet-sec .table thead th {
  color: var(--dark-color);
  font-size: 0.9em;
  font-weight: 600;
}

.wallet-sec .table td {
  white-space: nowrap;
  font-size: 0.85em;
  font-weight: 400;
  color: #929191;
}

.status-icon i {
  color: #28a745;
}

.text-color-10 {
  color: rgb(255, 3, 124) !important;
}

.text-color-11 {
  color: #28a745 !important;
}

.wallet-header-right-sec {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  margin-bottom: 2em;
}

.wallet-tab-sec .nav-link.active {
  border-radius: 1em;
  border-bottom: 4px solid #353751;
  background-color: rgba(53, 55, 81, 0.05) !important;
  color: var(--primary-dark-color) !important;
}

.wallet-tab-sec .nav-link {
  font-size: 1em;
  font-weight: 600;
  color: var(--primary-dark-color);
  color: var(--primary-dark-color) !important;
  border-radius: 12px !important;
  padding: 0.8em 2em;
}

.wallet-tab-sec {
  background: var(--light-color);
  padding: 1.5em;
  border: 1px solid #ccc;
  box-shadow: 0px 0px 2px 0px rgba(0, 0, 0, 0.15);
  border-radius: 1em;
  margin-top: 2em;
}

.table-action-btn {
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 12px !important;
}

.modal-content {
  border: 0 !important;
}

.modal-header .btn-close:focus {
  box-shadow: none !important;
}

.withdarw-modal-sec h3 {
  font-size: 1.2em;
  color: var(--dark-color);
  font-weight: 600;
  margin-bottom: 1em;
}

.withdarw-modal-sec h3 span {
  color: var(--primary-color);
}

.withdraw-btn-sec {
  display: flex;
  align-items: center;
  margin-top: 1em;
}

.wallet-tab-header-sec {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.setting-card-right-frame .pretty.p-switch input:checked ~ .state:before {
  border-color: #fff;
  background: #5fd068;
}

.setting-card-right-frame .pretty.p-switch input:checked ~ .state label:after {
  background-color: #fff !important;
}

.modal-close {
  background-color: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  position: absolute;
  right: 10px;
  top: 10px;
}

.modal-close .close-icon {
  width: 2em;
}

.modal-close:focus {
  box-shadow: none !important;
  outline: none !important;
}

.account-detail-card {
  border-radius: 14px;
  background-repeat: no-repeat;
  background-size: 100% 100%;
  padding: 1.5em;
  display: flex;
  flex-direction: column;
  gap: 1em;
}

.account-card-info {
  display: flex;
  flex-direction: column;
  gap: 0.6em;
}

/* .account-detail-card-first {
  background-image: url("../img/detail-bg1.png");
}

.account-detail-card-second {
  background-image: url("../img/detail-bg2.png");
}

.account-detail-card-third {
  background-image: url("../img/detail-bg3.png");
} */

.account-detail-card h4 {
  margin-bottom: 0;
  font-size: 1em;
  color: var(--dark-color);
  font-weight: 600;
}

.account-detail-card p {
  font-size: 0.75em;
  font-weight: 500;
  color: var(--dark-color);
  margin-bottom: 0.3em !important;
  line-height: 1.5;
}

.account-card-detail {
  display: flex;
  justify-content: space-between;
}

.account-card-icon {
  justify-content: space-between;
  display: flex;
  width: 100%;
}

.account-card-icon .account-icon {
  height: 2em;
}

.page-loader-sec {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
}

.page-loader-img {
  max-width: 6em;
}

.admin-user-profile-card {
  padding: 1em;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  margin-top: 1em;
  border-radius: 12px;
  background: linear-gradient(227.06deg, #7c71ff 10.14%, rgba(0, 0, 0, 0) 90.38%);
}

.admin-user-profile-card h4 {
  font-size: 1em;
  font-weight: 600;
  color: var(--light-color);
  margin-bottom: 0.3em;
}

.admin-user-profile-card p {
  font-size: 0.8em;
  font-weight: 500;
  color: var(--input-placeholder-color);
  margin-bottom: 0.5em;
}

.logout-btn {
  background: linear-gradient(180deg, #ffffff 39.57%, rgb(249 246 246)) !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  padding: 0.5em 1.5em !important;
  color: var(--dark-color) !important;
  border: 1px solid #e9e9e9 !important;
  border-radius: 0.37rem !important;
  text-decoration: none !important;
}

.profile-drop-info p {
  font-size: 0.8em;
  margin-bottom: 0em;
  font-weight: 500;
  color: var(--light-color);
  /* line-height: 1; */
  text-align: left;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 13ch;
}

.efi-bank-header-actions .flag-select__option {
  margin: 6px 0;
}

.profile-drop-info span {
  font-size: 0.8em;
  margin-bottom: 0em;
  font-weight: 400;
  color: #878e96;
  line-height: 1;
  text-align: left;
}

.efi-action-head a {
  border: 0 !important;
  background: var(--primary-gradient) !important;
  color: var(--light-color);
  font-size: 0.95em;
  font-weight: 600;
  /* text-transform: uppercase; */
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
}

.efi-bank-header-actions {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 1em;
}

.no-data-frame {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 2em;
}

.profile-account-user-img-sec {
  position: relative;
}

.profile-account-user-img {
  width: 8em;
  height: 8em;
  border-radius: 50%;
  object-fit: cover;
  border: 1px solid #ccc;
}

.profile-account-user-img-edit-icon input[type="file"] {
  display: none;
}

.profile-account-user-img-edit-icon {
  position: absolute;
  bottom: 0;
  right: 0;
  background: linear-gradient(180deg, #ffffff 39.57%, rgb(249 246 246)) !important;
  border-radius: 50%;
  border: 1px solid #e9e9e9 !important;
  cursor: pointer;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.no-data-found-sec {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: calc(100vh - 300px);
  flex-direction: column;
  gap: 2em;
}

.ml-3 {
  margin-left: 1em;
}

.no-data-found-sec h5 {
  font-size: 1em;
  color: var(--dark-color);
  font-weight: 600;
  margin-bottom: 0;
}

.no-data-found-new-sec {
  display: flex;
  align-items: center;
  justify-content: center;
}

.contact-created-modal .register-phone-input .PhoneInput {
  background: transparent !important;
}

.spinner-loader {
  width: 24px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid transparent;
  border-right-color: var(--light-color);
  animation: l2 1s infinite linear;
  display: flex;
  align-items: center;
  justify-content: center;
}

.spinner-loader-dark {
  width: 24px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid transparent;
  border-right-color: var(--dark-color);
  animation: l2 1s infinite linear;
  display: flex;
  align-items: center;
  justify-content: center;
}

.efi-transation-action .spinner-loader {
  width: 24px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid #efefef;
  border-right-color: #0194ff;
  animation: l2 1s infinite linear;
  display: flex;
  align-items: center;
  justify-content: center;
}

.transaction-btn .spinner-loader {
  width: 24px;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 4px solid #0194ff;
  border-right-color: #fff;
  animation: l2 1s infinite linear;
  display: flex;
  align-items: center;
  justify-content: center;
}

@keyframes l2 {
  to {
    transform: rotate(1turn);
  }
}

.efi-transation-action .download-btn {
  min-width: unset;
  padding: 0.75em 1em !important;
}

.onboarding-auth-header .pretty .state label:before,
.onboarding-auth-header .pretty .state label:after {
  top: 0;
}

.react-joyride__beacon {
  outline: none !important;
  box-shadow: none;
}

.react-joyride__beacon:focus {
  outline: none !important;
  box-shadow: none;
}

.__floater__body button:focus-visible {
  outline: none !important;
}

.tour-step-img {
  max-width: 8em;
  /* margin-top: 1em; */
}

#button-primary:before,
#button-primary:after {
  content: "";
  background: var(--secondary-color) !important;
  height: 2px;
  width: 0;
  position: absolute;
  top: 0;
  right: 0;
  transition: 0.4s ease all;
}

#button-primary:after {
  top: auto;
  right: auto;
  left: 0;
  bottom: 0;
}

#button-primary:hover:before,
#button-primary:hover:after {
  width: 100%;
  transition: 800ms ease all;
}

.tour-step p {
  margin-bottom: 0;
  margin-top: 1em;
  color: #8f9899;
  margin-bottom: 0em;
  font-weight: 300;
  font-size: 0.9em;
  line-height: 1.8;
  word-break: break-word;
  /* display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-all; */
}

.delete-account-modal .change-password-heading {
  text-align: center;
}

.verified-status-badge {
  display: grid;
  grid-template-columns: 30px auto;
  font-size: 0.9em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #3ec05c;
  align-items: center;
}

.pending-status-badge {
  display: grid;
  grid-template-columns: 30px auto;
  font-size: 0.9em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #d9904c;
  align-items: center;
}

.rejected-status-badge {
  display: grid;
  grid-template-columns: 30px auto;
  font-size: 0.9em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #ee404c;
  align-items: center;
}

.helper-pages {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2em;
  margin: auto;
  /* min-height: 100vh; */
}

.no-bot-exists-img {
  max-width: 30em;
}

.efi-feature-account-balance-info {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: space-between;
}

.account-grid-copy {
  display: flex;
  align-items: center;
  gap: 0.3em;
  justify-content: flex-start;
}

.copy-btn-sec {
  display: flex;
  align-items: center;
  gap: 0.3em;
  justify-content: flex-start;
}

.contact-created-modal .change-password-heading {
  text-align: center;
}

.rmdp-range {
  background: linear-gradient(90deg, #0194ff 0%, #0b68b8 100%);
}

.rmdp-day span:hover {
  background-color: var(--primary-color) !important;
}

.rmdp-week-day {
  color: var(--secondary-color) !important;
}

.rmdp-arrow-container .rmdp-arrow {
  border-color: #0194ff !important;
  margin: 0 !important;
}

.rmdp-arrow-container {
  align-items: center;
}

.rmdp-arrow-container:hover {
  background: -webkit-linear-gradient(90deg, #0194ff 0%, #0b68b8 100%);
}

.rmdp-arrow-container:hover .rmdp-arrow {
  border-color: #fff !important;
}

.efi-bank-billing-address-fields .pretty.p-icon input:checked ~ .state label:before,
.efi-bank-billing-address-fields .pretty.p-icon input:indeterminate ~ .state label:before {
  border-color: var(--primary-color);
}

.billing-addres-form .pretty.p-icon input:checked ~ .state label:before,
.billing-addres-form .pretty.p-icon input:indeterminate ~ .state label:before {
  border-color: var(--primary-color);
}

.payment-link-dropdown .dropdown-menu a:hover {
  background-color: var(--overlay-color);
}

.header-search .date-sec .input-group-text {
  cursor: pointer;
}

.profile-account-user-img-edit-icon:hover svg {
  fill: var(--hover-color);
}

.efi-feature-transation-search-frame a:hover {
  color: var(--hover-color);
}

.copy-btn:hover svg {
  stroke: var(--hover-color);
}

.delete-contact-btn-sec {
  display: flex;
  align-items: center;
  gap: 1em;
  justify-content: center;
}

.delete-contact-btn-sec a:hover svg {
  /* fill: var(--hover-color); */
}

.delete-contact-btn-sec a {
  text-decoration: none;
}

.xs-marg-btm {
  margin-bottom: 0.8em;
}

/* business info style */

.list-view-card-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  column-gap: 2em;
}

.list-view-card {
  background: #fcf8ef40;
  border: 1px solid #acb8c240;
  display: flex;
  flex-direction: column;
  padding: 1.5em;
  border-radius: 12px;
  gap: 1.5em;
}

.list-view-card .list-view-card-info {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
}

.list-view-card-info h4 {
  font-size: 0.9em;
  font-weight: 600;
  margin-bottom: 0em;
  color: var(--dark-color);
  line-height: 1.5;
}

.list-view-card-info p {
  font-size: 0.85em;
  font-weight: 300;
  margin-bottom: 0;
  color: var(--text-color);
}

/* New Btn style  */
.efi-primary-btn {
  border: 1px solid transparent !important;
  background: var(--primary-color) !important;
  color: var(--light-color) !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  border-radius: 8px !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
  opacity: 1;
}

.efi-primary-btn:hover {
  opacity: 0.7;
  background: var(--primary-color) !important;
}

.efi-primary-btn.btn-disabled {
  cursor: not-allowed;
  background-color: var(--text-color) !important;
}

.efi-primary-btn.btn-disabled:hover {
  cursor: not-allowed;
  background-color: var(--gray-color) !important;
}

.efi-secondary-btn {
  border: 1px solid transparent !important;
  background: var(--secondary-color) !important;
  color: var(--light-color) !important;
  font-size: 0.95em !important;
  font-weight: 600 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.efi-secondary-btn:hover {
  opacity: 0.7;
}

.efi-overlay-btn {
  border: 0 !important;
  background: var(--overlay-color) !important;
  color: var(--primary-color) !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.efi-overlay-btn:hover {
  /* opacity: 0.7; */
  background: #b9e1ff !important;
}

.efi-delete-btn {
  border: 0 !important;
  background: #ff6a6a20 !important;
  color: #ff6a6a !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.efi-delete-btn:hover {
  /* opacity: 0.7; */
  background: #b9e1ff !important;
}

.efi-edit-btn {
  border: 0 !important;
  background: #2d2c2b10 !important;
  color: #595856 !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.efi-edit-btn:hover {
  /* opacity: 0.7; */
  background: #2d2c2b29 !important;
}

.efi-delete-btn {
  border: 0 !important;
  background: #ff6a6a20 !important;
  color: #ff6a6a !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
}

.efi-delete-btn:hover {
  /* opacity: 0.7; */
  background: #ff6a6a33 !important;
}

/* On boarding Process Style  */
.efi-onboarding-process-card-bar .CircularProgressbar .CircularProgressbar-text {
  fill: var(--secondary-color);
  font-size: 1.6em;
  dominant-baseline: middle;
  text-anchor: middle;
  font-weight: 600;
}

.efi-onboarding-process-card-bar .CircularProgressbar .CircularProgressbar-trail {
  stroke: var(--overlay-color) !important;
}

.efi-onboarding-process-card-bar .CircularProgressbar .CircularProgressbar-path {
  stroke: var(--primary-color) !important;
}

.collapse-close-btn {
  width: 30px;
  height: 30px;
  border-radius: 50% !important;
  background: var(--light-color) !important;
  border: 1px solid #e3e3e3 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 8px !important;
}

.admin-ui-sidebar-collapse {
  position: relative;
  transition: all 2s ease-in;
}

.admin-collapse-btn {
  top: 6%;
  height: auto;
  position: absolute;
  z-index: 99999999;
  /* position: relative; */
  /* width: 100%; */
  right: -14px;
}

.side-wrapped {
  position: relative;
}

.admin-ui-collapse-sidebar .collapse-close-btn svg {
  transform: rotate(180deg);
}

/* .admin-ui-collapse-btn{
  display: none;
} */
/* 
.modal-backdrop {
  z-index: 9999 !important;
}

.modal {
  z-index: 99999 !important;
} */

.backup-code-box {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1em;
}

.backup-code-card {
  background-color: #f9f9fe;
  border-radius: 12px;
  padding: 1em;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.9em;
  font-weight: 600;
  color: var(--secondary-color);
}

.backup-code-modal-sec h3 {
  font-size: 1.2em;
  font-weight: 600;
  color: var(--secondary-color);
  margin-bottom: 1em;
  text-align: center;
}

.backup-code-modal-sec p {
  font-size: 0.85em;
  line-height: 1.8;
  margin-bottom: 1em;
  font-weight: 500;
  color: var(--gray-color);
  text-align: center;
}

.backup-code-btn-sec {
  display: flex;
  justify-content: space-evenly;
  margin-top: 2em;
}

.welcome-onboarding-sec {
  margin-top: 7em !important;
  margin: 2em 2em;
  background: var(--light-color);
  border-radius: 8px;
}

/* table action dropdown */
.table-dropdown button {
  background: #faf4f9 !important;
  border-radius: 50%;
  border: none !important;
  padding: 1em !important;
}

.table-dropdown button:hover {
  background: #faf4f9 !important;
}

.table-dropdown .dropdown-menu.show {
  min-width: 100px !important;
  transform: translate(-40px, 25px) !important;
  padding: 0.5em 0;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
}

.table-dropdown .dropdown-menu.show:after {
  position: none !important;
  content: none !important;
  background: none !important;
  width: none !important;
  height: none !important;
  border-right: none !important;
  border-bottom: none !important;
  z-index: none !important;
}

.table-dropdown .dropdown-menu .dropdown-item {
  font-size: 0.8em;
  font-weight: 500;
  color: var(--quaternary-color);
}

.table-dropdown .dropdown-menu .dropdown-item:hover {
  color: var(--primary-color) !important;
}

.table-dropdown .dropdown-menu .dropdown-item:focus,
.table-dropdown .dropdown-menu .dropdown-item:hover {
  background: none !important;
}

/* beneficiary moudle style */

.beneficiary-from-heading h3 {
  font-size: 1.1em;
  color: var(--dark-color);
  font-weight: 500;
  margin-bottom: 0em;
}

.beneficiary-from-heading {
  margin-bottom: 1.5em;
}

.create-beneficiary-from .form-control {
  font-size: 0.9em;
  color: var(--heading-color);
  /* padding: 1em; */
  height: 45px;
  border-radius: 8px;
}

.create-beneficiary-from textarea.form-control {
  height: auto;
}

.create-beneficiary-from .form-control::placeholder {
  color: #878e96 !important;
}

.create-beneficiary-from .PhoneInput {
  height: 45px !important;
  font-size: 0.85em !important;
  font-weight: 400 !important;
  border: 1px solid #dee2e6 !important;
  border-radius: 8px !important;
  padding: 1em;
}

.create-beneficiary-from .PhoneInputInput {
  border: none;
}

.personal-information-form .PhoneInput {
  border: none !important;
  /* margin-left: 1em; */
}

.personal-information-form .PhoneInputInput {
  border: none;
}

.create-beneficiary-from .form-control:focus {
  box-shadow: none;
  border: 1px solid #dbdbdb;
}

.create-beneficiary-from .form-label {
  font-size: 0.85em;
  color: var(--dark-color);
  font-weight: 500;
}

.create-beneficiary-from .form-label span {
  color: red;
}

.create-beneficiary-from .css-13cymwt-control {
  height: 45px !important;
  font-size: 0.85em !important;
  font-weight: 400 !important;
  border: 1px solid #dde1e6 !important;
  border-radius: 12px !important;
  color: #878e96 !important;
}

.create-beneficiary-from-back {
  display: flex;
  align-items: center;
  gap: 0.8em;
}

.create-beneficiary-from-back h2 {
  font-size: 1.1em;
  font-weight: 500;
  color: var(--dark-color);
  margin-bottom: 0;
}

.create-beneficiary-btn-sec {
  display: flex;
  gap: 1em;
  justify-content: flex-end;
}

.view-beneficiary {
  background: #f7f8f8 !important;
  border-radius: 35px !important;
  border: none !important;
  color: var(--dark-color) !important;
  padding: 0.5em 2em !important;
  font-size: 0.9em !important;
  font-weight: 600 !important;
}

.beneficiary-detail-box {
  margin-top: 2em;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1em;
}

.beneficiary-detail-card {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1em;
  /* background: linear-gradient(100.21deg, #fff5f5 11.25%, #fffbec 100.93%); */
  background: #fcf8ef40;
  border: 1px solid #acb8c240;
  border-radius: 12px;
  padding: 2em;
}

.beneficiary-detail-info h4 {
  color: var(--dark-color);
  font-size: 0.9em;
  font-weight: 600;
  margin-bottom: 0em;
  line-height: 1.5;
}

.beneficiary-detail-info p {
  color: #979ba2;
  margin-bottom: 0.5em;
  font-size: 0.8em;
  font-weight: 500;
}

/* beneficiary moudle  end */

.admin-ui-header-sec.static-page-header {
  width: 100%;
}

img.nationality-icon {
  width: 24px;
  height: 24px;
}

.verification-item input {
  width: 3rem !important;
  height: 3rem;
  font-size: 1.8rem;
  border-radius: 5px;
  border: 1px solid rgba(0, 0, 0, 0.3);
}

a.efi-primary-btn {
  text-decoration: none;
}

.dashboard-skeleton-layout {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1em;
}

.logout-icon {
  max-width: 8em;
  display: flex;
  margin: auto;
}

.admin-ui-sidebar-list li a.active {
  background: linear-gradient(280deg, #298bff 0%, rgba(53, 55, 81, 0.5) 76.84%);
}

.admin-ui-sidebar-list li a.active svg {
  filter: invert(0);
}

.otp-timer p {
  margin-bottom: 0;
  text-align: center;
}

.delete-contact-btn-sec .transaction-btn {
  gap: 0.5em;
}

.static-link-sec p a:hover {
  color: #1d1d38 !important;
}

.resp-mrg-btm-xs.name {
  position: relative !important;
}

.input-group-error.css-1l8uzyq-container {
  /* border-color: #e34f4f !important; */
  /* border: 1px solid #e34f4f !important; */
}

.errorMsg.passwd {
  /* height: 38px !important; */
  top: -34px !important;
}

.input-group-error.password.input-group {
  margin-top: 34px !important;
}

.single-date-picker .rmdp-input {
  cursor: pointer;
}

h4.beneficiary-type {
  text-transform: capitalize;
}

.qoute-currency {
  border: 1px solid #dbdbdb;
  font-size: 0.9em;
  color: var(--heading-color);
  /* padding: 1em; */
  height: 45px;
  display: flex;
  padding: 0em 1em;
  border-radius: 12px !important;
  align-items: center;
  justify-content: center;
  font-weight: 700;
}

.PhoneInputInput:active {
  border: none;
  outline: none;
}

.beneficiary-frame-content .nav-pills {
  gap: 1em !important;
  margin-bottom: 1.5em;
  box-shadow: 0px 1px 0px 0px #eeeeee;
}

.beneficiary-frame-content .nav-link.active {
  background: var(--overlay-color) !important;
  color: var(--primary-color) !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
}

.beneficiary-frame-content .nav-link {
  background: transparent !important;
  color: var(--text-color) !important;
  border: 0 !important;
  font-size: 0.85em !important;
  font-weight: 500 !important;
  border-bottom-left-radius: 0 !important;
  border-bottom-right-radius: 0 !important;
  /* text-transform: uppercase; */
  border-radius: 0px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  /* padding: 0.4em 2em !important; */
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
  border-radius: 8px !important;
}

.PhoneInputInput:focus {
  outline: none !important;
}

.PhoneInputInput:focus-visible {
  outline: none !important;
}

.PhoneInputInput:focus-within {
  outline: none !important;
}

.card-sendmoney-modal .pretty .state label:before,
.card-sendmoney-modal .pretty .state label:after {
  top: 0;
}

.card-sendmoney-modal .pretty label {
  font-size: 0.95em;
  font-weight: 600;
  color: var(--dark-color);
  font-weight: 500;
}

.card-sendmoney-modal .pretty .state label:after,
.card-sendmoney-modal .pretty .state label:before {
  border-radius: 20%;
}

.card-sendmoney-modal .pretty.p-default input:checked ~ .state label:after {
  background-color: var(--button-color) !important;
}

.btn:focus-visible {
  box-shadow: none !important;
}

.btn:focus-within {
  box-shadow: none !important;
}

.account-type-detail {
  text-transform: capitalize;
}

.hide-cursor {
  cursor: none;
}

.no-cursor input {
  caret-color: transparent;
  pointer-events: none;
}

/* .hide-caret input {
  caret-color: transparent;
  animation: blinker 0s linear infinite;
}

@keyframes blinker {
  100% {
    opacity: 0;
  }
}

#date-picker-input{
cursor: none;
animation: blinker 0s linear infinite;
} */

.efi-overlay-btn.onboarding {
  border: 0 !important;
  background: var(--overlay-color) !important;
  color: var(--primary-color) !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  border-radius: 8px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  text-decoration: none !important;
}

.datepicker-wrapper {
  position: relative;
}

.datepicker-dropdown {
  position: absolute;
  top: -300px;
  /* Adjust this value based on the height of your date picker */
  left: 0;
  z-index: 1000;
}

.status-info h5 {
  font-weight: 600;
  font-size: 0.95em;
  line-height: 1.5;
  margin-bottom: 0.3em;
}

.status-info p {
  font-weight: 400;
  font-size: 0.75em;
  line-height: 1.5;
  margin-bottom: 0;
}

.canvasjs-chart-title {
  font-size: 20px;
  font-weight: bold;
  color: #333;
  /* Custom title color */
  display: none !important;
}

.canvasjs-chart-container {
  background-color: #f5f5f5;
  /* Custom background color */
}

.onboarding-handle-img {
  max-width: 399px;
  object-fit: contain;
}

.onboard-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1em;
  min-height: calc(100vh - 250px);
}

.onboard-card-info h5 {
  font-weight: 600;
  color: var(--dark-color);
  font-size: 1.2em;
  line-height: 1.5;
  margin-bottom: 0.3em;
  text-align: center;
}

.onboard-card-info p {
  font-weight: 400;
  color: var(--quaternary-color);
  font-size: 0.85em;
  line-height: 1.8;
  margin-bottom: 0em;
  max-width: 599px;
  text-align: center;
}

.currency-end {
  float: inline-end;
}

.account_type {
  text-transform: capitalize;
}

.view-all {
  text-decoration: none;
  font-size: 0.9em;
  font-weight: 400;
}

.tooltip-btn {
  background: none !important;
  padding: 0 !important;
  border: none !important;
  margin-top: -0.2em;
}

/* Select Custome start  */
.select-items-info {
  display: flex;
  align-items: start;
  justify-content: space-between;
  padding: 5px;
}

.select-items {
  display: flex;
  flex-direction: column;
  gap: 0.5em;
  /* border-bottom: 1px solid #000; */
}

/* Select Custome end  */

.flag-select__btn {
  padding: 2px 8px !important;
}

.flag-select__btn:focus-within {
  border: none;
  outline: none;
}

.flag-select {
  font-size: 0.9em;
  font-weight: 500;
  /* padding-top: 0.4em; */
  padding-right: 1em;
  border: 1px solid var(--dark-color);
  border-radius: 28px;
  padding-bottom: 0 !important;
}

.auth-layout-box {
  position: relative;
}

.language-select-box {
  position: fixed;
  top: 1em;
  right: 1em;
  z-index: 999;
}

.flag-select__options {
  border: none !important;
  /* margin-top: 1em !important; */
  /* margin-left: 1em; */
  padding: 0 !important;
  width: 100%;
  font-size: 1.2em !important;
  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;
}

.flag-select__options li:hover {
  background: #f0f0f0 !important;
}

.flag-select__option {
  padding: 2px 6px 2px 6px !important;
}

.transaction-code {
  /* white-space: nowrap; */
  overflow: hidden;
  text-overflow: ellipsis;
  /* max-width: 13ch; */
  z-index: 9;
}

.download-dropdown .dropdown-toggle {
  background: linear-gradient(180deg, #ffffff 39.57%, rgb(249 246 246));
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* padding: 0.7em 2em !important; */
  color: var(--dark-color) !important;
  border: 1px solid #e9e9e9 !important;
  display: flex !important;
  align-items: center;
  gap: 0.6em;
  border-radius: 8px;
  min-width: unset;
  padding: 0.75em 1em !important;
}

.download-dropdown .dropdown-menu {
  min-width: 6em !important;
  left: -45px !important;
  top: 5px !important;
}

.download-dropdown .dropdown-menu .dropdown-item {
  font-size: 0.85em !important;
  font-weight: 500 !important;
  color: var(--dark-color) !important;
}

.sender-edit-btn-sec,
.delete-sender-btn-sec {
  background: none !important;
  border: 0 !important;
  margin-bottom: 5px !important;
  padding: 3px 5px !important;
  color: #797070 !important;
}

.sender-primary-btn {
  border: 1px solid transparent !important;
  background: red !important;
  color: var(--light-color) !important;
  font-size: 0.95em !important;
  font-weight: 500 !important;
  /* text-transform: uppercase; */
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.5em !important;
  padding: 0.7em 2em !important;
  -moz-transition: all 0.4s ease-in-out;
  -o-transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out !important;
  border-radius: 8px !important;
  position: relative;
  overflow: hidden;
  z-index: 0;
  opacity: 1;
}

.sender-primary-btn:hover {
  opacity: 0.7;
}

.employee-phone .PhoneInput {
  border: 1px solid #dbdbdb !important;
}

.admin-ui-collapse-body .link-scroll {
  max-height: calc(100vh - 120px);
  overflow: overlay;
}

.admin-ui-collapse-body .link-scroll-icon {
  max-height: calc(100vh - 150px);
  overflow: overlay;
}

.admin-ui-collapse-body .link-scroll::-webkit-scrollbar,
.admin-ui-collapse-body .link-scroll-icon::-webkit-scrollbar {
  width: 3px;
}

.admin-ui-collapse-body .link-scroll::-webkit-scrollbar-thumb,
.admin-ui-collapse-body .link-scroll-icon::-webkit-scrollbar-thumb {
  background-color: #ccc;
  border-radius: 0.4rem;
}

.navigate-icons {
  min-height: calc(100vh - 100px) !important;
}

.efi-transation-search .input-group .btn {
  z-index: 0;
}

.flag-select__option__label {
  font-size: 0.9em !important;
}

::-webkit-scrollbar {
  width: 3px;
}

::-webkit-scrollbar {
  background-color: #ccc;
  border-radius: 0.4rem;
}

.efi-bank-billing-address-fields .input-group .input-group-text {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
}

.efi-bank-billing-address-fields .input-group .form-control {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
}
.auth-layout-box .language-select-box {
  z-index: 99 !important;
}

.line-chart-custom-tooltip {
  border: 1px solid var(--primary-color);
  background: var(--overlay-color);
  padding: 1em;
  border-radius: 8px;
  display: flex;
  gap: 0.5em;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.line-chart-custom-tooltip p {
  font-size: 1em !important;
  margin-bottom: 0 !important;
}

.line-chart-custom-tooltip p span {
  font-size: 1em !important;
  font-weight: 700;
  margin-bottom: 0 !important;
}

.no-caret-input {
  caret-color: transparent;
}
.btn-action {
  width: 3em;
  height: 3em;
  padding: 0 !important;
  justify-content: center;
}

.source-of-income-text {
  text-transform: capitalize;
}

.efi-feature-transation-search-frame .efi-transation-search {
  display: flex;
  gap: 1em;
  justify-content: center;
}

.efi-feature-transation-search-frame .efi-transation-search .download-dropdown .dropdown-toggle {
  height: 100%;
}

.note-kyc-manual p {
  color: red;
}

.note-kyc-manual span {
  font-size: 0.9em;
  color: var(--secondary-color);
  line-height: 1.4;
  word-break: break-word;
}

.display-container {
  display: none !important;
}
.enterprise-details {
  display: flex;
}

.affili-benf-tab-wrap .efi-setting-tab .nav-link span {
  background: var(--primary-color);
  color: var(--light-color);
  font-size: 0.75em;
  font-weight: 500;
  padding: 0.5em;
  border-radius: 4px;
}
.affi-contact-from {
  /* padding: 2em; */
}

.slick-next {
  background: url("../img/swipe-right.svg") center center no-repeat !important;
  width: 25px !important;
  height: 25px !important;
  background-size: contain !important;
  z-index: 99 !important;
  right: 20px !important;
  top: 0 !important;
}
.slick-next::before {
  display: none;
}

.slick-prev {
  background: url("../img/swipe-left.svg") center center no-repeat !important;
  width: 25px !important;
  height: 25px !important;
  background-size: contain !important;
  z-index: 99 !important;
  right: 55px !important;
  top: 0 !important;
  left: unset !important;
}
.slick-prev::before {
  display: none;
}

.account-details-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid #f0f0f0 !important;
  padding: 0.8em;
  margin-top: 1em;
  border-radius: 8px;
}

.account-details-box h4 {
  margin-bottom: 0 !important;
  color: #b2b1b1 !important;
  border-radius: 4px;
  display: flex;
  gap: 0.5em;
}
.account-details-box h4 p {
  color: #b2b1b1 !important;
}

.account-details-box p {
  margin-bottom: 0 !important;
}

.table-img {
  width: 2em;
  height: 2em;
  object-fit: contain;
}
.map-teble-card {
  display: grid;
  grid-template-columns: 2em auto;
  align-items: center;
  gap: 1em;
}
.flow-setn {
  font-size: 0.85em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #878e96;
  text-align: center;
}
.fees-card-info {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  align-items: center;
  margin-bottom: 1em;
}
.fees-card-info:last-child {
  margin-bottom: 0;
}
.fees-card {
  padding: 1.5em;
  border-radius: 12px;
  background-color: #f5fbff;
  margin-bottom: 1.5em;
}
.fees-card-info div:first-child {
  font-size: 0.85em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #878e96;
  text-align: start;
}
.fees-card-info div:last-child {
  font-size: 0.8em;
  font-weight: 400;
  margin-bottom: 0em;
  color: #000;
  text-align: end;
}
.fee-action-btn {
  padding: 0.5em 1em !important;
  background-color: var(--overlay-color) !important;
  color: #0194ff !important;
  font-size: 0.85em !important;
  font-weight: 500;
  text-align: center;
  border: 0 !important;
}

.sp-account-details-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1em;
}

.input_error {
  color: red !important;
}