Match journey graph nodes state background color to the UX mocks.

[mocks](https://www.figma.com/design/hjGhaADlX5DjElz8P8o9gE/GNP-journey-node-status-validation?node-id=903-21187&t=DbnW3pVRqFx54zeu-0)

PiperOrigin-RevId: 831341679

Author: Googler

src/app/node.spec.ts

@@ -141,6 +141,18 @@ describe('DAG Node', () => {
       expect(createGroup).not.toThrow();
     });
 
+    it('Allows overriding the background color for the state badge',
+       fakeAsync(async () => {
+         const customBgColor = 'rgb(128, 0, 128)';
+         const node = new DagNode('c', 'execution', 'FAILED', {
+           options: {'stateBg': customBgColor},
+         });
+         fixture.componentInstance.fakeNode = node;
+
+         const stateElement = await harness.nodeStateElement();
+         const style = await stateElement.getAttribute('style');
+         expect(style).toContain(`background: ${customBgColor}`);
+       }));
   });
 
   describe('Internals', () => {

src/app/node.ts

@@ -227,7 +227,10 @@ export class DagNodeEl implements OnInit, OnDestroy {
       icon ? fetchIcon(icon, key) : '';
 
   isNoState = isNoState;
-  bgForState = (state: NodeState) => bgForState(state, this.theme);
+  bgForState = (state: NodeState) => {
+    const stateBg = this.node?.options?.['stateBg'] as string | undefined;
+    return stateBg ? stateBg : bgForState(state, this.theme);
+  };
   iconForState = (state: NodeState) => iconForState(state, this.theme);
   isTextIcon = isTextIcon;
   convertStateToRuntime = convertStateToRuntime;

src/app/test_resources/node_harness.ts

@@ -47,6 +47,13 @@ export class DagNodeElHarness extends ComponentHarness {
         MatIconHarness.with({selector: '.icon-space .icon.right .mat-icon'}))();
   }
 
+  /**
+   * Returns the `<div>` element for the node state.
+   */
+  async nodeStateElement(): Promise<TestElement> {
+    return this.locatorFor('.icon-space.state')();
+  }
+
   /** Is the icon for the current node Text instead of SVG */
   async hasTextIcon() {
     const element =