.site-login {
  padding: 64px 0 200px 0;
}
.site-login .site-login-inner {
  max-inline-size: 30rem;
  margin-inline-start: auto;
  margin-inline-end: auto;
}
.site-login .site-login-inner .site-login-overflow {
  position: relative;
  overflow: hidden;
  padding-inline-start: 0.25rem;
  padding-inline-end: 0.25rem;
}
.site-login .site-login-inner .site-login-overflow .login-page-tab {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 1.25rem;
  margin-bottom: 1.25rem;
}
.site-login .site-login-inner .site-login-overflow .login-page-tab li a {
  position: relative;
  font-size: 1.375rem;
  font-weight: 600;
  color: var(--color-gray-400);
  text-decoration: none;
  padding-inline-start: 0.25rem;
  padding-inline-end: 0.25rem;
  -webkit-transition: all 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
  transition: all 0.1s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.site-login .site-login-inner .site-login-overflow .login-page-tab li a.active {
  color: var(--color-black);
}
.site-login .site-login-inner .site-login-overflow .login-form-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  inline-size: 200%;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-transition: all 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: all 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.site-login .site-login-inner .site-login-overflow .login-form-container > * {
  padding: 0.0625rem;
  inline-size: 100%;
  -webkit-transition: opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    -webkit-transform 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    -webkit-transform 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: transform 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
  transition: transform 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    opacity 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955),
    -webkit-transform 0.4s cubic-bezier(0.455, 0.03, 0.515, 0.955);
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.register-form {
  opacity: 0;
}

.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p
  .woocommerce-form__label-for-checkbox
  span
  a {
  margin-inline-start: 0.25rem;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p
  .woocommerce-form__label-for-checkbox
  input:checked
  + span::before {
  background-color: var(--color-primary-background);
  border-color: transparent;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *
  label {
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > button {
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *
  button:hover {
  opacity: 0.9;
}

.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.register-form
  > p {
  font-size: 0.8125rem;
  text-align: center;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.register-form
  .woocommerce-privacy-policy-text {
  font-size: 0.75rem;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container.show-register-form {
  -webkit-transform: translateX(-50%);
  transform: translateX(50%);
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container.show-register-form
  .login-form {
  opacity: 0;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container.show-register-form
  .register-form {
  opacity: 1;
}

/**********************************************/
/*******              login              ******/
/**********************************************/

.login-form h2,
.register-form h2 {
  color: var(--Neutral---800, #292929);
  text-align: center;
  font-size: 24px;
  font-weight: 700;
  line-height: 110%;
  margin: 0;
  margin-bottom: 12px;
}

.login-form p,
.register-form p {
  color: var(--Neutral---400, #8f8f8f);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
  margin: 0;
  margin-bottom: 32px;
}

.woocommerce-form-login p {
  margin: 0;
}

.woocommerce-form-login p:nth-child(1),
.woocommerce-form-register p:nth-child(1) {
  margin: 0 0 20px 0;
}

.woocommerce-form-login p:nth-child(2),
.woocommerce-form-register p:nth-child(2) {
  margin: 0 0 20px 0;
}

.woocommerce-form-register .authentication-email {
  display: flex;
  gap: 5px;
  color: var(--Info, #2c84e5);
  font-size: 13px;
  font-weight: 500;
  line-height: 150%; /* 18px */
  align-items: center;
}

.woocommerce-form-register .authentication-email i {
  display: flex;
}

.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *
  input {
}

.woocommerce-form-row label {
}

.woocommerce-form-row {
  position: relative;
}

.woocommerce-form-row input {
  border-radius: 10px;
  border: 1px solid #d9d9d9;
  display: flex;
  width: 100%;
  padding: 16px;
  position: relative;
}
.woocommerce-form-row input:focus {
  outline: unset;
  border: 1.5px solid #367aff;
}
.woocommerce-form-row input:focus ~ label {
  color: #367aff !important;
}

.woocommerce-form-login .woocommerce-form-row:nth-child(1) label,
.woocommerce-form-register .woocommerce-form-row:nth-child(1) label,
.woocommerce-form-register .woocommerce-form-row label {
  position: absolute;
  right: 14px;
  top: -10px;
  background-color: #fff;
  padding: 0 4px;
  color: var(--Neutral---500, #666);
  font-size: 14px;
  font-weight: 500;
  line-height: 150%; /* 21px */
  z-index: 1;
}

.woocommerce-form-row input:-webkit-autofill {
  -webkit-box-shadow: 0 0 0px 1000px #fff inset !important;
}

.password-input {
  position: relative;
}

.password-input .show-password-input {
  position: absolute;
  left: 0.3rem;
  top: 1rem;
  border: none;
  background: transparent;
  display: -webkit-flex;
  display: flex;
  align-items: center;
  justify-content: center;
}

.password-input .show-password-input::before {
  content: "";
  display: inline-block;
  inline-size: 20px; /* width */
  block-size: 20px; /* height */
  margin-inline-end: 0.4rem; /* Ã™ÂÃ˜Â§Ã˜ÂµÃ™â€žÃ™â€¡ Ã˜Â§Ã˜Â² Ã™â€¦Ã˜ÂªÃ™â€ Ã˜â€º RTL/LTR-safe */
  background: no-repeat center / contain
    url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTEyLjQ5OTggMTBDMTIuNDk5OCAxMS4zODA3IDExLjM4MDUgMTIuNSA5Ljk5OTggMTIuNUM4LjYxOTA4IDEyLjUgNy40OTk4IDExLjM4MDcgNy40OTk4IDEwQzcuNDk5OCA4LjYxOTI5IDguNjE5MDggNy41IDkuOTk5OCA3LjVDMTEuMzgwNSA3LjUgMTIuNDk5OCA4LjYxOTI5IDEyLjQ5OTggMTBaIiBzdHJva2U9IiM2NjY2NjYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+CjxwYXRoIGQ9Ik0yLjA0ODM0IDkuOTk5OTdDMy4xMTAyMyA2LjYxOTA3IDYuMjY4OCA0LjE2NjY3IDEwLjAwMDIgNC4xNjY2N0MxMy43MzE1IDQuMTY2NjcgMTYuODkwMSA2LjYxOTEgMTcuOTUyIDEwQzE2Ljg5MDEgMTMuMzgwOSAxMy43MzE1IDE1LjgzMzMgMTAuMDAwMiAxNS44MzMzQzYuMjY4OCAxNS44MzMzIDMuMTEwMjIgMTMuMzgwOSAyLjA0ODM0IDkuOTk5OTdaIiBzdHJva2U9IiM2NjY2NjYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=");
}

.password-input .show-password-input.display-password::before {
  content: "";
  display: inline-block;
  inline-size: 20px; /* width */
  block-size: 20px; /* height */
  margin-inline-end: 0.4rem; /* Ã™ÂÃ˜Â§Ã˜ÂµÃ™â€žÃ™â€¡ Ã˜Â§Ã˜Â² Ã™â€¦Ã˜ÂªÃ™â€ Ã˜â€º RTL/LTR-safe */
  background: no-repeat center / contain
    url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAiIGhlaWdodD0iMjAiIHZpZXdCb3g9IjAgMCAyMCAyMCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTguOTUyNDUgNC4yNDM2QzkuMjkxMTMgNC4xOTM1MyA5LjY0MDUxIDQuMTY2NjcgMTAuMDAwMyA0LjE2NjY3QzE0LjI1NDUgNC4xNjY2NyAxNy4wNDYxIDcuOTIwNyAxNy45ODM5IDkuNDA1NjlDMTguMDk3NCA5LjU4NTQyIDE4LjE1NDIgOS42NzUyOCAxOC4xODU5IDkuODEzODlDMTguMjA5OSA5LjkxNzk5IDE4LjIwOTggMTAuMDgyMiAxOC4xODU5IDEwLjE4NjNDMTguMTU0MSAxMC4zMjQ5IDE4LjA5NyAxMC40MTU0IDE3Ljk4MjcgMTAuNTk2M0MxNy43MzI4IDEwLjk5MTggMTcuMzUxOCAxMS41NDc2IDE2Ljg0NzEgMTIuMTUwNE01LjYwMzYgNS41OTU4NkMzLjgwMTg3IDYuODE4MDggMi41Nzg3MSA4LjUxNjE1IDIuMDE3NTkgOS40MDQ0QzEuOTAzNTcgOS41ODQ4OSAxLjg0NjU2IDkuNjc1MTQgMS44MTQ3OCA5LjgxMzczQzEuNzkwOTEgOS45MTc4MyAxLjc5MDkgMTAuMDgyIDEuODE0NzYgMTAuMTg2MUMxLjg0NjUyIDEwLjMyNDcgMS45MDMyOCAxMC40MTQ2IDIuMDE2NzggMTAuNTk0M0MyLjk1NDYyIDEyLjA3OTMgNS43NDYxOCAxNS44MzMzIDEwLjAwMDMgMTUuODMzM0MxMS43MTU3IDE1LjgzMzMgMTMuMTkzMiAxNS4yMjMgMTQuNDA3MyAxNC4zOTcyTTIuNTAwMzUgMi41TDE3LjUwMDMgMTcuNU04LjIzMjU4IDguMjMyMjNDNy43ODAxNyA4LjY4NDY0IDcuNTAwMzUgOS4zMDk2NCA3LjUwMDM1IDEwQzcuNTAwMzUgMTEuMzgwNyA4LjYxOTYzIDEyLjUgMTAuMDAwMyAxMi41QzEwLjY5MDcgMTIuNSAxMS4zMTU3IDEyLjIyMDIgMTEuNzY4MSAxMS43Njc4IiBzdHJva2U9IiM2NjY2NjYiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+Cjwvc3ZnPgo=");
}

.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password {
  display: flex;
  justify-content: space-between;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p {
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p
  .woocommerce-form__label-for-checkbox {
  display: flex;
  align-items: center;
  margin: 0;
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p
  .woocommerce-form__label-for-checkbox
  input {
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p
  .woocommerce-form__label-for-checkbox
  span {
  color: var(--Neutral---500, #666);
  font-feature-settings: "liga" off, "clig" off;
  font-size: 12px;
  font-weight: 500;
  line-height: 150%; /* 18px */
}
.site-login
  .site-login-inner
  .site-login-overflow
  .login-form-container
  > *.login-form
  .lost-password
  p.woocommerce-LostPassword
  a {
  color: #367aff;
  font-feature-settings: "liga" off, "clig" off;
  font-family: IRANSansX;
  font-size: 12px;
  font-style: normal;
  font-weight: 500;
  line-height: 150%; /* 18px */
}

.woocommerce-form-login__submit,
.woocommerce-form-register__submit,
#wc-otp-row-send .button {
  border-radius: 10px;
  background: var(--Primary, #0c3c30);
  display: flex;
  padding: 16px 8px;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 120%; /* 16.8px */
  width: 100%;
  margin-bottom: 30.5px;
}

.or {
  /* 21px */
  height: 1px;
  background: #d9d9d9;
  width: 100%;
  margin-bottom: 30.5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.or span {
  color: #6e6e6e;
  font-size: 14px;
  font-weight: 500;
  line-height: 150%;
  background-color: #fff;
  padding: 0 10px;
}

a.google-btn {
  border-radius: 10px;
  border: 1px solid #e6e8e7;
  background: #fff;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.03);
  display: flex;
  padding: 16px 8px;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

a.google-btn i {
  display: flex;
}

a.google-btn span {
  color: var(--Neutral---700, #3d3d3d);
  font-size: 14px;
  font-weight: 500;
  line-height: 120%; /* 16.8px */
}
.woocommerce-form-login .auth-switch,
.woocommerce-form-register .auth-switch {
  color: var(--Neutral---500, #666);
  text-align: center;
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}

.woocommerce-form-login .auth-switch span,
.woocommerce-form-register .auth-switch span {
  color: #367aff;
  text-decoration-line: underline;
  text-underline-position: from-font;
  cursor: pointer;
}
small.wc-otp-countdown {
  display: block;
}
@media (max-width: 768px) {
  .site-login {
    padding: 96px 0 56px 0;
  }

  .login-form h2,
  .register-form h2 {
    font-size: 22px;
  }
  .woocommerce-form-register .authentication-email {
    font-size: 12px;
  }
}

/* lost password form */
.lost-password-form-wrapper {
  text-align: center;
  padding: 150px 0px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.lost_reset_password .title {
  margin: 0 0 12px 0;
  color: var(--Neutral---800, #292929);
  font-size: 24px;
  font-weight: 700;
  line-height: 110%; /* 26.4px */
}
.lost_reset_password p {
  margin: 0 0 32px 0;
  color: var(--Neutral---400, #8f8f8f);
  font-size: 14px;
  font-weight: 400;
  line-height: 150%; /* 21px */
}
.lost_reset_password .woocommerce-form-row {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 20px;
}
.lost_reset_password .woocommerce-form-row label {
  display: none;
}
.lost_reset_password .woocommerce-form-row .woocommerce-Button {
  border-radius: 10px;
  background: var(--Neutral---400, #8f8f8f);
  box-shadow: none;
  border: none;
  min-height: 48px;
  padding: 16px 8px;
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  line-height: 120%; /* 16.8px */
  letter-spacing: -0.14px;
  width: 100%;
  max-width: 400px;
}
.lost_reset_password .woocommerce-form-row .woocommerce-Button:hover {
  background: var(--Primary, #0c3c30);
}

.lost_reset_password input[type="text"] {
  max-width: 400px;
}
.lost-password-form-breadcrumb {
    margin-top: 24px;
}

@media (max-width: 768px) {
  .lost-password-form-wrapper {
    padding: 100px 16px;
  }
  .lost-password-form-breadcrumb {
    margin-top: 16px;
}
}
