It does not restrict the types of characters that can be input, but browsers will prevent submission if the input value does not match your pattern.

If you do not want to allow certain character inputs, you can use JavaScript to remove those characters: onkeyup="this.value = this.value.replace(/[^0-9-]/g, '');".

input:invalid {
    color: red;
}

<form>
    <input type="tel" id="phone" name="phone_number" placeholder="555-555-5555" pattern="\d{3}-\d{3}-\d{4}" onkeyup="this.value = this.value.replace(/[^0-9-]/g, '');">
    <input type="submit" value="Submit">
</form>

Because many country use char in the phone numbers like ’+-()’ space etc.

https://developer.mozilla.org/en-US/docs/Web/HTML/Element/input/tel

Andy's link to the documentation had the answer I was looking for.

the input value is not automatically validated to a particular format before the form can be submitted, because formats for telephone numbers vary so much around the world