style(tooltip): Add emphasis styling for the text in rich tooltips.

PiperOrigin-RevId: 345450112

Author: Shi Shu

packages/mdc-tooltip/_tooltip-theme.scss

@@ -36,7 +36,8 @@ $label-color: text-primary-on-dark;
 
 // Rich Tooltip variables
 $rich-background-color: rgba(white, theme-color.text-emphasis(medium));
-$rich-text-color: text-primary-on-light;
+$rich-title-text-color: text-primary-on-light;
+$rich-content-text-color: rgba(black, theme-color.text-emphasis(medium));
 
 // Use a custom property so IE11 does not use "normal" and instead uses provided
 // fall-back value.
@@ -103,11 +104,21 @@ $z-index: 2;
 
 // Sets the color of the rich tooltip text.
 // @param {Color | String} $color
-@mixin rich-text-ink-color($color, $query: feature-targeting.all()) {
+@mixin rich-text-ink-color(
+  $title-color,
+  $content-color,
+  $query: feature-targeting.all()
+) {
   $feat-color: feature-targeting.create-target($query, color);
   @include feature-targeting.targets($feat-color) {
     .mdc-tooltip__surface {
-      @include theme.prop(color, $color);
+      .mdc-tooltip__title {
+        @include theme.prop(color, $title-color);
+      }
+
+      .mdc-tooltip__content {
+        @include theme.prop(color, $content-color);
+      }
     }
   }
 }

packages/mdc-tooltip/_tooltip.scss

@@ -95,7 +95,8 @@ $exit-duration: 75ms;
         $query: $query
       );
       @include tooltip-theme.rich-text-ink-color(
-        tooltip-theme.$rich-text-color,
+        tooltip-theme.$rich-title-text-color,
+        tooltip-theme.$rich-content-text-color,
         $query: $query
       );
       @include feature-targeting.targets($feat-structure) {