.input {
  @include text-padding;

  color: var(--font-color);
  background-color: var(--accent-color);
  border: 1px var(--lighter-accent-color) solid;

  &:focus {
    border: 1px var(--lightest-accent-color) solid;
  }

  &[type="file"] {
    width: 40%;
  }

  &[type="checkbox"] {
    align-self: flex-start;
    margin: 0 0 0 10px;
  }
}

input {
  @extend .input;
}
