.primary-btn > a,
.gform-footer > button.gform_button {
  display: inline-flex;
  background-color: var(--gcid-primary-color);
  border: 0;
  color: #ffffff;
  cursor: pointer;
  font-family: 'Inter', Helvetica, Arial, Lucida, sans-serif;
  font-size: 14px;
  font-weight: 600;
  line-height: 20px;
  border-radius: 8px;
  padding: 10px 16px;
  transition-property: background-color .35s var(--cubic-bezier);

  &:after {
    content: '';
    display: block;
    position: relative;
    width: 20px;
    height: 20px;
    background: url('/wp-content/themes/snaploader/images/icons/arrow-right-white.svg');
    margin-left: 4px;
    transition: margin-left .35s var(--cubic-bezier);
  }

  &:hover {
    background-color: var(--col-navy-hover);
    padding: 10px 16px;
    opacity: 1;

    &:after {
      margin-left: 8px;
    }
  }
}

.text-button > a {
  display: inline-grid;
  grid-template-columns: auto 24px;
  align-items: center;
  color: #0f2c4d;
  font-size: 24px;
  line-height: 32px;
  border-width: 0px;
  border-color: #333;
  transition-property: color;
  transition-duration: 300ms;
  transition-timing-function: ease;
  column-gap: 0;

  &:before,
  &:after {
    content: '';
    display: block;
    position: relative;
    width: 24px;
    height: 24px;
    top: unset;
    transform: unset;
    margin-left: 0;
    grid-column: 2;
    grid-row: 1;
    transition-property: margin-left, opacity;
    transition-duration: 300ms;
    transition-timing-function: ease;
  }

  &:before {
    background: url('/wp-content/themes/snaploader/images/icons/arrow-right-navy.svg') center / contain no-repeat;
    opacity: 1;
  }

  &:after {
    background: url('/wp-content/themes/snaploader/images/icons/arrow-right-purple.svg') center / contain no-repeat;
    opacity: 0;
  }

  &:hover {
    color: #535eee;

    &:before {
      margin-left: 4px;
      opacity: 0;
    }

    &:after {
      margin-left: 4px;
      opacity: 1;
    }
  }
}

.gform-footer > button.gform_button {
  float: right;
  margin-top: 32px;
}