/*!******************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[2]!./node_modules/ngx-toastr/toastr.css?ngGlobalStyle ***!
  \******************************************************************************************************************************************************************************************************************************************/
/* based on angular-toastr css https://github.com/Foxandxss/angular-toastr/blob/cb508fe6801d6b288d3afc525bb40fee1b101650/dist/angular-toastr.css */

/* position */
.toast-center-center {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.toast-top-center {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-center {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-full-width {
  top: 0;
  right: 0;
  width: 100%;
}
.toast-bottom-full-width {
  bottom: 0;
  right: 0;
  width: 100%;
}
.toast-top-left {
  top: 12px;
  left: 12px;
}
.toast-top-right {
  top: 12px;
  right: 12px;
}
.toast-bottom-right {
  right: 12px;
  bottom: 12px;
}
.toast-bottom-left {
  bottom: 12px;
  left: 12px;
}

/* toast styles */
.toast-title {
  font-weight: bold;
}
.toast-message {
  word-wrap: break-word;
}
.toast-message a,
.toast-message label {
  color: #FFFFFF;
}
.toast-message a:hover {
  color: #CCCCCC;
  text-decoration: none;
}
.toast-close-button {
  position: relative;
  right: -0.3em;
  top: -0.3em;
  float: right;
  font-size: 20px;
  font-weight: bold;
  color: #FFFFFF;
  text-shadow: 0 1px 0 #ffffff;
  /* opacity: 0.8; */
}
.toast-close-button:hover,
.toast-close-button:focus {
  color: #000000;
  text-decoration: none;
  cursor: pointer;
  opacity: 0.4;
}
/*Additional properties for button version
 iOS requires the button element instead of an anchor tag.
 If you want the anchor version, it requires `href="#"`.*/
button.toast-close-button {
  padding: 0;
  cursor: pointer;
  background: transparent;
  border: 0;
}
.toast-container {
  pointer-events: none;
  position: fixed;
  z-index: 999999;
}
.toast-container * {
  box-sizing: border-box;
}
.toast-container .ngx-toastr {
  position: relative;
  overflow: hidden;
  margin: 0 0 6px;
  padding: 15px 15px 15px 50px;
  width: 300px;
  border-radius: 3px 3px 3px 3px;
  background-position: 15px center;
  background-repeat: no-repeat;
  background-size: 24px;
  box-shadow: 0 0 12px #999999;
  color: #FFFFFF;
}
.toast-container .ngx-toastr:hover {
  box-shadow: 0 0 12px #000000;
  opacity: 1;
  cursor: pointer;
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/info-circle.svg */
.toast-info {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOS4wNDMgOCA4IDExOS4wODMgOCAyNTZjMCAxMzYuOTk3IDExMS4wNDMgMjQ4IDI0OCAyNDhzMjQ4LTExMS4wMDMgMjQ4LTI0OEM1MDQgMTE5LjA4MyAzOTIuOTU3IDggMjU2IDh6bTAgMTEwYzIzLjE5NiAwIDQyIDE4LjgwNCA0MiA0MnMtMTguODA0IDQyLTQyIDQyLTQyLTE4LjgwNC00Mi00MiAxOC44MDQtNDIgNDItNDJ6bTU2IDI1NGMwIDYuNjI3LTUuMzczIDEyLTEyIDEyaC04OGMtNi42MjcgMC0xMi01LjM3My0xMi0xMnYtMjRjMC02LjYyNyA1LjM3My0xMiAxMi0xMmgxMnYtNjRoLTEyYy02LjYyNyAwLTEyLTUuMzczLTEyLTEydi0yNGMwLTYuNjI3IDUuMzczLTEyIDEyLTEyaDY0YzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MTAwaDEyYzYuNjI3IDAgMTIgNS4zNzMgMTIgMTJ2MjR6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/times-circle.svg */
.toast-error {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTI1NiA4QzExOSA4IDggMTE5IDggMjU2czExMSAyNDggMjQ4IDI0OCAyNDgtMTExIDI0OC0yNDhTMzkzIDggMjU2IDh6bTEyMS42IDMxMy4xYzQuNyA0LjcgNC43IDEyLjMgMCAxN0wzMzggMzc3LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwyNTYgMzEybC02NS4xIDY1LjZjLTQuNyA0LjctMTIuMyA0LjctMTcgMEwxMzQuNCAzMzhjLTQuNy00LjctNC43LTEyLjMgMC0xN2w2NS42LTY1LTY1LjYtNjUuMWMtNC43LTQuNy00LjctMTIuMyAwLTE3bDM5LjYtMzkuNmM0LjctNC43IDEyLjMtNC43IDE3IDBsNjUgNjUuNyA2NS4xLTY1LjZjNC43LTQuNyAxMi4zLTQuNyAxNyAwbDM5LjYgMzkuNmM0LjcgNC43IDQuNyAxMi4zIDAgMTdMMzEyIDI1Nmw2NS42IDY1LjF6Jy8+PC9zdmc+");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/check.svg */
.toast-success {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1MTIgNTEyJyB3aWR0aD0nNTEyJyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTE3My44OTggNDM5LjQwNGwtMTY2LjQtMTY2LjRjLTkuOTk3LTkuOTk3LTkuOTk3LTI2LjIwNiAwLTM2LjIwNGwzNi4yMDMtMzYuMjA0YzkuOTk3LTkuOTk4IDI2LjIwNy05Ljk5OCAzNi4yMDQgMEwxOTIgMzEyLjY5IDQzMi4wOTUgNzIuNTk2YzkuOTk3LTkuOTk3IDI2LjIwNy05Ljk5NyAzNi4yMDQgMGwzNi4yMDMgMzYuMjA0YzkuOTk3IDkuOTk3IDkuOTk3IDI2LjIwNiAwIDM2LjIwNGwtMjk0LjQgMjk0LjQwMWMtOS45OTggOS45OTctMjYuMjA3IDkuOTk3LTM2LjIwNC0uMDAxeicvPjwvc3ZnPg==");
}
/* https://github.com/FortAwesome/Font-Awesome-Pro/blob/master/advanced-options/raw-svg/regular/exclamation-triangle.svg */
.toast-warning {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0naHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmcnIHZpZXdCb3g9JzAgMCA1NzYgNTEyJyB3aWR0aD0nNTc2JyBoZWlnaHQ9JzUxMic+PHBhdGggZmlsbD0ncmdiKDI1NSwyNTUsMjU1KScgZD0nTTU2OS41MTcgNDQwLjAxM0M1ODcuOTc1IDQ3Mi4wMDcgNTY0LjgwNiA1MTIgNTI3Ljk0IDUxMkg0OC4wNTRjLTM2LjkzNyAwLTU5Ljk5OS00MC4wNTUtNDEuNTc3LTcxLjk4N0wyNDYuNDIzIDIzLjk4NWMxOC40NjctMzIuMDA5IDY0LjcyLTMxLjk1MSA4My4xNTQgMGwyMzkuOTQgNDE2LjAyOHpNMjg4IDM1NGMtMjUuNDA1IDAtNDYgMjAuNTk1LTQ2IDQ2czIwLjU5NSA0NiA0NiA0NiA0Ni0yMC41OTUgNDYtNDYtMjAuNTk1LTQ2LTQ2LTQ2em0tNDMuNjczLTE2NS4zNDZsNy40MTggMTM2Yy4zNDcgNi4zNjQgNS42MDkgMTEuMzQ2IDExLjk4MiAxMS4zNDZoNDguNTQ2YzYuMzczIDAgMTEuNjM1LTQuOTgyIDExLjk4Mi0xMS4zNDZsNy40MTgtMTM2Yy4zNzUtNi44NzQtNS4wOTgtMTIuNjU0LTExLjk4Mi0xMi42NTRoLTYzLjM4M2MtNi44ODQgMC0xMi4zNTYgNS43OC0xMS45ODEgMTIuNjU0eicvPjwvc3ZnPg==");
}
.toast-container.toast-top-center .ngx-toastr,
.toast-container.toast-bottom-center .ngx-toastr {
  width: 300px;
  margin-left: auto;
  margin-right: auto;
}
.toast-container.toast-top-full-width .ngx-toastr,
.toast-container.toast-bottom-full-width .ngx-toastr {
  width: 96%;
  margin-left: auto;
  margin-right: auto;
}
.ngx-toastr {
  background-color: #030303;
  pointer-events: auto;
}
.toast-success {
  background-color: #51A351;
}
.toast-error {
  background-color: #BD362F;
}
.toast-info {
  background-color: #2F96B4;
}
.toast-warning {
  background-color: #F89406;
}
.toast-progress {
  position: absolute;
  left: 0;
  bottom: 0;
  height: 4px;
  background-color: #000000;
  opacity: 0.4;
}
/* Responsive Design */
@media all and (max-width: 240px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 11em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 241px) and (max-width: 480px) {
  .toast-container .ngx-toastr.div {
    padding: 8px 8px 8px 50px;
    width: 18em;
  }
  .toast-container .toast-close-button {
    right: -0.2em;
    top: -0.2em;
  }
}
@media all and (min-width: 481px) and (max-width: 768px) {
  .toast-container .ngx-toastr.div {
    padding: 15px 15px 15px 50px;
    width: 25em;
  }
}

/*!**************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[2]!./node_modules/intl-tel-input/build/css/intlTelInput.css?ngGlobalStyle ***!
  \**************************************************************************************************************************************************************************************************************************************************************/
:root {
  --iti-hover-color: rgba(0, 0, 0, 0.05);
  --iti-border-color: #ccc;
  --iti-dialcode-color: #999;
  --iti-dropdown-bg: white;
  --iti-spacer-horizontal: 8px;
  --iti-flag-height: 12px;
  --iti-flag-width: 16px;
  --iti-border-width: 1px;
  --iti-arrow-height: 4px;
  --iti-arrow-width: 6px;
  --iti-triangle-border: calc(var(--iti-arrow-width) / 2);
  --iti-arrow-padding: 6px;
  --iti-arrow-color: #555;
  --iti-path-flags-1x: url('flags.192a00023f40e142.webp');
  --iti-path-flags-2x: url('flags@2x.580decae79f739db.webp');
  --iti-path-globe-1x: url('globe.98e105ca81b63f37.webp');
  --iti-path-globe-2x: url('globe@2x.974df6f829af5e5b.webp');
  --iti-flag-sprite-width: 3904px;
  --iti-flag-sprite-height: 12px;
  --iti-mobile-popup-margin: 30px;
}

.iti {
  position: relative;
  display: inline-block;
}
.iti * {
  box-sizing: border-box;
}
.iti__hide {
  display: none;
}
.iti__v-hide {
  visibility: hidden;
}
.iti__a11y-text {
  width: 1px;
  height: 1px;
  clip: rect(1px, 1px, 1px, 1px);
  overflow: hidden;
  position: absolute;
}
.iti input.iti__tel-input,
.iti input.iti__tel-input[type=text],
.iti input.iti__tel-input[type=tel] {
  position: relative;
  z-index: 0;
  margin: 0 !important;
}
.iti__country-container {
  position: absolute;
  top: 0;
  bottom: 0;
  padding: var(--iti-border-width);
}
.iti__selected-country {
  z-index: 1;
  position: relative;
  display: flex;
  align-items: center;
  height: 100%;
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  font-family: inherit;
  font-size: inherit;
  color: inherit;
  border-radius: 0;
  font-weight: inherit;
  line-height: inherit;
  text-decoration: none;
}
.iti__selected-country-primary {
  display: flex;
  align-items: center;
  height: 100%;
  padding: 0 var(--iti-arrow-padding) 0 var(--iti-spacer-horizontal);
}
.iti__arrow {
  margin-left: var(--iti-arrow-padding);
  width: 0;
  height: 0;
  border-left: var(--iti-triangle-border) solid transparent;
  border-right: var(--iti-triangle-border) solid transparent;
  border-top: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
[dir=rtl] .iti__arrow {
  margin-right: var(--iti-arrow-padding);
  margin-left: 0;
}
.iti__arrow--up {
  border-top: none;
  border-bottom: var(--iti-arrow-height) solid var(--iti-arrow-color);
}
.iti__dropdown-content {
  border-radius: 3px;
  background-color: var(--iti-dropdown-bg);
}
.iti--inline-dropdown .iti__dropdown-content {
  position: absolute;
  z-index: 2;
  margin-top: 3px;
  margin-left: calc(var(--iti-border-width) * -1);
  border: var(--iti-border-width) solid var(--iti-border-color);
  box-shadow: 1px 1px 4px rgba(0, 0, 0, 0.2);
}
.iti__search-input {
  width: 100%;
  border-width: 0;
  border-radius: 3px;
}
.iti__search-input + .iti__country-list {
  border-top: 1px solid var(--iti-border-color);
}
.iti__country-list {
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}
.iti--inline-dropdown .iti__country-list {
  max-height: 185px;
}
.iti--flexible-dropdown-width .iti__country-list {
  white-space: nowrap;
}
@media (max-width: 500px) {
  .iti--flexible-dropdown-width .iti__country-list {
    white-space: normal;
  }
}
.iti__country {
  display: flex;
  align-items: center;
  padding: 8px var(--iti-spacer-horizontal);
  outline: none;
}
.iti__dial-code {
  color: var(--iti-dialcode-color);
}
.iti__country.iti__highlight {
  background-color: var(--iti-hover-color);
}
.iti__country-list .iti__flag, .iti__country-name {
  margin-right: var(--iti-spacer-horizontal);
}
[dir=rtl] .iti__country-list .iti__flag, [dir=rtl] .iti__country-name {
  margin-right: 0;
  margin-left: var(--iti-spacer-horizontal);
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover, .iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])):hover button {
  cursor: pointer;
}
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country-primary:hover,
.iti--allow-dropdown .iti__country-container:not(:has(+ input[disabled])):not(:has(+ input[readonly])) .iti__selected-country:has(+ .iti__dropdown-content:hover) .iti__selected-country-primary {
  background-color: var(--iti-hover-color);
}
.iti .iti__selected-dial-code {
  margin-left: 4px;
}
[dir=rtl] .iti .iti__selected-dial-code {
  margin-left: 0;
  margin-right: 4px;
}
.iti--container {
  position: fixed;
  top: -1000px;
  left: -1000px;
  z-index: 1060;
  padding: var(--iti-border-width);
}
.iti--container:hover {
  cursor: pointer;
}

.iti--fullscreen-popup.iti--container {
  background-color: rgba(0, 0, 0, 0.5);
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  position: fixed;
  padding: var(--iti-mobile-popup-margin);
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.iti--fullscreen-popup .iti__dropdown-content {
  display: flex;
  flex-direction: column;
  max-height: 100%;
  position: relative;
}
.iti--fullscreen-popup .iti__country {
  padding: 10px 10px;
  line-height: 1.5em;
}

.iti__flag {
  --iti-flag-offset: 100px;
  height: var(--iti-flag-height);
  width: var(--iti-flag-width);
  border-radius: 1px;
  box-shadow: 0px 0px 1px 0px #888;
  background-image: var(--iti-path-flags-1x);
  background-repeat: no-repeat;
  background-position: var(--iti-flag-offset) 0;
  background-size: var(--iti-flag-sprite-width) var(--iti-flag-sprite-height);
}

.iti__ac {
  --iti-flag-offset: 0px;
}

.iti__ad {
  --iti-flag-offset: -16px;
}

.iti__ae {
  --iti-flag-offset: -32px;
}

.iti__af {
  --iti-flag-offset: -48px;
}

.iti__ag {
  --iti-flag-offset: -64px;
}

.iti__ai {
  --iti-flag-offset: -80px;
}

.iti__al {
  --iti-flag-offset: -96px;
}

.iti__am {
  --iti-flag-offset: -112px;
}

.iti__ao {
  --iti-flag-offset: -128px;
}

.iti__ar {
  --iti-flag-offset: -144px;
}

.iti__as {
  --iti-flag-offset: -160px;
}

.iti__at {
  --iti-flag-offset: -176px;
}

.iti__au {
  --iti-flag-offset: -192px;
}

.iti__aw {
  --iti-flag-offset: -208px;
}

.iti__ax {
  --iti-flag-offset: -224px;
}

.iti__az {
  --iti-flag-offset: -240px;
}

.iti__ba {
  --iti-flag-offset: -256px;
}

.iti__bb {
  --iti-flag-offset: -272px;
}

.iti__bd {
  --iti-flag-offset: -288px;
}

.iti__be {
  --iti-flag-offset: -304px;
}

.iti__bf {
  --iti-flag-offset: -320px;
}

.iti__bg {
  --iti-flag-offset: -336px;
}

.iti__bh {
  --iti-flag-offset: -352px;
}

.iti__bi {
  --iti-flag-offset: -368px;
}

.iti__bj {
  --iti-flag-offset: -384px;
}

.iti__bl {
  --iti-flag-offset: -400px;
}

.iti__bm {
  --iti-flag-offset: -416px;
}

.iti__bn {
  --iti-flag-offset: -432px;
}

.iti__bo {
  --iti-flag-offset: -448px;
}

.iti__bq {
  --iti-flag-offset: -464px;
}

.iti__br {
  --iti-flag-offset: -480px;
}

.iti__bs {
  --iti-flag-offset: -496px;
}

.iti__bt {
  --iti-flag-offset: -512px;
}

.iti__bw {
  --iti-flag-offset: -528px;
}

.iti__by {
  --iti-flag-offset: -544px;
}

.iti__bz {
  --iti-flag-offset: -560px;
}

.iti__ca {
  --iti-flag-offset: -576px;
}

.iti__cc {
  --iti-flag-offset: -592px;
}

.iti__cd {
  --iti-flag-offset: -608px;
}

.iti__cf {
  --iti-flag-offset: -624px;
}

.iti__cg {
  --iti-flag-offset: -640px;
}

.iti__ch {
  --iti-flag-offset: -656px;
}

.iti__ci {
  --iti-flag-offset: -672px;
}

.iti__ck {
  --iti-flag-offset: -688px;
}

.iti__cl {
  --iti-flag-offset: -704px;
}

.iti__cm {
  --iti-flag-offset: -720px;
}

.iti__cn {
  --iti-flag-offset: -736px;
}

.iti__co {
  --iti-flag-offset: -752px;
}

.iti__cr {
  --iti-flag-offset: -768px;
}

.iti__cu {
  --iti-flag-offset: -784px;
}

.iti__cv {
  --iti-flag-offset: -800px;
}

.iti__cw {
  --iti-flag-offset: -816px;
}

.iti__cx {
  --iti-flag-offset: -832px;
}

.iti__cy {
  --iti-flag-offset: -848px;
}

.iti__cz {
  --iti-flag-offset: -864px;
}

.iti__de {
  --iti-flag-offset: -880px;
}

.iti__dj {
  --iti-flag-offset: -896px;
}

.iti__dk {
  --iti-flag-offset: -912px;
}

.iti__dm {
  --iti-flag-offset: -928px;
}

.iti__do {
  --iti-flag-offset: -944px;
}

.iti__dz {
  --iti-flag-offset: -960px;
}

.iti__ec {
  --iti-flag-offset: -976px;
}

.iti__ee {
  --iti-flag-offset: -992px;
}

.iti__eg {
  --iti-flag-offset: -1008px;
}

.iti__eh {
  --iti-flag-offset: -1024px;
}

.iti__er {
  --iti-flag-offset: -1040px;
}

.iti__es {
  --iti-flag-offset: -1056px;
}

.iti__et {
  --iti-flag-offset: -1072px;
}

.iti__fi {
  --iti-flag-offset: -1088px;
}

.iti__fj {
  --iti-flag-offset: -1104px;
}

.iti__fk {
  --iti-flag-offset: -1120px;
}

.iti__fm {
  --iti-flag-offset: -1136px;
}

.iti__fo {
  --iti-flag-offset: -1152px;
}

.iti__fr {
  --iti-flag-offset: -1168px;
}

.iti__ga {
  --iti-flag-offset: -1184px;
}

.iti__gb {
  --iti-flag-offset: -1200px;
}

.iti__gd {
  --iti-flag-offset: -1216px;
}

.iti__ge {
  --iti-flag-offset: -1232px;
}

.iti__gf {
  --iti-flag-offset: -1248px;
}

.iti__gg {
  --iti-flag-offset: -1264px;
}

.iti__gh {
  --iti-flag-offset: -1280px;
}

.iti__gi {
  --iti-flag-offset: -1296px;
}

.iti__gl {
  --iti-flag-offset: -1312px;
}

.iti__gm {
  --iti-flag-offset: -1328px;
}

.iti__gn {
  --iti-flag-offset: -1344px;
}

.iti__gp {
  --iti-flag-offset: -1360px;
}

.iti__gq {
  --iti-flag-offset: -1376px;
}

.iti__gr {
  --iti-flag-offset: -1392px;
}

.iti__gt {
  --iti-flag-offset: -1408px;
}

.iti__gu {
  --iti-flag-offset: -1424px;
}

.iti__gw {
  --iti-flag-offset: -1440px;
}

.iti__gy {
  --iti-flag-offset: -1456px;
}

.iti__hk {
  --iti-flag-offset: -1472px;
}

.iti__hn {
  --iti-flag-offset: -1488px;
}

.iti__hr {
  --iti-flag-offset: -1504px;
}

.iti__ht {
  --iti-flag-offset: -1520px;
}

.iti__hu {
  --iti-flag-offset: -1536px;
}

.iti__id {
  --iti-flag-offset: -1552px;
}

.iti__ie {
  --iti-flag-offset: -1568px;
}

.iti__il {
  --iti-flag-offset: -1584px;
}

.iti__im {
  --iti-flag-offset: -1600px;
}

.iti__in {
  --iti-flag-offset: -1616px;
}

.iti__io {
  --iti-flag-offset: -1632px;
}

.iti__iq {
  --iti-flag-offset: -1648px;
}

.iti__ir {
  --iti-flag-offset: -1664px;
}

.iti__is {
  --iti-flag-offset: -1680px;
}

.iti__it {
  --iti-flag-offset: -1696px;
}

.iti__je {
  --iti-flag-offset: -1712px;
}

.iti__jm {
  --iti-flag-offset: -1728px;
}

.iti__jo {
  --iti-flag-offset: -1744px;
}

.iti__jp {
  --iti-flag-offset: -1760px;
}

.iti__ke {
  --iti-flag-offset: -1776px;
}

.iti__kg {
  --iti-flag-offset: -1792px;
}

.iti__kh {
  --iti-flag-offset: -1808px;
}

.iti__ki {
  --iti-flag-offset: -1824px;
}

.iti__km {
  --iti-flag-offset: -1840px;
}

.iti__kn {
  --iti-flag-offset: -1856px;
}

.iti__kp {
  --iti-flag-offset: -1872px;
}

.iti__kr {
  --iti-flag-offset: -1888px;
}

.iti__kw {
  --iti-flag-offset: -1904px;
}

.iti__ky {
  --iti-flag-offset: -1920px;
}

.iti__kz {
  --iti-flag-offset: -1936px;
}

.iti__la {
  --iti-flag-offset: -1952px;
}

.iti__lb {
  --iti-flag-offset: -1968px;
}

.iti__lc {
  --iti-flag-offset: -1984px;
}

.iti__li {
  --iti-flag-offset: -2000px;
}

.iti__lk {
  --iti-flag-offset: -2016px;
}

.iti__lr {
  --iti-flag-offset: -2032px;
}

.iti__ls {
  --iti-flag-offset: -2048px;
}

.iti__lt {
  --iti-flag-offset: -2064px;
}

.iti__lu {
  --iti-flag-offset: -2080px;
}

.iti__lv {
  --iti-flag-offset: -2096px;
}

.iti__ly {
  --iti-flag-offset: -2112px;
}

.iti__ma {
  --iti-flag-offset: -2128px;
}

.iti__mc {
  --iti-flag-offset: -2144px;
}

.iti__md {
  --iti-flag-offset: -2160px;
}

.iti__me {
  --iti-flag-offset: -2176px;
}

.iti__mf {
  --iti-flag-offset: -2192px;
}

.iti__mg {
  --iti-flag-offset: -2208px;
}

.iti__mh {
  --iti-flag-offset: -2224px;
}

.iti__mk {
  --iti-flag-offset: -2240px;
}

.iti__ml {
  --iti-flag-offset: -2256px;
}

.iti__mm {
  --iti-flag-offset: -2272px;
}

.iti__mn {
  --iti-flag-offset: -2288px;
}

.iti__mo {
  --iti-flag-offset: -2304px;
}

.iti__mp {
  --iti-flag-offset: -2320px;
}

.iti__mq {
  --iti-flag-offset: -2336px;
}

.iti__mr {
  --iti-flag-offset: -2352px;
}

.iti__ms {
  --iti-flag-offset: -2368px;
}

.iti__mt {
  --iti-flag-offset: -2384px;
}

.iti__mu {
  --iti-flag-offset: -2400px;
}

.iti__mv {
  --iti-flag-offset: -2416px;
}

.iti__mw {
  --iti-flag-offset: -2432px;
}

.iti__mx {
  --iti-flag-offset: -2448px;
}

.iti__my {
  --iti-flag-offset: -2464px;
}

.iti__mz {
  --iti-flag-offset: -2480px;
}

.iti__na {
  --iti-flag-offset: -2496px;
}

.iti__nc {
  --iti-flag-offset: -2512px;
}

.iti__ne {
  --iti-flag-offset: -2528px;
}

.iti__nf {
  --iti-flag-offset: -2544px;
}

.iti__ng {
  --iti-flag-offset: -2560px;
}

.iti__ni {
  --iti-flag-offset: -2576px;
}

.iti__nl {
  --iti-flag-offset: -2592px;
}

.iti__no {
  --iti-flag-offset: -2608px;
}

.iti__np {
  --iti-flag-offset: -2624px;
}

.iti__nr {
  --iti-flag-offset: -2640px;
}

.iti__nu {
  --iti-flag-offset: -2656px;
}

.iti__nz {
  --iti-flag-offset: -2672px;
}

.iti__om {
  --iti-flag-offset: -2688px;
}

.iti__pa {
  --iti-flag-offset: -2704px;
}

.iti__pe {
  --iti-flag-offset: -2720px;
}

.iti__pf {
  --iti-flag-offset: -2736px;
}

.iti__pg {
  --iti-flag-offset: -2752px;
}

.iti__ph {
  --iti-flag-offset: -2768px;
}

.iti__pk {
  --iti-flag-offset: -2784px;
}

.iti__pl {
  --iti-flag-offset: -2800px;
}

.iti__pm {
  --iti-flag-offset: -2816px;
}

.iti__pr {
  --iti-flag-offset: -2832px;
}

.iti__ps {
  --iti-flag-offset: -2848px;
}

.iti__pt {
  --iti-flag-offset: -2864px;
}

.iti__pw {
  --iti-flag-offset: -2880px;
}

.iti__py {
  --iti-flag-offset: -2896px;
}

.iti__qa {
  --iti-flag-offset: -2912px;
}

.iti__re {
  --iti-flag-offset: -2928px;
}

.iti__ro {
  --iti-flag-offset: -2944px;
}

.iti__rs {
  --iti-flag-offset: -2960px;
}

.iti__ru {
  --iti-flag-offset: -2976px;
}

.iti__rw {
  --iti-flag-offset: -2992px;
}

.iti__sa {
  --iti-flag-offset: -3008px;
}

.iti__sb {
  --iti-flag-offset: -3024px;
}

.iti__sc {
  --iti-flag-offset: -3040px;
}

.iti__sd {
  --iti-flag-offset: -3056px;
}

.iti__se {
  --iti-flag-offset: -3072px;
}

.iti__sg {
  --iti-flag-offset: -3088px;
}

.iti__sh {
  --iti-flag-offset: -3104px;
}

.iti__si {
  --iti-flag-offset: -3120px;
}

.iti__sj {
  --iti-flag-offset: -3136px;
}

.iti__sk {
  --iti-flag-offset: -3152px;
}

.iti__sl {
  --iti-flag-offset: -3168px;
}

.iti__sm {
  --iti-flag-offset: -3184px;
}

.iti__sn {
  --iti-flag-offset: -3200px;
}

.iti__so {
  --iti-flag-offset: -3216px;
}

.iti__sr {
  --iti-flag-offset: -3232px;
}

.iti__ss {
  --iti-flag-offset: -3248px;
}

.iti__st {
  --iti-flag-offset: -3264px;
}

.iti__sv {
  --iti-flag-offset: -3280px;
}

.iti__sx {
  --iti-flag-offset: -3296px;
}

.iti__sy {
  --iti-flag-offset: -3312px;
}

.iti__sz {
  --iti-flag-offset: -3328px;
}

.iti__tc {
  --iti-flag-offset: -3344px;
}

.iti__td {
  --iti-flag-offset: -3360px;
}

.iti__tg {
  --iti-flag-offset: -3376px;
}

.iti__th {
  --iti-flag-offset: -3392px;
}

.iti__tj {
  --iti-flag-offset: -3408px;
}

.iti__tk {
  --iti-flag-offset: -3424px;
}

.iti__tl {
  --iti-flag-offset: -3440px;
}

.iti__tm {
  --iti-flag-offset: -3456px;
}

.iti__tn {
  --iti-flag-offset: -3472px;
}

.iti__to {
  --iti-flag-offset: -3488px;
}

.iti__tr {
  --iti-flag-offset: -3504px;
}

.iti__tt {
  --iti-flag-offset: -3520px;
}

.iti__tv {
  --iti-flag-offset: -3536px;
}

.iti__tw {
  --iti-flag-offset: -3552px;
}

.iti__tz {
  --iti-flag-offset: -3568px;
}

.iti__ua {
  --iti-flag-offset: -3584px;
}

.iti__ug {
  --iti-flag-offset: -3600px;
}

.iti__us {
  --iti-flag-offset: -3616px;
}

.iti__uy {
  --iti-flag-offset: -3632px;
}

.iti__uz {
  --iti-flag-offset: -3648px;
}

.iti__va {
  --iti-flag-offset: -3664px;
}

.iti__vc {
  --iti-flag-offset: -3680px;
}

.iti__ve {
  --iti-flag-offset: -3696px;
}

.iti__vg {
  --iti-flag-offset: -3712px;
}

.iti__vi {
  --iti-flag-offset: -3728px;
}

.iti__vn {
  --iti-flag-offset: -3744px;
}

.iti__vu {
  --iti-flag-offset: -3760px;
}

.iti__wf {
  --iti-flag-offset: -3776px;
}

.iti__ws {
  --iti-flag-offset: -3792px;
}

.iti__xk {
  --iti-flag-offset: -3808px;
}

.iti__ye {
  --iti-flag-offset: -3824px;
}

.iti__yt {
  --iti-flag-offset: -3840px;
}

.iti__za {
  --iti-flag-offset: -3856px;
}

.iti__zm {
  --iti-flag-offset: -3872px;
}

.iti__zw {
  --iti-flag-offset: -3888px;
}

.iti__globe {
  background-image: var(--iti-path-globe-1x);
  background-size: contain;
  background-position: right;
  box-shadow: none;
  height: 19px;
}

@media (min-resolution: 2x) {
  .iti__flag {
    background-image: var(--iti-path-flags-2x);
  }
  .iti__globe {
    background-image: var(--iti-path-globe-2x);
  }
}
/*!*************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].rules[0].oneOf[0].use[2]!./src/assets/fonts/roboto/roboto300-500.css?ngGlobalStyle ***!
  \*************************************************************************************************************************************************************************************************************************************************/
@font-face {
  font-family: 'Roboto';
  src: url('/assets/fonts/roboto/Roboto-Light.woff2') format('woff2'),
       url('/assets/fonts/roboto/Roboto-Light.woff') format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Roboto';
  src: url('/assets/fonts/roboto/Roboto-Medium.woff2') format('woff2'),
       url('/assets/fonts/roboto/Roboto-Medium.woff') format('woff');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/*!***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[5].rules[0].oneOf[0].use[2]!./node_modules/resolve-url-loader/index.js??ruleSet[1].rules[5].rules[1].use[0]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[5].rules[1].use[1]!./src/styles.scss?ngGlobalStyle ***!
  \***********************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
@font-face {
  font-family: "Material Icons";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('material-icons.59322316b3fd6063.woff2') format("woff2"), url('material-icons.4ad034d2c499d9b6.woff') format("woff");
}
.material-icons {
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

@font-face {
  font-family: "Material Icons Outlined";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('material-icons-outlined.f86cb7b0aa53f0fe.woff2') format("woff2"), url('material-icons-outlined.78a93b2079680a08.woff') format("woff");
}
.material-icons-outlined {
  font-family: "Material Icons Outlined";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

@font-face {
  font-family: "Material Icons Round";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('material-icons-round.b10ec9db5b7fbc74.woff2') format("woff2"), url('material-icons-round.92dc7ca2f4c591e7.woff') format("woff");
}
.material-icons-round {
  font-family: "Material Icons Round";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

@font-face {
  font-family: "Material Icons Sharp";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('material-icons-sharp.3885863ee4746422.woff2') format("woff2"), url('material-icons-sharp.a71cb2bf66c604de.woff') format("woff");
}
.material-icons-sharp {
  font-family: "Material Icons Sharp";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

@font-face {
  font-family: "Material Icons Two Tone";
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('material-icons-two-tone.675bd578bd14533e.woff2') format("woff2"), url('material-icons-two-tone.588d63134de807a7.woff') format("woff");
}
.material-icons-two-tone {
  font-family: "Material Icons Two Tone";
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "liga";
}

.glide {
  position: relative;
  width: 100%;
  box-sizing: border-box;
}
.glide * {
  box-sizing: inherit;
}
.glide__track {
  overflow: hidden;
}
.glide__slides {
  position: relative;
  width: 100%;
  list-style: none;
  backface-visibility: hidden;
  transform-style: preserve-3d;
  touch-action: pan-Y;
  overflow: hidden;
  margin: 0;
  padding: 0;
  white-space: nowrap;
  display: flex;
  flex-wrap: nowrap;
  will-change: transform;
}
.glide__slides--dragging {
  -webkit-user-select: none;
          user-select: none;
}
.glide__slide {
  width: 100%;
  height: 100%;
  flex-shrink: 0;
  white-space: normal;
  -webkit-user-select: none;
          user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
.glide__slide a {
  -webkit-user-select: none;
          user-select: none;
  -webkit-user-drag: none;
  -moz-user-select: none;
  -ms-user-select: none;
}
.glide__arrows {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
          user-select: none;
}
.glide__bullets {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
          user-select: none;
}
.glide--rtl {
  direction: rtl;
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
:root {
  --primaryBtn: #ffffff;
  --titleColor: #ffffff;
  --blue-600: #204868;
  --whiteColor: #ffffff;
  --titleSubColor: #ffffff;
  --fieldWrapperBg: rgba(255, 255, 255, 0.0196078431);
  --fieldWrapperBdr: rgba(255, 255, 255, 0.2);
  --subTitle: rgba(255, 255, 255, 0.8);
  --radioBtnCircle: #0281e4;
  --holderFormBdr: rgba(255, 255, 255, 0.3019607843);
  --holderDetailsColorMobile: #253846;
  --holderDetailsColorDesktop: rgba(255, 255, 255, 0.0509803922);
  --holderOptionsColorMobile: rgba(20, 20, 20, 0.6);
  --holderOptionsColorDesktop: transparent;
  --hoverColor: rgba(2, 129, 228, 0.2);
  --lightBlueColor: #0c41ff;
  --sliderColor: rgba(2, 129, 228, 0.6);
  --folioListFoundBdr: rgba(0, 133, 235, 0.2);
  --folioListFoundColor: rgba(0, 133, 235, 0.1490196078);
  --orderSummary: #0f3a5c;
  --contentSectionMobile: #1c1f21;
  --contentSectionDesktop: transparent;
  --matOptionBdr: rgba(0, 0, 0, 0.1019607843);
  --folioDetailsRadio: rgba(255, 255, 255, 0.5019607843);
  --folioView: #021423;
  --folioViewBdr: rgba(255, 255, 255, 0.2);
}

.dark-theme {
  --primaryBtn: #e6ad53;
  --titleColor: #ffffff;
  --blue-600: #e6ad53;
  --whiteColor: #000000;
  --titleSubColor: #e6ad53;
  --fieldWrapperBg: rgba(255, 255, 255, 0.0588235294);
  --fieldWrapperBdr: rgba(230, 173, 83, 0.4);
  --radioBtnCircle: #e6ad53;
  --holderFormBdr: rgba(230, 173, 83, 0.3019607843);
  --holderDetailsColorMobile: rgba(255, 255, 255, 0.0705882353);
  --holderDetailsColorDesktop: rgba(255, 255, 255, 0.0705882353);
  --holderOptionsColorMobile: rgba(255, 255, 255, 0.0705882353);
  --holderOptionsColorDesktop: rgba(255, 255, 255, 0.0705882353);
  --hoverColor: rgba(230, 173, 83, 0.2);
  --lightBlueColor: #e6ad53;
  --sliderColor: #e6ad53;
  --folioListFoundBdr: rgba(230, 173, 83, 0.5019607843);
  --folioListFoundColor: rgba(230, 173, 83, 0.1019607843);
  --orderSummary: rgba(255, 255, 255, 0.1215686275);
  --contentSectionMobile: linear-gradient(to left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0));
  --contentSectionDesktop: linear-gradient(to left top, rgba(255, 255, 255, 0), rgba(186, 186, 186, 0.1019607843) 40%, rgba(255, 255, 255, 0) 70%, rgba(0, 0, 0, 0) 40%);
  --matOptionBdr: rgba(230, 173, 83, 0.5098039216);
  --folioDetailsRadio: transparent;
  --folioView: transparent;
  --folioViewBdr: rgba(230, 173, 83, 0.5019607843);
}

/* --------------------------*/
/* Start : Global Variable   */
/* --------------------------*/
/* --------------------------*/
/* End   : Global Variable   */
/* --------------------------*/
/* ----------------------*/
/* Start : Font family   */
/* ----------------------*/
/* ----------------------*/
/* End   : Font family   */
/* ----------------------*/
/* -----------------*/
/* Start : Colors   */
/* -----------------*/
/* -----------------*/
/* End   : Colors   */
/* -----------------*/
/* --------------------*/
/* Start : Font Path   */
/* --------------------*/
/* --------------------*/
/* End   : Font Path   */
/* --------------------*/
/* ----------------------*/
/* Start : Image Path    */
/* ----------------------*/
/* ----------------------*/
/* End   : Image Path    */
/* ----------------------*/
/* ----------------------------*/
/* Start : Convert px to rem   */
/* ----------------------------*/
/* ----------------------------*/
/* End   : Convert px to rem   */
/* ----------------------------*/
/* ----------------------------*/
/* Start : Convert px to rem   */
/* ----------------------------*/
/* ----------------------------*/
/* End   : Convert px to rem   */
/* ----------------------------*/
/* -------------------------- */
/* Start : Generate Font Size */
/* -------------------------- */
/* ------------------------ */
/* End : Generate Font Size */
/* ------------------------ */
.bank-details__wrapper, .minor__header, .minor-docs, .minor-docs__wrapper, .minor-docs__left, .minor-docs__left > ul, .holder, .holder-wrapper, .holder__content, .holder__options, .holder__tax-dob, .holder__gender, .holder__others, .holder__net-worth-wrapper, .transaction__content, .transaction__title, .transaction__steps, .transaction__details, .transaction__cards, .card-details, .distributor__details {
  display: flex;
  flex-direction: column;
}

.bank-details__success, .verification__failed, .bank-edit, .minor-docs__left > ul > li, .doc-details__wrapper, .doc-details__uploaded, .holder__types, .transaction__urn > div, .field-wrapper, .field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix, .country-code--selected {
  display: flex;
  align-items: center;
}

.minor-docs__right > .upload-doc, .holder__details > .button-transparent, .holder__add-another, .holder__remove, .slider:before, .mobile-number-isd, .button-icon {
  display: flex;
  align-items: center;
  justify-content: center;
}

.bank-details__header, .doc, .doc__wrapper, .holder__details {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.transaction__urn > div > .button-transparent, .transaction__steps > ul > li::before, .field-select mat-select .mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper {
  display: grid;
  place-items: center;
}

div.mat-mdc-select-panel::-webkit-scrollbar {
  width: 5px;
  background: hsl(0, 0%, 96%);
  border-radius: 10px;
}
div.mat-mdc-select-panel::-webkit-scrollbar-thumb {
  border-radius: 10px;
  -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.4);
  background: #0281e4;
}

.transaction {
  height: calc(100dvh - 110px);
  overflow-y: scroll;
}
@media screen and (min-width: 768px) {
  .transaction {
    background: transparent;
  }
}
.transaction::-webkit-scrollbar {
  width: 0;
}

.nominees-added__wrapper > h2, .nominees-added__details div, .table-wrapper > table > thead > tr > th, .table-wrapper > table > tbody > tr > td, .transaction__title > h1, .transaction__title > p, .transaction__description, .distributor__msg, .distributor__details > span {
  text-align: center;
}

.transaction__title > h1 {
  font-size: calc(2rem + 16 * (100vw - 20rem) / 1120);
  line-height: 48px;
}
@media screen and (min-width: 576px) {
  .transaction__title > h1 {
    text-align: center;
  }
}
.transaction__title > h1 > span {
  color: var(--titleSubColor);
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
html {
  box-sizing: border-box;
  font-size: 14px;
  color-scheme: light dark;
}
@media screen and (min-width: 768px) {
  html {
    font-size: 15px;
  }
}
@media screen and (min-width: 1200px) {
  html {
    font-size: 16px;
  }
}

body {
  background: linear-gradient(to bottom, #022440, #021524, #020202);
  color: #ffffff;
  font-size: 1rem;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  body {
    background: radial-gradient(123.83% 123.83% at 50% -52.44%, #0281e4 0%, #020202 100%);
  }
}
body.dark-theme {
  width: 100vw;
  height: 100dvh;
  background: url(/assets/images/bg-img.png) no-repeat center center/cover;
}

*,
*::before,
*::after {
  padding: 0;
  margin: 0;
  box-sizing: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ol,
ul,
figure,
blockquote {
  padding: 0;
  margin: 0;
  font-weight: 400;
}

img,
picture,
svg {
  max-width: 100%;
  width: auto;
  height: auto;
}

button {
  cursor: pointer;
}

/* ---------------------------*/
/* Start : Playfair Display   */
/* ---------------------------*/
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-Italic.444a15d68112ed12.woff2') format("woff2"), url('PlayfairDisplay-Italic.4dd3f7807d2aa5db.woff') format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-Regular.58b390c5623537fe.woff2') format("woff2"), url('PlayfairDisplay-Regular.ace27a58b156cb6c.woff') format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-Medium.60c52048b1d9a1ed.woff2') format("woff2"), url('PlayfairDisplay-Medium.1eb6ef7f9af6ca09.woff') format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-MediumItalic.69d11a0e635807ee.woff2') format("woff2"), url('PlayfairDisplay-MediumItalic.5f694ea0c987291e.woff') format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-SemiBold.c91f3a8aa9878966.woff2') format("woff2"), url('PlayfairDisplay-SemiBold.a8cd8f683477b4b8.woff') format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-SemiBoldItalic.a51865b30043d614.woff2') format("woff2"), url('PlayfairDisplay-SemiBoldItalic.16c443cc8d55ab5e.woff') format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-ExtraBoldItalic.54ba4dc70179d849.woff2') format("woff2"), url('PlayfairDisplay-ExtraBoldItalic.c086df1cd6de512d.woff') format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-BoldItalic.c364ebfdfa04748a.woff2') format("woff2"), url('PlayfairDisplay-BoldItalic.7aa769187b6b6dc2.woff') format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-ExtraBold.4c23d39ac7ee73f0.woff2') format("woff2"), url('PlayfairDisplay-ExtraBold.71af213e8e07598b.woff') format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-Bold.be6dc8027c33f77e.woff2') format("woff2"), url('PlayfairDisplay-Bold.ae25a4e8c298b643.woff') format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-BlackItalic.75c113ceaf7b6d2b.woff2') format("woff2"), url('PlayfairDisplay-BlackItalic.fde1661c578bf8fe.woff') format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url('PlayfairDisplay-Black.5c5cad8c4af05b04.woff2') format("woff2"), url('PlayfairDisplay-Black.78c515fba8d1b871.woff') format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
/* ---------------------------*/
/* End   : Playfair Display   */
/* ---------------------------*/
/* ------------------*/
/* Start : Poppins   */
/* ------------------*/
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Thin.336f55f0a31b4641.woff2') format("woff2"), url('Poppins-Thin.487b250d871914d4.woff') format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-ThinItalic.f52bb8cfe35cfa75.woff2') format("woff2"), url('Poppins-ThinItalic.ee24470b849b4a7f.woff') format("woff");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-ExtraLight.961fa4579429d9bf.woff2') format("woff2"), url('Poppins-ExtraLight.a8958857f0cf74a4.woff') format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-ExtraLightItalic.1d8a9cfad0a25e6c.woff2') format("woff2"), url('Poppins-ExtraLightItalic.77f8a3fbbd7f0d6a.woff') format("woff");
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-LightItalic.2ae41c23196158c9.woff2') format("woff2"), url('Poppins-LightItalic.8867bd4ea25724ee.woff') format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Light.4dc90cc018d36309.woff2') format("woff2"), url('Poppins-Light.b4200b4ebfe2726d.woff') format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Regular.ec9d8e7cf8239536.woff2') format("woff2"), url('Poppins-Regular.aaea7ff1d3e71b3e.woff') format("woff");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Italic.9c80bb9e07b5996f.woff2') format("woff2"), url('Poppins-Italic.56688a678a34703a.woff') format("woff");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Medium.f26573e711e2ef26.woff2') format("woff2"), url('Poppins-Medium.1c4c6847c6bb2fdb.woff') format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-MediumItalic.4620400825e196e3.woff2') format("woff2"), url('Poppins-MediumItalic.a6bbe2bf6e5116fd.woff') format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-SemiBold.877aa36877d67524.woff2') format("woff2"), url('Poppins-SemiBold.a9463670f184fb22.woff') format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-SemiBoldItalic.38879ad63274c1d0.woff2') format("woff2"), url('Poppins-SemiBoldItalic.cfe64fdbb9732d52.woff') format("woff");
  font-weight: 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Bold.9888d6114eada38a.woff2') format("woff2"), url('Poppins-Bold.ab377f9c71a49f9d.woff') format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-ExtraBold.00539afe19ce4928.woff2') format("woff2"), url('Poppins-ExtraBold.865d8a42bdd520b4.woff') format("woff");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-BoldItalic.09500380fc55cc8f.woff2') format("woff2"), url('Poppins-BoldItalic.bb5cf8cd4e165776.woff') format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-ExtraBoldItalic.8da5637fc41831af.woff2') format("woff2"), url('Poppins-ExtraBoldItalic.f84204d2ec2f025f.woff') format("woff");
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-Black.df49989c4ae314e1.woff2') format("woff2"), url('Poppins-Black.c02a46aaaac8119c.woff') format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Poppins";
  src: url('Poppins-BlackItalic.d70cd31b73917fec.woff2') format("woff2"), url('Poppins-BlackItalic.02d9d248932575b7.woff') format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
/* ------------------*/
/* End   : Poppins   */
/* ------------------*/
/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.button {
  width: 100%;
  padding: 18px 10px;
  border-radius: 50px;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 0.875rem;
  cursor: pointer;
  white-space: nowrap;
  text-transform: uppercase;
  -webkit-user-select: none;
          user-select: none;
  transition: all 500ms;
}
.button:focus-visible {
  outline: 0;
}
.button--height {
  padding: 8px 5px;
}
.button:focus-visible > svg > path, .button:hover > svg > path {
  fill: #ffffff;
  transition: fill 500ms;
}
.button-primary {
  border: 1px solid var(--primaryBtn);
  background: var(--primaryBtn);
  color: #030404;
}
.button-primary:focus-visible, .button-primary:hover {
  border: 1px solid var(--primaryBtn);
  background: #030404;
  color: var(--primaryBtn);
}
.button-secondary {
  border: 1px solid #0281e4;
  background: #0281e4;
  color: #ffffff;
}
.button-secondary:focus-visible, .button-secondary:hover {
  border: 1px solid #0281e4;
  background: #ffffff;
  color: #0281e4;
}
.button-tertiary {
  border: 1px solid #ffffff;
  background: #141414;
  color: #ffffff;
}
.button-tertiary:focus-visible, .button-tertiary:hover {
  border: 1px solid #141414;
  background: #ffffff;
  color: #141414;
}
.button-transparent {
  border: unset;
  font-family: "Poppins", sans-serif;
  background: transparent;
  color: #ffffff;
  cursor: pointer;
}
.button-transparent > span {
  color: #ffffff;
}
.button-icon {
  width: 50px;
  height: 50px;
  background: transparent;
  border: unset;
  cursor: pointer;
}
.button-disable {
  opacity: 0.5;
  pointer-events: none;
}

input[type=number] {
  -moz-appearance: textfield;
  background: transparent;
  border: 0;
}
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.loading-wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
}

.sk-chase,
.sk-chase-2 {
  width: 40px;
  height: 40px;
  position: relative;
  animation: sk-chase 2.5s infinite linear both;
}

.sk-chase-2 {
  top: -40px;
}

.sk-chase-2 .sk-chase-dot::before {
  position: absolute;
  bottom: 0;
  right: 0;
}

.sk-chase-dot {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  animation: sk-chase-dot 2s infinite ease-in-out both;
}

.sk-chase-dot:before {
  content: "";
  display: block;
  width: 25%;
  height: 25%;
  background-color: #ffffff;
  border-radius: 100%;
  animation: sk-chase-dot-before 2s infinite ease-in-out both;
}

.sk-chase-dot:nth-child(1) {
  animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2) {
  animation-delay: -1s;
}

.sk-chase-dot:nth-child(3) {
  animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4) {
  animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5) {
  animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6) {
  animation-delay: -0.6s;
}

.sk-chase-dot:nth-child(1):before {
  animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2):before {
  animation-delay: -1s;
}

.sk-chase-dot:nth-child(3):before {
  animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4):before {
  animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5):before {
  animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6):before {
  animation-delay: -0.6s;
}

@keyframes sk-chase {
  100% {
    transform: rotate(360deg);
  }
}
@keyframes sk-chase-dot {
  80%, 100% {
    transform: rotate(360deg);
  }
}
@keyframes sk-chase-dot-before {
  50% {
    transform: scale(0.4);
  }
  100%, 0% {
    transform: scale(0.8);
  }
}
/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
ng-otp-input .ng-otp-input-wrapper .n-o-c {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: repeat(1, 60px);
  gap: 10px;
}
@media screen and (min-width: 768px) {
  ng-otp-input .ng-otp-input-wrapper .n-o-c {
    grid-template-columns: repeat(6, 65px);
    grid-template-rows: repeat(1, 65px);
    gap: 20px;
  }
}
ng-otp-input .ng-otp-input-wrapper .n-o-c > input {
  width: 100%;
  height: 100%;
  border: 1px solid var(--fieldWrapperBdr);
  border-radius: 12px;
  margin: 0 !important;
  background: rgba(255, 255, 255, 0.1);
  color: #030404;
  font-weight: 400;
  font-size: 1.75rem;
}
@media screen and (min-width: 768px) {
  ng-otp-input .ng-otp-input-wrapper .n-o-c > input {
    color: #ffffff;
  }
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.mobile-number-isd {
  gap: 5px;
  width: 50px;
  aspect-ratio: 1/1;
  border: 0;
  border-radius: 100vw;
  background: rgba(255, 255, 255, 0.1);
  cursor: pointer;
}
.mobile-number-isd > span {
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-size: 12px;
}

.country-code .mat-mdc-menu-content {
  padding: 4px;
  border-radius: 6px;
  margin-top: 10px;
  background: #ffffff;
}
.country-code .mat-mdc-menu-content > ul {
  max-height: 200px;
  overflow-y: scroll;
}
.country-code .mat-mdc-menu-content > ul::-webkit-scrollbar {
  width: 0;
}
.country-code .mat-mdc-menu-content > ul > li {
  cursor: pointer;
}
.country-code .mat-mdc-menu-content > ul > li:not(:last-of-type) {
  padding-bottom: 4px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.12);
  margin-bottom: 6px;
}
.country-code .mat-mdc-menu-content > ul > li > div {
  border-radius: 6px;
  padding: 5px 9px;
}
.country-code .mat-mdc-menu-content > ul > li > div:hover {
  background: rgba(2, 129, 228, 0.4);
}
.country-code .mat-mdc-menu-content > ul > li > div > span {
  color: rgba(0, 0, 0, 0.7);
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.75rem;
}
.country-code .mat-mdc-menu-content > ul > li > div > span:first-of-type {
  display: inline-block;
  width: 30px;
}
.country-code .mat-mdc-menu-content > ul > li > div > img {
  display: none;
}
.country-code--selected {
  background: rgba(2, 129, 228, 0.4);
}
.country-code--selected > span {
  color: #000000 !important;
}
.country-code--selected > img {
  display: block !important;
  margin-left: auto;
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.switch {
  position: relative;
  display: inline-block;
  width: 60px;
  height: 34px;
}

.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}

.slider {
  position: absolute;
  border-radius: 5px;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #ccc;
  transition: 0.4s;
}

.slider:before {
  position: absolute;
  content: "No";
  height: 26px;
  width: 26px;
  left: 4px;
  bottom: 4px;
  background-color: #ffffff;
  transition: 0.4s;
  color: #ff0000;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 5px;
}

input:checked + .slider {
  background-color: var(--sliderColor);
}

input:focus + .slider {
  box-shadow: 0 0 1px var(--sliderColor);
}

input:checked + .slider:before {
  content: "Yes";
  color: var(--sliderColor);
  transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
  border-radius: 34px;
}

.slider.round:before {
  border-radius: 50%;
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
/* -----------------------------*/
/* TODO: Start : mat-form-field */
/* -----------------------------*/
input[type=email],
input[formcontrolname=email],
input[formcontrolname=emailId] {
  text-transform: none !important;
}

input:focus, input:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.mat-mdc-input-element:focus, .mat-mdc-input-element:focus-visible {
  outline: none !important;
  box-shadow: none !important;
}

.mat-mdc-form-field.mat-focused .mat-mdc-form-field-outline {
  border-color: transparent !important;
}
.mat-mdc-form-field.mat-focused .mat-mdc-form-field-outline-thick {
  border-color: transparent !important;
}

.field-wrapper {
  height: 60px;
  padding: 5px;
  border: 1px solid var(--fieldWrapperBdr);
  border-radius: 100px;
  background: var(--fieldWrapperBg);
}
.field-wrapper mat-form-field {
  flex: 1;
}
.field-wrapper mat-form-field .mdc-text-field {
  padding: 0 20px;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix {
  width: 100%;
  padding: 0;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label.mdc-floating-label--float-above > mat-label {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 0.875rem;
  opacity: 0.6;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label > mat-label {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: calc(0.8125rem + 3 * (100vw - 20rem) / 1120);
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label span.mat-mdc-form-field-required-marker.mdc-floating-label--required {
  display: none;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input {
  width: 100%;
  border: 0;
  background: transparent;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: calc(0.8125rem + 3 * (100vw - 20rem) / 1120);
  text-transform: uppercase;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input::placeholder {
  padding-top: 15px;
  color: rgba(255, 255, 255, 0.6);
  text-transform: capitalize;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input.mobile-number {
  letter-spacing: 8px;
}
.field-wrapper mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input.mobile-number::placeholder {
  letter-spacing: 0;
}
.field-wrapper mat-form-field .mat-mdc-form-field-subscript-wrapper {
  display: none;
}
.field-wrapper mat-form-field .mat-mdc-form-field-subscript-wrapper.mat-mdc-form-field-bottom-align {
  display: none;
}
.field-wrapper > .icon {
  display: none;
}
.field-wrapper > .success {
  display: none;
}
.field-wrapper > .button-icon--error {
  display: none;
}
.field-wrapper > .button-icon--success {
  display: none;
}
.field-select .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled {
  padding-inline: 0;
}
.field-select .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled .mat-mdc-form-field-flex .mat-mdc-form-field-infix {
  display: grid;
  grid-template-columns: 50px 1fr;
}
.field-select .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label {
  left: 68px;
}
.field-select mat-select {
  padding-left: 17px;
}
.field-select mat-select[aria-expanded=true] {
  transition: rotate 500ms;
}
.field-select mat-select[aria-expanded=true] .mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper .mat-mdc-select-arrow {
  rotate: 180deg;
}
.field-select mat-select .mat-mdc-select-trigger {
  display: grid;
  grid-template-columns: 1fr 50px;
}
.field-select mat-select .mat-mdc-select-trigger .mat-mdc-select-value {
  padding-top: 10px;
}
.field-select mat-select .mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper {
  transform: translateY(0);
}
.field-select mat-select .mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper .mat-mdc-select-arrow {
  width: 24px;
  height: 24px;
  background: url(/assets/images/arrow-down.svg) no-repeat center center/cover;
}
.field-select mat-select .mat-mdc-select-trigger .mat-mdc-select-arrow-wrapper .mat-mdc-select-arrow > svg {
  display: none;
}
.field-error {
  border: 1px solid #ff5a5a;
  background: rgba(255, 0, 0, 0.1) !important;
}
.field-error > .icon {
  display: block;
  margin-right: 13px;
}
.field-error > .button-icon--error {
  display: flex;
}
.field-success .button-icon--success {
  display: block;
}
.field-datepicker .mdc-text-field {
  padding-right: 0 !important;
}
.field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input {
  padding-top: 10px;
}
.field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix {
  padding-left: 0;
}
.field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .mat-datepicker-toggle .mat-mdc-icon-button {
  width: 50px;
  height: 50px;
  padding: 0;
  background: url(/assets/images/calender.svg) no-repeat center center/cover;
}
.field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .mat-datepicker-toggle .mat-mdc-icon-button > svg {
  display: none;
}
.field-height {
  min-height: 90px;
}
.field--white-bg {
  background: #f5f5f5;
  border: 1px solid rgba(255, 255, 255, 0.2);
}
.field--white-bg.field-error {
  border: 1px solid #ff5a5a;
  background: rgba(255, 0, 0, 0.1) !important;
}
.field--white-bg mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label.mdc-floating-label--float-above > mat-label {
  color: #000000;
}
.field--white-bg mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label > mat-label {
  color: rgba(0, 0, 0, 0.6);
}
.field--white-bg mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input {
  color: #000000;
}
.field--white-bg mat-form-field .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-infix > input::placeholder {
  color: rgba(0, 0, 0, 0.6);
}
.field--white-bg .field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .mat-datepicker-toggle .mat-mdc-icon-button {
  width: 50px;
  height: 50px;
  padding: 0;
  background: url(/assets/images/black-calender.svg) no-repeat center center/cover;
}
.field--white-bg .field-datepicker .mdc-text-field .mat-mdc-form-field-flex .mat-mdc-form-field-icon-suffix .mat-datepicker-toggle .mat-mdc-icon-button > svg {
  display: none;
}
.field-select--code .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled {
  padding-inline: 0;
}
.field-select--code .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled .mat-mdc-form-field-flex .mat-mdc-form-field-infix {
  display: flex;
}
.field-select--code .mat-mdc-text-field-wrapper.mdc-text-field.mdc-text-field--filled .mat-mdc-form-field-flex .mat-mdc-form-field-infix > label {
  left: 19px;
}

.mdc-line-ripple.mdc-line-ripple--deactivating::before {
  display: none;
}

.mdc-line-ripple--active::before {
  display: none;
}
.mdc-line-ripple--active::after {
  display: none;
}

/* -----------------------------*/
/* TODO: End   : mat-form-field */
/* -----------------------------*/
/* ------------------------------*/
/* TODO: Start : mat-radio-group */
/* ------------------------------*/
mat-radio-group mat-radio-button {
  position: relative;
  opacity: 0.5;
  cursor: pointer;
}
mat-radio-group mat-radio-button.mat-mdc-radio-checked {
  opacity: 1;
}
mat-radio-group mat-radio-button .mdc-form-field {
  width: 100%;
  padding: 15.2px 12px;
  border: 1px solid var(--primaryBtn);
  border-radius: 12px;
  background: var(--holderDetailsColorMobile);
}
@media screen and (min-width: 768px) {
  mat-radio-group mat-radio-button .mdc-form-field {
    background: rgba(255, 255, 255, 0.09);
  }
}
mat-radio-group mat-radio-button .mdc-form-field .mdc-radio {
  padding: 0;
}
mat-radio-group mat-radio-button .mdc-form-field .mdc-radio__inner-circle {
  background: #0281e4;
}
mat-radio-group mat-radio-button .mdc-form-field label.mdc-label {
  padding-left: 8px;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 12px;
  white-space: nowrap;
}
mat-radio-group mat-radio-button .mdc-form-field label.mdc-label::before {
  content: "";
  position: absolute;
  inset: 0;
  cursor: pointer;
}
mat-radio-group mat-radio-button.mat-mdc-radio-disabled {
  opacity: 0.5;
}
mat-radio-group mat-radio-button.mat-mdc-radio-disabled .mdc-form-field {
  border: rgba(255, 255, 255, 0.6) !important;
  background: #1c3346 !important;
}
mat-radio-group mat-radio-button.mat-mdc-radio-disabled .mdc-form-field .mdc-radio.mdc-radio--disabled {
  display: none;
}

.mat-mdc-radio-button .mdc-radio__native-control:enabled:checked + .mdc-radio__background > .mdc-radio__inner-circle {
  background-color: var(--radioBtnCircle) !important;
}

.mat-mdc-radio-button .mdc-radio__native-control:checked + .mdc-radio__background,
.mat-mdc-radio-button .mdc-radio__native-control:disabled + .mdc-radio__background {
  background: #ffffff;
  border-radius: 50px;
  border: 1px solid var(--radioBtnCircle);
}

.mat-mdc-radio-button .mdc-radio__outer-circle {
  background: rgba(255, 255, 255, 0.12) !important;
}

.mat-mdc-radio-button .mdc-radio__native-control:enabled:not(:checked) + .mdc-radio__background > .mdc-radio__outer-circle {
  border-color: rgba(255, 255, 255, 0.12) !important;
  border-width: 0px;
}

/* ------------------------------*/
/* TODO: End   : mat-radio-group */
/* ------------------------------*/
/* ---------------------*/
/* Start : mat-checkbox */
/* ---------------------*/
mat-checkbox .mdc-form-field .mdc-checkbox {
  align-self: baseline;
  padding: 0;
}
mat-checkbox .mdc-form-field .mdc-checkbox .mat-mdc-checkbox-touch-target {
  display: none;
}
mat-checkbox .mdc-form-field .mdc-checkbox input {
  width: 18px;
  height: 18px;
}
mat-checkbox .mdc-form-field .mdc-checkbox__background {
  top: 0;
  left: 0;
  border: 1px solid rgba(255, 255, 255, 0.149);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.149);
}
mat-checkbox .mdc-form-field .mdc-checkbox__checkmark {
  padding: 2px;
}
mat-checkbox .mdc-form-field label.mdc-label {
  color: #ffffff;
  padding-left: 9px;
  font-weight: 300;
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
}
mat-checkbox.mat-mdc-checkbox-checked .mdc-form-field .mdc-checkbox__background {
  border: 1px solid var(--radioBtnCircle) !important;
  background: var(--radioBtnCircle) !important;
}

/* ---------------------*/
/* End   : mat-checkbox */
/* ---------------------*/
/* ------------------*/
/* Start : mat-error */
/* ------------------*/
mat-error {
  padding-left: 30px;
  color: #ff5a5a !important;
  font-weight: 400;
  font-style: Italic;
  font-size: 0.75rem;
}
mat-error.warning {
  padding-left: 0;
  color: rgba(255, 255, 255, 0.8) !important;
}

/* ------------------*/
/* End   : mat-error */
/* ------------------*/
/* -----------------------*/
/* Start : MatBottomSheet */
/* -----------------------*/
.cdk-overlay-container .cdk-global-overlay-wrapper .cdk-overlay-pane mat-bottom-sheet-container {
  padding: 0;
  border-radius: 30px 30px 0 0;
  background: #ffffff;
}

/* -----------------------*/
/* End   : MatBottomSheet */
/* -----------------------*/
/* ---------------*/
/* Start : Dialog */
/* ---------------*/
mat-dialog-container .mat-mdc-dialog-inner-container.mdc-dialog__container .mat-mdc-dialog-surface.mdc-dialog__surface {
  border-radius: 20px;
}

/* ---------------*/
/* End   : Dialog */
/* ---------------*/
/* ----------------------------*/
/* Start : Select Country Code */
/* ----------------------------*/
mat-select.country-code .mat-mdc-select-trigger .mat-mdc-select-value span.mat-mdc-select-value-text span.mat-mdc-select-min-line {
  color: #ffffff;
}
div.mat-mdc-select-panel {
  top: 5px;
  border-radius: 14px !important;
  background: #ffffff !important;
}
div.mat-mdc-select-panel::-webkit-scrollbar {
  width: 0;
}
div.mat-mdc-select-panel mat-option.mat-mdc-option {
  padding-inline: 14px;
  background: #ffffff;
  transition: background 300ms;
}
div.mat-mdc-select-panel mat-option.mat-mdc-option:focus-visible, div.mat-mdc-select-panel mat-option.mat-mdc-option:hover {
  background: var(--hoverColor);
}
div.mat-mdc-select-panel mat-option.mat-mdc-option:not(:last-of-type) {
  border-bottom: 1px solid var(--matOptionBdr);
}
div.mat-mdc-select-panel mat-option.mat-mdc-option .mdc-list-item__primary-text .mat-mdc-radio-button.mat-mdc-radio-checked .mat-internal-form-field .mdc-radio .mdc-radio__background {
  background: #ffffff;
}
div.mat-mdc-select-panel mat-option.mat-mdc-option .mdc-list-item__primary-text .mat-mdc-radio-button .mat-internal-form-field .mdc-radio .mdc-radio__background {
  background: #e1e1e1;
  border-radius: 50px;
}
div.mat-mdc-select-panel mat-option.mat-mdc-option .mdc-list-item__primary-text .mat-mdc-radio-button .mat-internal-form-field label.mdc-label {
  color: #000000;
  font-size: 0.9375rem;
  cursor: pointer;
}

/* ----------------------------*/
/* End   : Select Country Code */
/* ----------------------------*/
/* ----------------------------- */
/* Start :  mat-datepicker-popup */
/* ----------------------------- */
.mat-datepicker-popup {
  border-radius: 14px;
  background: #ffffff;
  color: #000000;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar {
  height: auto;
}
@media screen and (min-width: 1024px) {
  .mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar {
    width: 337px;
  }
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar mat-calendar-header .mat-calendar-header .mat-calendar-controls button.mdc-button span.mdc-button__label::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -25px;
  transform: translateY(-44%);
  width: 11px;
  height: 14px;
  background: url(/assets/images/arrow-right.svg) no-repeat;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar mat-calendar-header .mat-calendar-header .mat-calendar-controls button.mdc-button span.mdc-button__label > span {
  color: #1a1a1a;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 1rem;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar mat-calendar-header .mat-calendar-header .mat-calendar-controls button.mdc-button span.mdc-button__label > svg {
  display: none;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table thead.mat-calendar-table-header tr th.mat-calendar-table-header-divider {
  display: none;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table thead.mat-calendar-table-header tr th span {
  color: #333333;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.75rem;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr[aria-hidden=true] {
  display: none;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td.mat-calendar-body-label {
  visibility: hidden;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button span.mat-calendar-body-cell-content.mat-focus-indicator {
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.75rem;
}
.mat-datepicker-popup mat-datepicker-content.mat-datepicker-content .mat-datepicker-content-container mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button span.mat-calendar-body-cell-content.mat-focus-indicator.mat-calendar-body-today {
  border: 0;
  border-radius: 10px;
}

.mat-calendar-body-cell {
  color: #000000;
}

/* ----------------------------- */
/* End   :  mat-datepicker-popup */
/* ----------------------------- */
/* ------------------------ */
/* Start : mat-slide-toggle */
/* ------------------------ */
mat-slide-toggle {
  width: 100%;
  padding-block: 14px;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch {
  width: 36px;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--unselected span.mdc-switch__track::before {
  border: unset;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--unselected span.mdc-switch__handle-track .mdc-switch__handle {
  top: 49%;
  left: 4px;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--unselected span.mdc-switch__handle-track .mdc-switch__handle:has(.mdc-switch__icons) {
  margin-inline: 0;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--unselected span.mdc-switch__handle-track .mdc-switch__handle .mdc-switch__icons {
  border-radius: 50px;
  background: #ffffff;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--unselected span.mdc-switch__handle-track .mdc-switch__handle .mdc-switch__icons > svg {
  display: none;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--selected .mdc-switch__handle:has(.mdc-switch__icons) {
  margin-inline: 16px;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--selected.mdc-switch--checked .mdc-switch__track {
  background: #0281e4;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--selected.mdc-switch--checked span.mdc-switch__handle-track .mdc-switch__handle {
  top: 49%;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--selected.mdc-switch--checked span.mdc-switch__handle-track .mdc-switch__handle .mdc-switch__icons {
  border-radius: 50px;
  background: #ffffff;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button.mdc-switch--selected.mdc-switch--checked span.mdc-switch__handle-track .mdc-switch__handle .mdc-switch__icons > svg {
  display: none;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button .mat-mdc-slide-toggle-touch-target {
  display: none;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button span.mdc-switch__track {
  height: 20px;
  border-radius: 16px;
  background: #b3b3b3;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field button span.mdc-switch__handle-track .mdc-switch__handle:has(.mdc-switch__icons) {
  width: 16px;
  height: 16px;
}
mat-slide-toggle .mdc-form-field.mat-internal-form-field > label {
  margin-left: unset;
  color: #ffffff;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: calc(0.8125rem + 2 * (100vw - 20rem) / 1120);
}

/* ------------------------ */
/* End   : mat-slide-toggle */
/* ------------------------ */
/* ------------------ */
/* Start : OTP Dialog */
/* ------------------ */
mat-dialog-container .otp {
  padding-block: 40px !important;
}
mat-dialog-container .otp__main {
  height: auto !important;
  padding: 0 !important;
  overflow-y: hidden !important;
}
mat-dialog-container .otp__main > h1 {
  color: #000000 !important;
}
mat-dialog-container .otp__msg {
  color: rgba(3, 4, 4, 0.8) !important;
}
mat-dialog-container .otp__msg > b {
  color: #030404 !important;
}
mat-dialog-container .otp__msg > button {
  display: none !important;
}
mat-dialog-container .otp__resend > * {
  color: #000000 !important;
}
mat-dialog-container .otp__form {
  gap: 0 !important;
}
mat-dialog-container .otp__form button.button-primary {
  border: 1px solid #0281e4;
  background: #0281e4;
  color: #ffffff;
  transition: all 300ms;
}
mat-dialog-container .otp__form button.button-primary:focus-visible, mat-dialog-container .otp__form button.button-primary:hover {
  border: 1px solid #0281e4;
  background: #ffffff;
  color: #0281e4;
}
mat-dialog-container .otp__form button > span {
  color: #000000 !important;
}
mat-dialog-container .otp__input {
  padding-block: 50px !important;
}
mat-dialog-container .otp__input ng-otp-input .ng-otp-input-wrapper .n-o-c input {
  border: 1px solid rgba(3, 4, 4, 0.1) !important;
  background: #f2f2f2 !important;
  color: #000000 !important;
}
mat-dialog-container .otp__input ng-otp-input .ng-otp-input-wrapper .n-o-c input:focus-visible {
  outline: unset !important;
}

/* ------------------ */
/* End   : OTP Dialog */
/* ------------------ */
/* -------------------- */
/* Start : mat-calendar */
/* -------------------- */
mat-calendar {
  padding: 10px;
  color: #000000;
}
mat-calendar mat-calendar-header .mat-calendar-header {
  padding: 0;
}
mat-calendar mat-calendar-header .mat-calendar-header .mat-calendar-controls .mat-mdc-button {
  padding: 0 7px;
}
mat-calendar .mat-calendar-content {
  padding: 0;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td.mat-calendar-body-cell-container button.mat-calendar-body-cell.mat-calendar-body-active span.mat-calendar-body-cell-content.mat-focus-indicator.mat-calendar-body-selected {
  color: #ffffff;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell.mat-calendar-body-disabled {
  opacity: 0.5;
  pointer-events: none;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell {
  transition: all 300ms;
  border-radius: 10px;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell:hover {
  border: 0;
  background: var(--hoverColor);
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell span {
  transition: all 300ms;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell span:hover {
  color: #000000;
}
mat-calendar .mat-calendar-content mat-month-view table.mat-calendar-table tbody.mat-calendar-body tr td button.mat-calendar-body-cell span.mat-calendar-body-selected {
  border: 0;
  border-radius: 10px;
  background: var(--lightBlueColor);
  color: #ffffff;
  cursor: pointer;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-cell.mat-calendar-body-disabled {
  opacity: 0.5;
  pointer-events: none;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-cell {
  transition: all 300ms;
  border-radius: 10px;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-cell:hover {
  border: 0;
  background: var(--hoverColor);
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-cell > span {
  transition: color 300ms;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-cell > span:hover {
  color: #000000;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-active {
  border: 0;
  border-radius: 10px;
  background: var(--lightBlueColor);
  cursor: pointer;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button.mat-calendar-body-active > span {
  border: 0;
  color: #ffffff;
}
mat-calendar .mat-calendar-content mat-multi-year-view table tbody tr td button span {
  color: #000000;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-cell {
  transition: all 300ms;
  border-radius: 10px;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-cell:hover {
  border: 0;
  background: var(--hoverColor);
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-cell > span {
  transition: color 300ms;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-cell > span:hover {
  color: #000000;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-disabled {
  opacity: 0.5;
  pointer-events: none;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-active {
  border: 0;
  border-radius: 10px;
  background: var(--lightBlueColor);
  cursor: pointer;
}
mat-calendar .mat-calendar-content mat-year-view table tbody tr td button.mat-calendar-body-active > span {
  border: 0;
  color: #ffffff;
}

/* -------------------- */
/* End   : mat-calendar */
/* -------------------- */
/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.img--area {
  width: 50px;
  height: 50px;
}

.arrow {
  transition: rotated 300ms ease;
}
.arrow.rotated {
  rotate: 180deg;
}

.sticky__footer {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(0deg, #020406 0%, rgba(2, 4, 6, 0.9) 50%, rgba(2, 4, 6, 0.7) 76.44%, rgba(2, 4, 6, 0) 100%);
}
.sticky__footer > .container {
  padding-top: 66px;
  padding-bottom: 50px;
}

.dialog-close-btn {
  display: none;
}
.dialog-close-btn:focus, .dialog-close-btn:focus-visible {
  outline: unset;
}
@media screen and (min-width: 768px) {
  .dialog-close-btn {
    display: block;
    position: absolute;
    top: 22px;
    right: 22px;
    width: 15px;
    height: 15px;
  }
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.transaction-failed__content {
  padding-bottom: 130px;
}
.transaction__para {
  padding-top: 30px;
}
.transaction__content {
  gap: 14px;
}
.transaction__content > img {
  width: 112px;
  aspect-ratio: 1;
  margin-inline: auto;
}
.transaction__title {
  gap: 5px;
}
.transaction__title > p {
  font-weight: 300;
  font-size: 0.875rem;
}
.transaction__title > p > span {
  position: relative;
  padding-left: 21px;
}
.transaction__title > p > span::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  aspect-ratio: 1;
  border-radius: 100px;
  background: #ffffff;
}
.transaction__description {
  max-width: 330px;
  padding: 9px 0 24px;
  margin-inline: auto;
  font-weight: 300;
  font-size: 0.875rem;
}
@media screen and (min-width: 768px) {
  .transaction__description {
    max-width: 100%;
  }
}
.transaction__description > span {
  font-weight: 500;
}
.transaction__urn {
  position: relative;
  padding: 9px 12px;
  border: 1px solid #8d7607;
  border-radius: 8px;
  background: #fbf3cc;
  overflow: hidden;
}
.transaction__urn-img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
}
.transaction__urn > h6 {
  color: rgba(0, 0, 0, 0.8);
  font-weight: 300;
  font-size: 0.75rem;
}
.transaction__urn > div {
  gap: 10px;
  padding-top: 4px;
}
.transaction__urn > div > b {
  color: #000000;
  font-weight: 500;
}
.transaction__steps {
  gap: 16px;
  padding: 12px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 12px;
}
.transaction__steps > h6 {
  font-weight: 500;
  font-size: 0.75rem;
}
.transaction__steps > ul > li {
  position: relative;
  height: 55px;
  padding-left: 45px;
  font-weight: 300;
  font-size: 0.75rem;
  list-style-type: none;
  line-height: 30px;
  counter-increment: number;
}
.transaction__steps > ul > li::before {
  content: counter(number);
  position: absolute;
  z-index: 2;
  left: 0;
  width: 32px;
  aspect-ratio: 1;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 100px;
  color: #ffffff;
  background: #1c1f21;
  font-weight: 500;
  font-size: 0.75rem;
}
.transaction__steps > ul > li:not(:last-of-type)::after {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  left: 16px;
  bottom: 0;
  width: 1px;
  border: 1px dashed rgba(255, 255, 255, 0.6);
}
.transaction__details {
  gap: 16px;
}
@media screen and (min-width: 768px) {
  .transaction__details {
    padding-bottom: 130px;
  }
}
.transaction__details > h2 {
  align-items: flex-start;
  font-size: 1.25rem;
}
@media screen and (min-width: 768px) {
  .transaction__details > h2 {
    display: none;
  }
}
.transaction__cards {
  gap: 16px;
}
.transaction__card {
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  background: #1c1f21;
}
.transaction__card > h3 {
  padding: 11px 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  font-weight: 500;
  font-size: 0.875rem;
}
@media screen and (min-width: 768px) {
  .transaction__card > h3 {
    padding: 20px 30px;
  }
}
.transaction__card.transaction--card {
  overflow: hidden;
}
.transaction__card.transaction--card > h3 {
  background: #226ba5;
  font-size: 0.75rem;
}
.transaction__card.transaction--card > .card-bottom {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  grid-template-rows: auto;
}

.card-bottom {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  grid-template-rows: auto;
  gap: 20px;
  padding: 12px 15px;
}
@media screen and (min-width: 768px) {
  .card-bottom {
    padding: 20px 30px;
  }
}
.card-details {
  gap: 5px;
}
.card-details__title {
  color: rgba(255, 255, 255, 0.4);
  font-size: calc(0.6875rem + 1 * (100vw - 20rem) / 1120);
}
.card-details__sub-title {
  font-weight: 500;
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
}

.distributor {
  padding: 13px 45px;
  border: 1px solid rgba(243, 234, 159, 0.8);
  border-radius: 16px;
  color: #f3ea9f;
}
.distributor__msg {
  padding-bottom: 20px;
  border-bottom: 1px dashed rgba(243, 234, 159, 0.4);
  margin-bottom: 20px;
  font-weight: 300;
}
.distributor__msg > b {
  font-weight: 500;
}
.distributor__details {
  align-items: center;
}
@media screen and (min-width: 576px) {
  .distributor__details {
    flex-direction: row;
    align-items: center;
    justify-content: center;
  }
}
.distributor__details > b {
  font-weight: 600;
}
.distributor__details > span {
  width: 100%;
  padding-top: 20px;
  border-top: 1px dashed #f3ea9f;
  margin-top: 20px;
}
@media screen and (min-width: 576px) {
  .distributor__details > span {
    width: fit-content;
    padding-top: 0;
    border-top: 0;
    margin-top: 0;
    padding-left: 20px;
    border-left: 1px dashed #f3ea9f;
    margin-left: 20px;
  }
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.holder {
  gap: 10px;
  padding-bottom: 200px;
}
@media screen and (min-width: 768px) {
  .holder {
    gap: 30px;
  }
}
.holder-wrapper {
  gap: 20px;
}
.holder > h3 {
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
  text-transform: uppercase;
}
.holder__content {
  gap: 20px;
}
.holder__types {
  gap: 20px;
}
.holder__types > * {
  flex: 1;
}
.holder__form {
  border: 1px solid var(--holderFormBdr);
  border-radius: 12px;
  overflow: hidden;
}
.holder__details {
  position: relative;
  padding: 16px;
  background: var(--holderDetailsColorMobile);
}
@media screen and (min-width: 576px) {
  .holder__details {
    min-height: 60px;
    padding: 10px 30px;
  }
}
@media screen and (min-width: 768px) {
  .holder__details {
    background: var(--holderDetailsColorDesktop);
  }
}
.holder__details > .button-transparent::before {
  content: "";
  position: absolute;
  inset: 0;
}
.holder__detail > h2 {
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  font-size: 0.75rem;
}
.holder__detail > h1 {
  font-weight: 500;
  font-size: 0.875rem;
}
.holder__detail > span {
  padding: 1px 10px;
  border: 1px solid #ababab;
  border-radius: 20px;
  font-weight: 500;
  font-size: 0.8125rem;
  background: rgba(255, 255, 255, 0.3);
}
@media screen and (min-width: 576px) {
  .holder__detail > span {
    display: none;
  }
}
.holder__options {
  gap: 16px;
  padding: 16px 13px;
  border-top: 1px solid var(--holderFormBdr);
  background: var(--holderOptionsColorMobile);
}
@media screen and (min-width: 576px) {
  .holder__options {
    padding-inline: 30px;
  }
}
@media screen and (min-width: 768px) {
  .holder__options {
    padding-top: 20px;
    padding-bottom: 30px;
    background: var(--holderOptionsColorDesktop);
  }
}
.holder__pan {
  margin-bottom: 14px;
  text-transform: capitalize;
}
.holder__pan > h2 {
  margin-bottom: 5px;
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  font-size: calc(0.6875rem + 3 * (100vw - 20rem) / 1120);
}
.holder__pan > h3 {
  color: rgba(255, 255, 255, 0.6);
  font-weight: 400;
  font-size: 0.875rem;
  text-transform: uppercase;
}
.holder__pan > span {
  font-weight: 500;
  font-size: calc(0.875rem + 2 * (100vw - 20rem) / 1120);
}
.holder__tax-dob {
  gap: 16px;
}
.holder__add > h2 {
  margin-bottom: 10px;
  font-weight: 400;
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
  text-transform: uppercase;
}
.holder__tax-status {
  display: block;
  padding-block: 10px;
  font-weight: 300;
  font-size: 0.75rem;
}
.holder__tax-status > a {
  color: #ffffff;
  text-decoration: unset;
}
.holder__note {
  padding: 10px 12px;
  border-radius: 8px;
  margin-block: 8px;
  background: #fbf3cc;
  color: #000000;
  font-weight: 300;
  font-size: 12px;
}
@media screen and (min-width: 576px) {
  .holder__note {
    width: fit-content;
  }
}
@media screen and (min-width: 768px) {
  .holder__note {
    display: none;
  }
}
.holder__note > .button-transparent {
  color: #000000;
  font-weight: 600;
  text-decoration: underline;
}
.holder__gender {
  gap: 10px;
  padding-block: 14px;
}
.holder__gender > h3 {
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
  text-transform: uppercase;
}
.holder__gender-options mat-radio-group {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
@media screen and (min-width: 576px) {
  .holder__gender-options mat-radio-group mat-radio-button .mdc-form-field {
    padding: 10px 12px;
  }
}
@media screen and (min-width: 576px) {
  .holder__gender-options mat-radio-group .mat-mdc-radio-button.mat-mdc-radio-checked .mdc-form-field.mat-internal-form-field {
    border: 1px solid var(--primaryBtn);
    background: rgba(255, 255, 255, 0.09);
  }
}
.holder__others {
  gap: 16px;
}
@media screen and (min-width: 576px) {
  .holder__others {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}
.holder__others > .dummy {
  display: none;
}
@media screen and (min-width: 576px) {
  .holder__others > .dummy {
    display: block;
  }
}
.holder__add-another {
  gap: 6px;
  height: 60px;
  border: 1px dashed var(--holderFormBdr);
  border-radius: 10px;
  background: #141414;
}
@media screen and (min-width: 576px) {
  .holder__add-another {
    width: 260px;
  }
}
.holder__add-another > span {
  color: var(--primaryBtn);
  font-weight: 600;
  font-size: 0.875rem;
  text-transform: uppercase;
}
.holder__add-another--desktop {
  display: none;
}
@media screen and (min-width: 576px) {
  .holder__add-another--desktop {
    display: block;
  }
}
.holder__remove {
  gap: 5px;
  height: 44px;
  border: 0;
  margin: 0 -13px -16px;
  background: #ebadad;
}
@media screen and (min-width: 576px) {
  .holder__remove {
    margin: 0 -30px -30px;
  }
}
.holder__remove > span {
  font-weight: 500;
  font-size: 0.875rem;
  padding-top: 3px;
  color: #7a1f1f;
}
.holder__net-worth-wrapper {
  gap: 16px;
}
@media screen and (min-width: 768px) {
  .holder__net-worth-wrapper {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (min-width: 576px) {
  .sticky__footer > .container > .holder__footer {
    display: flex;
    align-items: center;
    gap: 30px;
  }
}
@media screen and (min-width: 576px) {
  .sticky__footer > .container > .holder__footer {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 550px;
  }
}
.sticky__footer > .container > .holder__footer > .button {
  padding: 9px 5px;
}
@media screen and (min-width: 576px) {
  .sticky__footer > .container > .holder__footer > .button {
    padding: 18px 10px;
  }
}
.sticky__footer > .container > .holder__footer > .button-tertiary {
  display: none;
}
@media screen and (min-width: 576px) {
  .sticky__footer > .container > .holder__footer > .button-tertiary {
    display: block;
  }
}

@media screen and (min-width: 576px) {
  .one-col {
    display: grid;
    grid-template-columns: repeat(1, 0.5fr);
    gap: 30px;
  }
}

@media screen and (min-width: 576px) {
  .two-col {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.minor__header {
  gap: 16px;
}
@media screen and (min-width: 576px) {
  .minor__header {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
  }
}
.minor__msg {
  color: rgba(255, 255, 255, 0.8);
  font-weight: 300;
  font-style: Italic;
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
}
.minor-docs {
  flex-direction: column-reverse;
  gap: 16px;
}
@media screen and (min-width: 768px) {
  .minor-docs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
  }
}
.minor-docs__wrapper {
  gap: 20px;
  padding-bottom: 150px;
}
.minor-docs__left {
  gap: 8px;
}
.minor-docs__left > h3 {
  font-size: calc(0.6875rem + 2 * (100vw - 20rem) / 1120);
}
.minor-docs__left > ul {
  gap: 8px;
}
.minor-docs__left > ul > li {
  gap: 10px;
}
.minor-docs__left > ul > li > span {
  font-weight: 400;
  font-size: calc(0.6875rem + 1 * (100vw - 20rem) / 1120);
}
@media screen and (min-width: 768px) {
  .minor-docs__right {
    align-self: center;
  }
}
.minor-docs__right > .upload-doc {
  position: relative;
  flex-direction: column;
  height: 164px;
  border: 1px dashed rgba(255, 255, 255, 0.502);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.2);
}
.minor-docs__right > .upload-doc > h4 {
  margin-top: 24px;
  margin-bottom: 9px;
  font-weight: 300;
  font-size: calc(0.75rem + 2 * (100vw - 20rem) / 1120);
}
.minor__upload {
  font-weight: 600;
  font-size: 12px;
  text-transform: uppercase;
  text-decoration: underline;
}
.minor__upload > input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
}
@media screen and (min-width: 576px) {
  .minor__options {
    gap: 30px;
  }
}

.doc {
  gap: 18px;
  padding: 14px 15px 14px 10px;
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: rgba(255, 255, 255, 0.2);
}
.doc__img {
  width: 44px;
  aspect-ratio: 1/1;
  object-fit: cover;
}
.doc__wrapper {
  gap: 15px;
  flex: 1;
}
.doc-details__name {
  font-weight: 500;
  font-size: 0.75rem;
}
.doc-details__wrapper {
  gap: 15px;
}
.doc-details__file-size {
  position: relative;
  width: 65px;
  color: #ababab;
  font-weight: 300;
  font-size: 0.75rem;
}
.doc-details__file-size::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 5px;
  aspect-ratio: 1;
  border-radius: 50px;
  background: #ababab;
}
.doc-details__file-size > span {
  text-transform: uppercase;
}
.doc-details__uploaded {
  gap: 6px;
}
.doc-details__uploaded > span {
  padding-top: 1px;
  color: #40bf40;
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.bank-details {
  border: 1px solid rgba(255, 255, 255, 0.302);
  border-radius: 16px;
  overflow: hidden;
}
.bank-details__header {
  padding: 13px 16px;
  background: #b3e5b3;
  color: #267326;
}
@media screen and (min-width: 576px) {
  .bank-details__header {
    padding: 23px 30px;
  }
}
.bank-details__header > h5 {
  font-weight: 500;
  font-size: 1rem;
}
.bank-details__success {
  gap: 6px;
}
.bank-details__success > span {
  font-weight: 500;
  font-size: 11px;
  text-transform: uppercase;
}
.bank-details__main {
  display: grid;
  grid-auto-rows: auto;
  gap: 10px;
  padding: 18px 16px;
}
@media screen and (min-width: 576px) {
  .bank-details__main {
    grid-template-columns: repeat(2, 1fr);
    padding: 23px 30px;
  }
}
@media screen and (min-width: 768px) {
  .bank-details__main {
    grid-template-columns: repeat(3, 1fr);
    row-gap: 30px;
  }
}
.bank-details__wrapper {
  gap: 5px;
}
.bank-details__title {
  color: rgba(255, 255, 255, 0.6);
  font-size: calc(0.6875rem + 1 * (100vw - 20rem) / 1120);
  text-wrap: nowrap;
}
.bank-details__detail {
  color: #ffffff;
  font-weight: 500;
  font-size: 0.875rem;
  text-wrap: nowrap;
}
.bank-details__input {
  border: 0;
  color: #ffffff;
  font-weight: 500;
  font-size: 0.875rem;
  text-wrap: nowrap;
  background: transparent;
}
.bank-details__input::placeholder {
  color: #ffffff;
  font-weight: 500;
  font-size: 0.875rem;
  text-wrap: nowrap;
}
.bank-details__input:focus-visible {
  outline: 0;
}

.verification__failed {
  gap: 14px;
  padding: 12px 20px;
  border-radius: 10px;
  background: #f8d6d6;
  border: 1px solid #e46464;
}
.verification__failed > img {
  align-self: baseline;
}
.verification__failed > span {
  color: #7a1f1f;
  font-weight: 500;
  font-size: 14px;
}

.bank-edit {
  gap: 6px;
}

.bank-account__wrapper mat-radio-group ngx-glide .glide__slides {
  padding-top: 15px;
}
.bank-account__wrapper mat-radio-group ngx-glide .glide__arrows, .bank-account__wrapper mat-radio-group ngx-glide .glide__bullets {
  display: none !important;
}

/* --------------------------------*/
/* Start : Don't Change The Flow   */
/* --------------------------------*/
.nominees-added {
  margin-bottom: 30px;
  border-radius: 10px 10px 0 0;
  overflow-x: scroll;
}
.nominees-added::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.nominees-added__wrapper > h2 {
  text-transform: uppercase;
  margin-bottom: 20px;
}
.nominees-added__details {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
}
.nominees-added__details:first-of-type div {
  background: rgba(255, 255, 255, 0.15);
}
.nominees-added__details:not(:first-of-type) div {
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  border-left: 1px solid rgba(255, 255, 255, 0.15);
  font-weight: 500;
}
.nominees-added__details:not(:first-of-type) div:first-of-type {
  text-transform: uppercase;
}
.nominees-added__details div {
  min-width: 150px;
  padding: 15px;
  color: #ffffff;
  font-weight: 600;
  font-size: 0.8125rem;
  text-wrap: nowrap;
}
@media screen and (min-width: 768px) {
  .nominees-added__details div {
    min-width: unset;
  }
}
.nominees-added__details div:last-of-type {
  border-right: 1px solid rgba(255, 255, 255, 0.15);
}

.table-wrapper {
  border-radius: 10px 10px 0 0;
  overflow-x: scroll;
}
.table-wrapper::-webkit-scrollbar {
  width: 0;
  height: 0;
}
.table-wrapper > table {
  width: 730px;
  overflow: hidden;
}
.table-wrapper > table > thead > tr > th {
  padding: 15px 30px;
  color: #ffffff;
  font-weight: 600;
  font-size: 0.8125rem;
  text-wrap: nowrap;
  background: rgba(255, 255, 255, 0.15);
}
.table-wrapper > table > tbody > tr > td {
  padding: 15px 30px;
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: #ffffff;
  font-weight: 600;
  font-size: 0.8125rem;
  text-wrap: nowrap;
}

/* ------------------------- */
/* Start : Classic Container */
/* ------------------------- */
/* ------------------------- */
/* End   : Classic Container */
/* ------------------------- */
/* ------------------------ */
/* Start : Modern Container */
/* ------------------------ */
.container {
  --content: 1440px;
  --mw: 100%;
  --px: calc(20px * 2);
  width: min(var(--mw) - var(--px), var(--content));
  padding-block: 30px;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .container {
    --content: 768px;
  }
}
@media screen and (min-width: 1024px) {
  .container {
    --content: 820px;
  }
}

/* ------------------------ */
/* End   : Modern Container */
/* ------------------------ */
/* -------------------- */
/* Start : Layout Setup */
/* -------------------- */
.grid-container {
  --width: 1200px;
  --px: 15px;
  display: grid;
  grid-template-columns: [full-width-start] minmax(var(--px), 1fr) [container-start] min(100% - var(--px) * 2, var(--width)) [container-end] minmax(var(--px), 1fr) [full-width-end];
}
.grid-container > * {
  grid-column: container;
}
.grid-container > .full-width {
  grid-column: full-width;
}

/* -------------------- */
/* End   : Layout Setup */
/* -------------------- */
/* ------------------------------- */
/* Start : Responsive Grid Wrapper */
/* ------------------------------- */
.grid-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  grid-auto-rows: 200px;
  gap: 20px;
}

/* ------------------------------- */
/* End   : Responsive Grid Wrapper */
/* ------------------------------- */
/* --------------------------------*/
/* End   : Don't Change The Flow   */
/* --------------------------------*/