Update toast styles to match Figma (#12833)

* Warn users on unsupported browsers before they lack features

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update Learn more link

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update toast styles to match Figma

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Remove test code

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* update tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update tests

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

playwright/pages/toasts.ts

@@ -45,7 +45,7 @@ export class Toasts {
      */
     public async acceptToast(expectedTitle: string): Promise<void> {
         const toast = await this.getToast(expectedTitle);
-        await toast.locator(".mx_Toast_buttons .mx_AccessibleButton_kind_primary").click();
+        await toast.locator('.mx_Toast_buttons button[data-kind="primary"]').click();
     }
 
     /**
@@ -55,6 +55,6 @@ export class Toasts {
      */
     public async rejectToast(expectedTitle: string): Promise<void> {
         const toast = await this.getToast(expectedTitle);
-        await toast.locator(".mx_Toast_buttons .mx_AccessibleButton_kind_danger_outline").click();
+        await toast.locator('.mx_Toast_buttons button[data-kind="secondary"]').click();
     }
 }