[ADD] web: font-sans-serif utility class

Part of the overall v16 SCSS optimization/restyle, task-2704984.

task-2918463

Part-of: odoo/odoo#97051

addons/web/static/src/legacy/frontend/keyboard_navigation_mixin.js

@@ -78,7 +78,7 @@ odoo.define('web.KeyboardNavigationMixin', function (require) {
             }
             var accesskeyElements = $(document).find('[accesskey]').filter(':visible');
             _.each(accesskeyElements, function (elem) {
-                var overlay = $(_.str.sprintf("<div class='o_web_accesskey_overlay'>%s</div>", $(elem).attr('accesskey').toUpperCase()));
+                var overlay = $(_.str.sprintf("<div class='o_web_accesskey_overlay font-sans-serif'>%s</div>", $(elem).attr('accesskey').toUpperCase()));
 
                 var $overlayParent;
                 if (elem.tagName.toUpperCase() === "INPUT") {

addons/web/static/src/libs/bootstrap/utilities_custom.scss

@@ -103,6 +103,15 @@ $utilities: map-merge(
                 values: $utilities-sizes,
             ),
         ),
+        "font-family":  map-merge(
+            map-get($utilities, "font-family"),
+            (
+                values: map-merge(
+                    map-get(map-get($utilities, "font-family"), "values"),
+                    (sans-serif: var(--#{$variable-prefix}font-sans-serif)),
+                ),
+            ),
+        ),
     ),
 );
 

addons/web/static/src/webclient/webclient.scss

@@ -52,10 +52,6 @@ kbd {
   @include bg-variant(".bg-#{$-name}-light", rgba(map-get($theme-colors, $-name), 0.5), $-safe-text-color);
 }
 
-.o_web_accesskey_overlay {
-  font-family: $font-family-sans-serif;
-}
-
 //== Badges
 .badge {
   min-width: $o-badge-min-width;