* {
  outline: none !important;
}
body {
  font-family: BYekan;
  direction: rtl;
  min-height: 100vh;
  overflow-x: hidden;
  background-color: #744DDC;
  background: linear-gradient(319deg, #744DDC 34%, #825beb 66%, #744DDC 0);
  -webkit-user-select: none;
  /* Safari */
  -ms-user-select: none;
  /* IE 10 and IE 11 */
  user-select: none;
  /* Standard syntax */
}
body header {
  align-items: center;
  justify-content: center;
  background-image: url("../img/wave (15).svg");
  background-repeat: no-repeat;
  background-size: 100%;
  background-position: top;
  display: flex;
  flex-direction: column;
  width: 100vw;
  height: 100vw;
}
body header div.logo {
  display: inline-block;
  width: 50vw;
  height: 50vw;
  border-radius: 50%;
  background-image: url("../img/varizak_fa_150.png");
  background-size: 90%;
  background-repeat: no-repeat;
  background-position: center;
  background-color: white;
  margin-top: 25vw;
  border: 5px outset #fcd14f;
}
body header img.avatar {
  width: 3pc;
  height: 3pc;
  position: absolute;
  background-color: white;
  padding: 2px;
  border-radius: 50%;
  top: 1pc;
  right: 1pc;
}
body header h1 {
  font-family: BYekan;
  font-weight: bold;
  color: #ad9fda;
}
body header .welcome {
  position: absolute;
  color: white;
  top: 1pc;
  left: 1pc;
  font-family: BYekan;
  font-size: larger;
}
body header .warnings {
  color: white;
  position: absolute;
  top: 2pc;
  right: 5.5pc;
  font-size: x-large;
}
body section {
  border-radius: 1pc 1pc 0 0;
  background-color: #ffffff;
  height: calc(100vh - 5pc);
  margin: 0 4px;
  overflow: visible;
}
body main {
  /*border-radius: 2pc 2pc 0 0;
    background-color: @background_color_3;
    height: calc(100vh - 100vw);
    margin: 0 4px;
    overflow: scroll;

    .caption {
      color: @color_4;
      font-size: large;
      font-family: @font_family_1;
      padding: 2pc 3pc 0 0;
      text-shadow: 0 0 3px #ccc2a4;
    }*/
}
body main section {
  position: fixed;
  right: 0;
  bottom: 0;
  top: 5pc;
  left: 0;
  display: none;
  background: linear-gradient(284deg, #ffffff 34%, #f9f9f9 66%, rgb(254 254 254) 0);
}
body main img.avatar {
  width: 3pc;
  height: 3pc;
  background-color: #EDEBF8;
  padding: 2px;
  border-radius: 50%;
}
@media (min-width: 768px) {
  body main section {
    width: unset;
    left: 30vw;
    right: 30vw;
    top: 10pc;
  }
  body main section div.v-form-input {
    padding: 2pc;
  }
  body main #myqrcode img {
    width: unset;
  }
  body main #view-profile img,
  body main #view-profile-edit img {
    width: 20vw;
    height: 20vw;
  }
  body header {
    width: unset;
    height: unset;
  }
  body [navi-back-button] {
    right: unset;
    left: 31vw;
    bottom: unset;
    background-color: transparent;
  }
}
@media (min-width: 768px) {
  body header div.logo {
    width: 20vw;
    height: 3pc;
    position: absolute;
    background-color: white;
    background-size: auto 80%;
    padding: 0.5pc 1pc;
    border-radius: 0 1.5pc 1.5pc 0;
    top: 1pc;
    left: 0;
    margin-top: 0;
    border: unset;
  }
}
body.navi-show {
  /*main {
      height: 80vh;
    }*/
}
body.navi-show header div.logo {
  width: 30vw;
  height: 3pc;
  position: absolute;
  background-color: white;
  background-size: auto 80%;
  padding: 0.5pc 1pc;
  border-radius: 0 1.5pc 1.5pc 0;
  top: 1pc;
  left: 0;
  margin-top: 0;
  border: unset;
}
.title {
  font-size: medium;
  font-family: BYekan;
  color: #c4c3c3;
}
.title.active {
  color: #744DDC;
}
.v-form-input {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7pc;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 1pc 15vw;
}
.v-form-input div.input-group {
  background-color: #FAFAFC;
  border-radius: 1pc;
  height: 3pc;
  border: 1px solid #f0f0f0;
}
.v-form-input div.input-group input {
  border: none;
  background-color: transparent;
  outline: none !important;
  box-shadow: none !important;
  text-align: center;
}
.v-form-input div.input-group button {
  outline: none;
  border: none;
  box-shadow: none;
}
.v-form-input div.input-group span {
  padding-top: 0.5pc;
  margin: 0;
}
.v-form-input:focus-within .title {
  color: #744DDC;
}
.v-form-input:focus-within div.input-group {
  border: 1px solid #744DDC;
  /*button {
        display: block !important;
      }*/
}
.v-form-input div.buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 2vw;
  align-items: center;
  justify-content: space-between;
  overflow: auto;
  max-height: 40vh;
}
.v-form-input div.buttons img {
  width: 12vw;
  height: 12vw;
}
.v-btn-circle {
  width: 3pc;
  height: 3pc;
  border-radius: 1pc;
  background-color: #EDEBF8;
}
.v-btn-circle:active,
.v-btn-circle:focus {
  background-color: #dcd8f1 !important;
}
.v-btn-purple {
  height: 3pc;
  border-radius: 1pc;
  background-color: #744DDC;
  color: white;
}
.v-btn-purple:active,
.v-btn-purple:focus {
  background-color: #8562e0 !important;
  color: white;
}
div.actions {
  display: flex;
  gap: 10vw;
  width: 100%;
  align-items: center;
  justify-content: center;
}
div.actions > div {
  display: flex;
  flex-direction: column;
  text-align: center;
  width: 20vw;
  height: 20vw;
  background-color: #dddddd;
  border-radius: 20%;
  padding: 20%;
}
div.actions > div > i {
  font-size: xxx-large;
  background-color: #dddddd;
  font-weight: bold;
}
section#view-invoice img {
  width: 50vw;
  height: 50vw;
  border-radius: 50%;
  border: 4px outset #744DDC;
}
section#view-invoice > div {
  display: flex;
  flex-direction: column;
  gap: 0.7pc;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
section#view-profile {
  /*button {
    border: 1px solid silver;
    border-radius: 0.5pc;
    padding: 0.5pc 1.5pc;
    margin: 0.5pc;
  }*/
}
section#view-profile img {
  width: 50vw;
  height: 50vw;
  border-radius: 50%;
  border: 4px outset #ad9fda;
}
section#view-profile-edit img {
  width: 50vw;
  height: 50vw;
  border-radius: 50%;
  border: 2px outset #ad9fda;
}
section#view-profile-edit img:after {
  content: 'ویرایش';
}
section#view-profile-edit input {
  outline: none !important;
  box-shadow: none !important;
  text-align: center;
  border: 1px solid #744DDC;
  background-color: #FAFAFC;
  border-radius: 1pc;
  width: 100%;
  height: 3pc;
}
div#view-login {
  padding: 2pc;
  color: white;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  font-size: large;
}
div#view-login #activate-div > div {
  margin-top: 2pc;
  padding: 2pc 1pc;
}
div#view-login #activate-div > div button#send-sms-btn {
  width: 50vw;
  color: white;
  border-radius: 2pc;
  background-color: #5133c3;
  height: 3pc;
  margin-top: 1pc;
}
nav.navi {
  background: #f3f0fa;
  background: radial-gradient(ellipse farthest-side at bottom center, #fdfdfd 50%, #eceaf2 180%);
  border-top: 5px outset #fcd14f;
  height: 8pc;
  border-radius: 30% 30% 0 0 ;
  padding: 0 3pc 2pc 3pc;
  margin: 0 2px 0 2px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
nav.navi button {
  width: 4pc;
  height: 4pc;
  font-size: x-large;
  text-decoration: none;
}
nav.navi button i {
  color: #4E31C1;
}
nav.navi button span {
  font-size: small;
  color: #744DDC;
}
[navi-view] {
  display: none;
}
[navi-back-button] {
  display: none;
  position: fixed;
  bottom: 2pc;
  right: calc(50% - 1.5pc);
  width: 3pc;
  height: 3pc;
  border-radius: 50%;
  z-index: 1000;
  color: #4E31C1;
  background-color: white;
}
#view-varizak-list ul {
  padding: 0.5pc;
  overflow-y: auto;
  height: 68vh;
}
#view-varizak-list ul li {
  font-family: BYekan;
  list-style: none;
  display: flex;
  gap: 10vw;
  background-color: #FAFAFC;
  height: 5pc;
  border-radius: 0.5pc;
  align-items: center;
  justify-content: center;
  margin-bottom: 1pc;
  padding: 0.5pc 1pc;
}
#view-varizak-list ul li .name {
  color: #362C33;
  width: 70vw;
}
#view-varizak-list ul li .hezartoman {
  display: inline-block;
  font-size: x-large;
  font-weight: bold;
  direction: ltr;
  color: #4E31C1;
  text-align: center;
}
#view-varizak-list ul li .hezartoman:after {
  content: "هزار تومان";
  font-weight: normal;
  font-size: xx-small;
  display: block;
  float: left;
}
#view-varizak-list ul li .hezartoman.send {
  color: #d920ff;
}
#view-varizak-list ul li .hezartoman.send:after {
  content: "هزار تومان واریز شد";
}
#view-varizak-list ul li .hezartoman.receive:after {
  content: "هزار تومان دریافت شد";
}
video {
  width: 75vw;
  height: 75vw;
  border: 3px outset #4E31C1;
  border-radius: 1pc;
  object-fit: cover;
}
#qr-div {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  /*img {
    border: 4px solid @background_color_1;
    padding: 1pc;
    border-radius: 1pc;
  }*/
}
#installpwapan {
  z-index: 3333;
}
#myqrcode img {
  width: 50vw;
  padding: 1pc;
  border: 4px solid #744DDC;
}
#activation-waiting {
  width: 30vw;
  height: 30vw;
}
.croppie-container {
  overflow: hidden;
}
button.nav-link {
  outline: none;
}
button.nav-link.send {
  color: #d920ff !important;
}
button.nav-link.receive {
  color: #4E31C1 !important;
}
button.nav-link.active {
  font-weight: bold;
  border-bottom: none;
  background-color: #eeeaff !important;
}
div#nav-receives,
div#nav-sends {
  background-color: #eeeaff;
  height: 100vh;
}
.lds-default {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-default div {
  position: absolute;
  width: 6px;
  height: 6px;
  background: #dfc;
  border-radius: 50%;
  animation: lds-default 1.2s linear infinite;
}
.lds-default div:nth-child(1) {
  animation-delay: 0s;
  top: 37px;
  left: 66px;
}
.lds-default div:nth-child(2) {
  animation-delay: -0.1s;
  top: 22px;
  left: 62px;
}
.lds-default div:nth-child(3) {
  animation-delay: -0.2s;
  top: 11px;
  left: 52px;
}
.lds-default div:nth-child(4) {
  animation-delay: -0.3s;
  top: 7px;
  left: 37px;
}
.lds-default div:nth-child(5) {
  animation-delay: -0.4s;
  top: 11px;
  left: 22px;
}
.lds-default div:nth-child(6) {
  animation-delay: -0.5s;
  top: 22px;
  left: 11px;
}
.lds-default div:nth-child(7) {
  animation-delay: -0.6s;
  top: 37px;
  left: 7px;
}
.lds-default div:nth-child(8) {
  animation-delay: -0.7s;
  top: 52px;
  left: 11px;
}
.lds-default div:nth-child(9) {
  animation-delay: -0.8s;
  top: 62px;
  left: 22px;
}
.lds-default div:nth-child(10) {
  animation-delay: -0.9s;
  top: 66px;
  left: 37px;
}
.lds-default div:nth-child(11) {
  animation-delay: -1s;
  top: 62px;
  left: 52px;
}
.lds-default div:nth-child(12) {
  animation-delay: -1.1s;
  top: 52px;
  left: 62px;
}
@keyframes lds-default {
  0%,
  20%,
  80%,
  100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.5);
  }
}
.lds-grid {
  display: inline-block;
  position: relative;
  width: 80px;
  height: 80px;
}
.lds-grid div {
  position: absolute;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: #fff;
  animation: lds-grid 1.2s linear infinite;
}
.lds-grid div:nth-child(1) {
  top: 8px;
  left: 8px;
  animation-delay: 0s;
}
.lds-grid div:nth-child(2) {
  top: 8px;
  left: 32px;
  animation-delay: -0.4s;
}
.lds-grid div:nth-child(3) {
  top: 8px;
  left: 56px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(4) {
  top: 32px;
  left: 8px;
  animation-delay: -0.4s;
}
.lds-grid div:nth-child(5) {
  top: 32px;
  left: 32px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(6) {
  top: 32px;
  left: 56px;
  animation-delay: -1.2s;
}
.lds-grid div:nth-child(7) {
  top: 56px;
  left: 8px;
  animation-delay: -0.8s;
}
.lds-grid div:nth-child(8) {
  top: 56px;
  left: 32px;
  animation-delay: -1.2s;
}
.lds-grid div:nth-child(9) {
  top: 56px;
  left: 56px;
  animation-delay: -1.6s;
}
@keyframes lds-grid {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
}
dialog::backdrop {
  background-color: black;
}
/*# sourceMappingURL=style2.css.map */