@font-face {
  font-family: "Dubai";
  src: url("/gp/fonts/Dubai-Bold.ttf");
  font-weight: bold;
}

@font-face {
  font-family: "Dubai";
  src: url("/gp/fonts/Dubai-Light.ttf");
  font-weight: light;
}

@font-face {
  font-family: "Dubai";
  src: url("/gp/fonts/Dubai-Medium.ttf");
  font-weight: medium;
}

@font-face {
  font-family: "Dubai";
  src: url("/gp/fonts/Dubai-Regular.ttf");
}

html,
body {
  font-family: Dubai !important;
}

:root {
  --brand-primary: #177db7;
  --brand-secondary: #c09949;
  --brand-tertiary: #999999;
  --brand-quartinary: #cccccc;
  --greyscale-black: #000000;
  --greyscale-white: #ffffff;
  --greyscale-bg: ##edeef1;
  --greyscale-black: #000000;
  --text-primary: #1a1a1a;
  --text-secondary: #575757;
  --text-tertiary: #7f7f7f;
  --text-quartinary: #aeaeae;
  --text-success: #279457;
  --text-warning: #d78b33;
  --text-error: #e13d17;
  --alert-success: #45b275;
  --alert-warning: #ffb35b;
  --alert-error: #ff5b35;
  --alert-bg: #ffded7;
  ---slate-200: #e2e8f0;
  --Field-stroke: #cbd5e1;
  --alert-header-default:#e8f1fe;
}

/* BUTTON START */
.btn-primary {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0px 24px;
  color: var(--greyscale-white, #ffffff);
  background: var(--brand-primary, #177db7);
  border-radius: 8px;
  height: 48px;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.1px;
  border: unset;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:focus-visible {
  color: var(--greyscale-white, #ffffff) !important;
  background: var(--brand-primary, #177db7) !important;
  box-shadow: none !important;
  border: unset !important;
  outline: none;
}
.btn-check:active + .btn-primary,
.btn-check:checked + .btn-primary,
.btn-primary.active,
.btn-primary:active,
.show > .btn-primary.dropdown-toggle {
  color: var(--greyscale-white, #ffffff) !important;
  background-color: var(--brand-primary, #177db7) !important;
  border-color: var(--brand-primary, #177db7) !important;
}

/**BTN SUCCESS */
.btn-success {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0px 24px;
  color: var(--greyscale-white, #ffffff);
  background: var(--alert-succes, #45B275);
  border-radius: 8px;
  height: 48px;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.1px;
  border: unset;
}
.btn-success:hover,
.btn-success:focus,
.btn-success:focus-visible {
  color: var(--greyscale-white, #ffffff) !important;
  background: var(--alert-succes, #45B275) !important;
  box-shadow: none !important;
  border: unset !important;
  outline: none;
}
.btn-check:active + .btn-success,
.btn-check:checked + .btn-success,
.btn-success.active,
.btn-success:active,
.show > .btn-success.dropdown-toggle {
  color: var(--greyscale-white, #ffffff) !important;
  background-color: var(--alert-succes, #45B275) !important;
  border-color: var(--alert-succes, #45B275) !important;
}


/**BTN reject */
.btn-reject {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0px 24px;
  color: var(--greyscale-white, #ffffff);
  background: var(--alert-error, #FF5B35);
  border-radius: 8px;
  height: 48px;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.1px;
  border: unset;
}
.btn-reject:hover,
.btn-reject:focus,
.btn-reject:focus-visible {
  color: var(--greyscale-white, #ffffff) !important;
  background: var(--alert-error, #FF5B35) !important;
  box-shadow: none !important;
  border: unset !important;
  outline: none;
}
.btn-check:active + .btn-reject,
.btn-check:checked + .btn-reject,
.btn-reject.active,
.btn-reject:active,
.show > .btn-reject.dropdown-toggle {
  color: var(--greyscale-white, #ffffff) !important;
  background-color: var(--alert-error, #FF5B35) !important;
  border-color: var(--alert-error, #FF5B35) !important;
}

.btn-outline-primary {
  color: var(--brand-primary, #177db7) !important;
  border: 1px solid var(--brand-primary, #177db7) !important;
  background: var(--greyscale-white, #ffffff) !important;
  border-radius: 8px !important;
  text-align: center !important;
  font-family: Dubai !important;
  font-size: 16px !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 24px; /* 150% */
  letter-spacing: 0.1px;
  padding: 0px 24px !important;
  height: 48px !important;
}

.btn-check:active + .btn-outline-primary,
.btn-check:checked + .btn-outline-primary,
.btn-outline-primary.active,
.btn-outline-primary.dropdown-toggle.show,
.btn-outline-primary:active {
  border-radius: 8px;
  border: 1px solid var(--brand-primary, #177db7);
  background: var(greyscale-white, #ffffff);
}

.btn-outline-secondary {
  color: #000000;
  border-color: #ccc;
  background: #edeef1;
  border-radius: 0px 4px 4px 0px;
  padding: 0px 40px;
  height: 40px;
}

.btn-check:active + .btn-outline-secondary,
.btn-check:checked + .btn-outline-secondary,
.btn-outline-secondary.active,
.btn-outline-secondary.dropdown-toggle.show,
.btn-outline-secondary:active {
  color: #fff;
  background-color: #177db7;
  border-color: #177db7;
}

.btn-check:focus + .btn-outline-secondary,
.btn-outline-secondary:focus,
.btn-outline-primary,
.btn-outline-primary:focus {
  box-shadow: none !important;
}

.btn-secondary {
  padding: 0px 24px;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #177db7;
  color: #177db7;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px; /* 150% */
  letter-spacing: 0.1px;
  display: flex;
  padding: 0px 24px;
  justify-content: center;
  align-items: center;
  height: 48px;
}

.btn-no-outline {
  cursor: pointer;
  color: var(--brand-primary, #177db7) !important;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px; /* 150% */
  letter-spacing: 0.1px;
  outline: none;
  border: unset;
  background: unset;
  white-space: nowrap;
}

/* BUTTON END */

/**TOAST**/
.toast-success {
  border-radius: 4px !important;
  border: 1px solid var(--alert-success, #45b275) !important;
  background: #ddf2e6 !important;
  color: var(--text-primary, #1a1a1a) !important;
  padding: 16px 20px;
}
.toast-error{
  border-radius: 4px;
  border: 1px solid var(--alert-error, #FF5B35);
  background:  var(--alert-bg, #ffded7);
  color: var(--text-primary, #1a1a1a) !important;
  padding: 16px 20px;
}
.toastify-avatar {
  margin-right: 10px;
  margin-left: 0px;
}
/**TOAST END**/
/**ALERT **/
.alert-warning {
  background-color: var(--alert-bg, #ffded7);
  border-radius: 4px;
  border: 1px solid var(--alert-error, #ff5b35);
  padding: 10px 16px;
  width: 100%;
  /* margin: 24px 0px 24px 0px; */
}
.alert-danger{
  background-color: var(--alert-bg, #ffded7);
  border-radius: 4px;
  border: 1px solid var(--alert-error, #ff5b35);
  padding: 10px 16px;
  width: 100%;
}
.alert-info{
  background-color: var(--alert-bg, #ffded7);  
  border: 1px solid #696F83;
  background:#F4F6F9;
  padding: 10px 16px;
  width: 100%;
}

.alert-text {
  color: var(--text-primary, #1a1a1a);
  font-family: Dubai;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}
.alert-error-title {
  color: var(--alert-error, #ff5b35);
  text-transform: uppercase;
  font-family: Dubai;
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px; /* 171.429% */
}

.badge-success {
  border-radius: 4px;
  border: 1px solid var(--alert-success, #45b275);
  background: #E6FEF1;
  text-transform: capitalize;
  color: var(--alert-success, #45b275);
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  padding: 1px 8px;
}

.badge-warning {
  border-radius: 4px;
  border: 1px solid  var(--alert-warning,#FFB35B);
  text-transform: capitalize;
  background: #FFEBD3;
  color: #F28200;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 20px;
  padding: 1px 8px;
  text-align: center;
}

.dataTableStatus  {
	font-family: Dubai;
    font-size: 12px;
    font-style: normal;
    font-weight: 500;
    /* line-height: normal; */
    border-radius: 4px;
    padding: 1px 5px;
    text-transform: capitalize;
}

.dataTableStatus-pendingpay   {
	color: #F28200;
	border-radius: 4px;
	border: 1px solid #FFB35B;
	background: #FFEBD3;
}

.dataTableStatus-failedpay   {
	border-radius: 4px;
	border: 1px solid #ED1C2C;
	background: #FFDDD5;
	color: #ED1C2C;
}

.dataTableStatus-approvalpend {
	border-radius: 4px;
	border: 1px solid #FFB35B;
	background: #FFEBD3;
	color: #F28200;
}

.dataTableStatus-hold {
	color: #1890FF;
	border-radius: 4px;
	border: 1px solid #1890FF;
	background: #E6F7FF;
}

.dataTableStatus-completed  {
	color: #45B275;
	border-radius: 4px;
	border: 1px solid #45B275;
	background: #E6FEF1;
}

.dataTableStatus-expired  {
	color: #1A1A1A;
	border-radius: 4px;
	border: 1px solid #1A1A1A;
	background: #DEE3EA;
}
.dataTableStatus-lost  {
	color: #ED1C2C;
	border-radius: 4px;
	border: 1px solid #ED1C2C;
	background: #FFDDD5;
}

.btn-verify {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0px 24px;
  color: var(--greyscale-white, #ffffff);
  background: #45B275;
  border-radius: 8px;
  height: 48px;
  text-align: center;
  font-family: Dubai;
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.1px;
  border: unset;
}
.confirm-failed-status {
	width: 101px;
    text-align: center;
}

.loading-spinner-container-div {
  width: 30px;
  height: 30px;
  background: url("../../assets/img/ajax-loader.gif") center center no-repeat;
  background-size: contain;
  z-index: 999999;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}