Mermaid ER diagram uses certain light mode elements in the default dark theme

Steps to reproduce

Create a Mermaid ER diagram using this code block:

    Parent {
	    uuid id
	    text title
	Child {
		uuid id
		text title
    Parent ||--|o Child : has

Did you follow the troubleshooting guide?


Expected result

In the dark theme, all text should be easily readable.

Actual result

It looks fine in the default light theme, but in the default dark theme certain elements - such as the background colour of table cells - seem to use the light theme colors.


	Obsidian version: v1.4.13
	Installer version: v1.4.13
	Operating system: Darwin Kernel Version 22.6.0: Wed Jul  5 22:21:56 PDT 2023; root:xnu-8796.141.3~6/RELEASE_X86_64 22.6.0
	Login status: not logged in
	Insider build toggle: off
	Live preview: on
	Legacy editor: off
	Base theme: dark
	Community theme: none
	Snippets enabled: 0
	Restricted mode: on


From the dev tools I found the issue to be that the fill attribute is hardcoded and doesn’t use CSS variables:


For now I’ve added this custom CSS snippet to patch the styles:

.er.attributeBoxOdd {
  fill: var(--background-primary) !important;
.er.attributeBoxEven {
  fill: var(--background-secondary) !important;