input[type='text'],
input[type='date'],
input[type='datetime'],
input[type='datetime-local'],
input[type='email'],
input[type='month'],
input[type='number'],
input[type='password'],
input[type='range'],
input[type='search'],
input[type='tel'],
input[type='text'],
input[type='time'],
input[type='url'],
input[type='week'],
textarea {
  width: 100%;
  height: var(--form-height);
  padding: 0 16px;
  font-size: var(--form-font-size);
  font-family: var(--ff-primary);
  font-weight: 500;
  background-color: var(--input-background);
  border-radius: var(--input-border-radius);
  border: var(--input-border);
  &::placeholder {
    color: var(--input-placeholder);
    font-size: var(--form-font-size);
    font-weight: 500;
  }
  &:hover {
    border-color: var(--input-border-hover);
    & + svg {
      path {
        stroke: var(--c-gray-500);
      }
    }
  }
  &:focus {
    border-color: var(--input-border-active);
    & + svg {
      path {
        stroke: var(--c-gray-500);
      }
    }
  }
  &:disabled {
    background-color: var(--input-background-disabled);
    border-color: var(--input-border-disabled);
    &::placeholder {
      color: var(--c-gray-300);
    }
    & + svg {
      path {
        stroke: var(--c-gray-300);
      }
    }
  }
}
textarea {
  height: 150px;
  padding: 16px;
  vertical-align: top;
}