Can’t change field width using CSS (see result)

Hi! I have been following instructions found online. Here is my form code:

<label id="cf7-focus-field">[text* your-name placeholder "Name"]</label>

<label>[email* your-email placeholder "Email"]</label>

[countrytext countrytext-968]

[submit "Sign Up"]

And I put this in my Customizer Additional CSS section:

.wpcf7 input[type="text"], 
.wpcf7 input[type="email"] {
    width: 100% !important;
}

And here is the result:

https://i.ibb.co/k6DHstp/Screenshot-2022-12-22-at-1-04-44-PM.png

Anyone have any ideas? Thanks!