.login-form {
  gap: $gap-page-component; // 24px between buttons and form

  &--hidden {
    opacity: 0;
  }

  &__sso-image {
    vertical-align: middle;
    height: 20px;
    width: 20px;
    margin-right: 10px;
    border-radius: 20%;
  }

  &__sso-legend {
    vertical-align: middle;
  }

  &__login-actions,
  &__form {
    display: flex;
    flex-direction: column;
    gap: $gap-form;
  }

  // Login button styles
  // Login and SSO button widths will always be equal
  // Min of 208px with login-button widening if SSO button is wider
  &__login-actions {
    max-width: min-content;
    align-items: center;
    align-self: center;
  }

  &__login-btn {
    min-width: 100%;
  }

  &__sso-btn.button {
    min-width: 208px; // Must override form's .button specificity
    width: max-content;
    border: 1px solid $core-fleet-black;
    white-space: nowrap;
  }
  // End login button styles
}

.two-factor-check-email {
  align-items: start;
  gap: $pad-xlarge;

  h1 {
    font-size: $large;
    font-weight: $bold;
    margin: 0;
  }

  .back-link {
    svg {
      path {
        fill: transparent;
      }
    }
  }
}
