Add variables for the open submenu in the offcanvas navbar, so it does not get the active link background

Problem/Motivation

In the small-screen offcanvas navbar, sass/components/partials/_navbar-offcanvas.scss gives every open submenu the background of the active link:

.dropdown-menu {
  // TODO - using $navbar-offcanvas-link-active-bg looks strange here,
  // my guess is that we should use transparent or a new var?
  background-color: $navbar-offcanvas-link-active-bg;
  ...
  > .active > a {
    background-color: adjust-color($navbar-offcanvas-link-active-bg, $lightness: -6.5%);
  }
}

• An open submenu gets $navbar-offcanvas-link-active-bg whether or not it holds the current page.
• When a site sets $navbar-offcanvas-link-active-bg to a visible colour to mark the current page, every submenu the visitor opens gets that colour too. An open submenu that is not on the active trail then looks like the current section.
• A site cannot change this without overriding the rule, because the submenu background has no variable of its own.

The bug is not visible with the defaults: $navbar-offcanvas-link-active-bg resolves to $header-link-hover-bg, which is transparent.

The same partial also styles the toggle of an open submenu (.show > a) with $navbar-offcanvas-link-active-bg and $navbar-offcanvas-link-active-color.

Steps to reproduce

1. In a bs_base child theme, set $navbar-offcanvas-link-active-bg: #cfe2ff; and compile.
2. On a small screen, open the offcanvas navbar on a page that is in one submenu, for example under "Publications".
3. Open another submenu, for example "About us".
4. Expected: only the active trail has the active background. Actual: the "About us" submenu also gets #cfe2ff.

Proposed resolution

Add variables for the open submenu and the open toggle in sass/variables/_bs_base.scss. Each defaults to the value the partial uses today, so the compiled CSS does not change for existing sites:

$navbar-offcanvas-link-open-color:    $navbar-offcanvas-link-active-color !default;
$navbar-offcanvas-link-open-bg:       $navbar-offcanvas-link-active-bg !default;
$navbar-offcanvas-dropdown-menu-bg:   $navbar-offcanvas-link-active-bg !default;
$navbar-offcanvas-dropdown-link-active-bg: adjust-color($navbar-offcanvas-link-active-bg, $lightness: -6.5%) !default;

Use them in _navbar-offcanvas.scss:

• .dropdown-menu uses $navbar-offcanvas-dropdown-menu-bg.
• .dropdown-menu > .active > a uses $navbar-offcanvas-dropdown-link-active-bg.
• .show > a and its caret colours use $navbar-offcanvas-link-open-bg and $navbar-offcanvas-link-open-color.
• The TODO is replaced by a comment saying the open submenu and the open toggle have their own variables.

A site that marks the current page with a background then sets $navbar-offcanvas-dropdown-menu-bg: transparent;, and only the active trail keeps the colour.

Remaining tasks

• Review the patch. With the default variables, the compiled css/components/navbar-offcanvas.css is unchanged.
• Decide what to do with the .show > a selector. Bootstrap 5 puts the show class on the toggle link and on the .dropdown-menu, not on the parent li, so .show > a matches nothing in the Bootstrap 5 menu markup. The two open variables only take effect if the selector is changed, for example to .nav-link.show.

User interface changes

None with the default variables.

API changes

Four new Sass variables: $navbar-offcanvas-link-open-color, $navbar-offcanvas-link-open-bg, $navbar-offcanvas-dropdown-menu-bg, $navbar-offcanvas-dropdown-link-active-bg.

Data model changes

None.