fix(toast): update toast design to match MD spec (#16323)

Updates the Material Design Toast to closer match the spec: https://material.io/design/components/snackbars.html

- Updates the animation to use opacity, not translate
- Updates design with the right background, box-shadow, etc.
- Fixes the broken position middle of toast and updates e2e test to include this
- Allows for line breaks to be passed in the message

fixes #16271

core/src/components/toast/toast.tsx

@@ -28,9 +28,12 @@ export class Toast implements ComponentInterface, OverlayInterface {
   animation: Animation | undefined;
 
   @Prop({ connect: 'ion-animation-controller' }) animationCtrl!: HTMLIonAnimationControllerElement;
+
   @Prop({ context: 'config' }) config!: Config;
 
-  /** @internal */
+  /**
+   * @internal
+   */
   @Prop() overlayIndex!: number;
 
   /**