How to Style HoverTool CSS

[behelit29]

In bokeh 3.0.0 and beyond, is there a way to pass the equivalent of stylesheets to HoverTool? I’m looking to change the text and background color of the hover itself. I’m working through upgrading from 2.4.2 to 3.2.1 and I’ve been able to style the rest of my dashboard using InlineStyleSheet, but I can’t figure out how to do the same for the HoverTool.

I took the notebook from Sizing mode example is broken · Issue #12453 · bokeh/bokeh · GitHub and modified it to get

from bokeh.layouts import row, column
from bokeh.plotting import figure
from bokeh.models import Select, HoverTool, InlineStyleSheet
from bokeh.io import show

plot_css = InlineStyleSheet(css="""
    :host { --tooltip-color: green !important; }
""")
plot = figure(stylesheets=[plot_css])
plot.circle([1, 2, 3], [1, 2, 3])
plot.add_tools(HoverTool())

test_css = InlineStyleSheet(css="""
    :host { border: 10px solid black; }
""")

container = row(plot, height=800, sizing_mode="stretch_width", stylesheets=[test_css])

select = Select(options=["A", "B"])
layout = column(select, container)
layout.sizing_mode = "stretch_both" # set separately to avoid also setting children

show(layout)

I can see in the final html that it tried to set the --tooltip-color (inherited from div.bk-Canvas) but that was overridden by a host: {} section above. I’m sure I’m not interjecting the style correctly but I was wondering if there’s a better known way to style hovertools.