Passing data from a persistent layout into a page?

[tight hawk]

I'm trying to pass data from a persistent layout into a page, but cannot for the life of me figure it out. All of the search results I've found are talking about the opposite direction (sending data from a page to a persistent layout), which is not what I'm trying to achieve. Perhaps this is really simple and I'm overlooking something obvious - one can hope!

More specifically, I have a dark/light theme toggle in a persistent layout, and would like to pass the current theme into any pages that need it.
The (relatively simple) structure that I have is:

• BaseLayout (persistent) - theme state is here, reactive variable called theme with a property called current with a value of the current theme (system/light/dark).
  -- MainLayout (persistent)
  --- Pages go here
  The default persistent layouts are set up as [BaseLayout, MainLayout]. Only one page (the home page) overrides that to be just BaseLayout.

I want to get the current theme from BaseLayout into any pages that need it. Specifically, I need it for my Contact page so that I can determine whether I should be displaying hCaptcha with a light or dark theme, based on the currently-selected theme.

[thorn stirrup]

You could use provide / inject, or write a composable that uses a shared state, for example the way VueUse does it; https://vueuse.org/core/useDark/#usedark / https://vueuse.org/core/useColorMode/#usecolormode

[tight hawk]

I didn't know about provide/inject, that's really handy. Much appreciated!