:root {
  --spacing-1: 15px;
  --spacing-2: 20px;
  --spacing-3: 25px;
  --textfield-font-size: 13px;

  --forgot-password-page-width-1: 100vw;
  --forgot-password-page-height-1: 100vh;

  --forgot-password-form-width-1: 360px;
  --forgot-password-form-height-1: 526px;

  --logo-width-1: 20px;
  --forgot-font-size-medium: 13px;

  --forgot-color-1: #101828;
  --forgot-color-2: #1570ef;
  --forgot-color-3: #475467;
}

.forgot-password-page {
  width: var(--forgot-password-page-width-1);
  display: flex;
  justify-content: center;
  min-height: var(--forgot-password-page-height-1);
}

.forgot-password-form {
  width: var(--forgot-password-form-width-1);
  height: var(--forgot-password-form-height-1);
  margin: 90px auto;
}

.forgot-password-form-header {
  justify-content: center;
  align-items: center;
  text-align: center;
}

.forgot-password-form-header-logo {
  margin: 0 auto;
}

.forgot-password-v-gap-large {
  height: 32px;
}

.forgot-password-v-gap-medium {
  height: 24px;
}

.forgot-password-v-gap-small {
  height: 12px;
}

.forgot-password-form-heading {
  font-size: 16px;
  font-weight: 700;
  color: #101828;
}

.forgot-password-form-subheading {
  font-size: 13px;
  font-weight: 500;
  color: var(--forgot-color-3);
}

.forgot-password-body {
  width: 360px;
}

#forgot-password-email-input {
  width: 308px;
  height: 11px;
  font-size: var(--textfield-font-size);
}

.forgot-password-back-button {
  display: flex;
  justify-content: center;
  align-items: center;
}

.forgot-password-back-button-img {
  width: 20px;
  height: 20px;
  margin-right: 5px;
}

.forgot-password-back-button-text {
  font-size: 13px;
  font-weight: 500;
  color: var(--forgot-color-3);
}