How to customize send file button?

You can not change value or description directly in HTML for security reasons, but there are some CSS or jQuery solutions like the one you have in this FIDDLE for example (see others in the links below). But since they are "hacks", it is not possible to say how each one will work in all browsers (mainly older ones).

Source: Answer in SOen 1 , Answer in SOen 2 and SOen 3 Response

You have to add a class to the slash through CSS.

For example:

<input id="file" name="file" type="file" class="file_customizada" />

Then you can style in CSS:

.file_customizada::-webkit-file-upload-button {
  visibility: hidden;
}
.custom-file-input::before {
  content: 'Select some files';
  display: inline-block;
  background: -webkit-linear-gradient(top, #f9f9f9, #e3e3e3);
  border: 1px solid #999;
  border-radius: 3px;
  padding: 5px 8px;
  outline: none;
  white-space: nowrap;
  -webkit-user-select: none;
  cursor: pointer;
  text-shadow: 1px 1px #fff;
  font-weight: 700;
  font-size: 10pt;
}
.file_customizada:hover::before {
  border-color: black;
}
.file_customizada:active::before {
  background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
}

EDIT:

The part to change the text can be done this way: For this you need to use the LABEL tag

<label class="labelInput">
    <input type="file" required/>
    <span>O meu texto</span>
</label>

and in the CSS part give the style you want. An example:

label.labelInput input[type="file"] {
    position: fixed;
    top: -1000px;
}

labelInput {
    border: 2px solid #AAA;
    border-radius: 4px;
    padding: 2px 5px;
    margin: 2px;
    background: #DDD;
    display: inline-block;
}
.labelInput:hover {
    background: #CCC;
}
.labelInput:active {
    background: #CCF;
}
.labelInput :invalid + span {
    color: #A44;
}
.labelInput :valid + span {
    color: #4A4;
}

Example: link