bug: --button-color does not modify cancel button color in toasts

# Bug Report

**Ionic version:**

[ ] **4.x**
[x] **5.x**

**Current behavior:**

Toast [custom css property](https://ionicframework.com/docs/api/toast#css-custom-properties) `--button-color` does not affect cancel button.

**Expected behavior:**

Affecting a color through `--button-color` should modify the color of all buttons present in the toast

**Steps to reproduce:**

1. start a template
2. add a toast
3. add a `--button-color` property in app.scss

**Related code:**

app.component.ts

```ts
const toast = await this.toastCtrl.create({
header: 'Toast header',
message: 'Click to Close',
position: 'top',
buttons: [
{
side: 'start',
icon: 'star',
text: 'Favorite',
handler: () => {
console.log('Favorite clicked');
}
}, {
text: 'Done',
role: 'cancel',
handler: () => {
console.log('Cancel clicked');
}
}
]
});
toast.present();
```

app.scss

```scss
ion-toast {
--background: red;
--button-color: red;
}
```

Start by reproducing the toast from app.component.ts with the --button-color rule in app.scss. Read the toast CSS custom-properties documentation and inspect the toast implementation to trace how button roles receive their color. Done means --button-color changes the color of every button, including the role="cancel" button.

Rédigé par le modèle d'indexation à partir du texte de l'issue.