breadcrumb text color should adapt to custom title block banner text color

Discussed in https://github.com/quarto-dev/quarto-cli/discussions/11647

^{Originally posted by lizevons December 10, 2024}

Description

Problem

I am creating a website that uses sidebar navigation with breadcrumbs. On some pages I would like to apply custom colours to the title block. I set these up in the yml header of the specific page where I would like the colours applied:

page.qmd

---
title: "Page with title-block-banner custom background"
title-block-banner: "#4097C2"
title-block-banner-color: white
---

The background colour is also applied to the breadcrumb section, however, the foreground (text colour) is not. I am not sure which css is applied to the breadcrumb text, but it seems to be the same as the body text, which is a dark colour on a light background. If you use a bright or dark banner background the breadcrumbs can be difficult to read.
Is it possible to either:

• Change the background of the breadcrumb to match the navbar
• Or change the text colour of the breadcrumb to match the title block banner text colour (title-block-banner-color)

The second would be my preferred option.
Here is how it renders:

I provide a reproducible example here