Fix color in account dropdown

When going from dark mode to normal mode, account dropdown is not
readible because it is stuck with white color for font.

Google-Bug-Id: b/205521987

Change-Id: I6fca97b95a078813c5793dcff05a00ce6061b751

polygerrit-ui/app/elements/core/gr-account-dropdown/gr-account-dropdown.ts

diff --git a/polygerrit-ui/app/elements/core/gr-account-dropdown/gr-account-dropdown.ts b/polygerrit-ui/app/elements/core/gr-account-dropdown/gr-account-dropdown.ts
index ac3d5f4..03fb4d5 100644
--- a/polygerrit-ui/app/elements/core/gr-account-dropdown/gr-account-dropdown.ts
+++ b/polygerrit-ui/app/elements/core/gr-account-dropdown/gr-account-dropdown.ts
@@ -83,6 +83,7 @@
         gr-dropdown {
           padding: 0 var(--spacing-m);
           --gr-button-text-color: var(--header-text-color);
+          --gr-dropdown-item-color: var(--primary-text-color);
         }
         gr-avatar {
           height: 2em;
@@ -94,36 +95,23 @@
   }
 
   override render() {
-    // To pass CSS mixins for @apply to Polymer components, they need to appear
-    // in <style> inside the template.
-    /* eslint-disable lit/prefer-static-styles */
-    const customStyle = html`
-      <style>
-        gr-dropdown {
-          --gr-dropdown-item: {
-            color: var(--primary-text-color);
-          }
-        }
-      </style>
-    `;
-    return html`${customStyle}
-      <gr-dropdown
-        link=""
-        .items="${this.links}"
-        .topContent="${this.topContent}"
-        @tap-item-shortcuts=${this._handleShortcutsTap}
-        .horizontalAlign=${'right'}
+    return html`<gr-dropdown
+      link=""
+      .items="${this.links}"
+      .topContent="${this.topContent}"
+      @tap-item-shortcuts=${this._handleShortcutsTap}
+      .horizontalAlign=${'right'}
+    >
+      <span ?hidden="${this._hasAvatars}"
+        >${this._accountName(this.account)}</span
       >
-        <span ?hidden="${this._hasAvatars}"
-          >${this._accountName(this.account)}</span
-        >
-        <gr-avatar
-          .account="${this.account}"
-          ?hidden=${!this._hasAvatars}
-          .imageSize=${56}
-          aria-label="Account avatar"
-        ></gr-avatar>
-      </gr-dropdown>`;
+      <gr-avatar
+        .account="${this.account}"
+        ?hidden=${!this._hasAvatars}
+        .imageSize=${56}
+        aria-label="Account avatar"
+      ></gr-avatar>
+    </gr-dropdown>`;
   }
 
   get links(): DropdownLink[] | undefined {

polygerrit-ui/app/elements/core/gr-main-header/gr-main-header_html.ts

diff --git a/polygerrit-ui/app/elements/core/gr-main-header/gr-main-header_html.ts b/polygerrit-ui/app/elements/core/gr-main-header/gr-main-header_html.ts
index b745c3d..b623e8e 100644
--- a/polygerrit-ui/app/elements/core/gr-main-header/gr-main-header_html.ts
+++ b/polygerrit-ui/app/elements/core/gr-main-header/gr-main-header_html.ts
@@ -86,9 +86,7 @@
       padding: var(--spacing-m);
     }
     gr-dropdown {
-      --gr-dropdown-item: {
-        color: var(--primary-text-color);
-      }
+      --gr-dropdown-item-color: var(--primary-text-color);
     }
     .settingsButton {
       margin-left: var(--spacing-m);

polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls.ts

diff --git a/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls.ts b/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls.ts
index 418c368..1b854b4 100644
--- a/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls.ts
+++ b/polygerrit-ui/app/elements/edit/gr-edit-file-controls/gr-edit-file-controls.ts
@@ -50,6 +50,7 @@
           justify-content: flex-end;
         }
         gr-dropdown {
+          --gr-dropdown-item-color: var(--link-color);
           --gr-button-padding: var(--spacing-xs) var(--spacing-s);
         }
         #actions {
@@ -69,7 +70,6 @@
           --gr-dropdown-item: {
             background-color: transparent;
             border: none;
-            color: var(--link-color);
             text-transform: uppercase;
           }
         }

polygerrit-ui/app/elements/shared/gr-dropdown/gr-dropdown_html.ts

diff --git a/polygerrit-ui/app/elements/shared/gr-dropdown/gr-dropdown_html.ts b/polygerrit-ui/app/elements/shared/gr-dropdown/gr-dropdown_html.ts
index 3c07d94..082a10b 100644
--- a/polygerrit-ui/app/elements/shared/gr-dropdown/gr-dropdown_html.ts
+++ b/polygerrit-ui/app/elements/shared/gr-dropdown/gr-dropdown_html.ts
@@ -58,6 +58,7 @@
       padding: var(--spacing-m) var(--spacing-l);
     }
     li .itemAction {
+      color: var(--gr-dropdown-item-color);
       @apply --gr-dropdown-item;
     }
     li .itemAction.disabled {
@@ -83,6 +84,7 @@
     .topContent {
       display: block;
       padding: var(--spacing-m) var(--spacing-l);
+      color: var(--gr-dropdown-item-color);
       @apply --gr-dropdown-item;
     }
     .bold-text {