/* Bryntum v7 shared overrides (post 6.3.1 -> 7.3.4 migration, 2026-08).
   v7 themes are CSS-variable driven: they no longer bake in a font, and form
   field borders live on a pseudo-element of .b-field-inner controlled by
   --b-text-field-* variables — element-level border overrides do nothing.
   Cross-page Bryntum styling belongs HERE, not copy-pasted per template. */

/* v6 material forced Roboto on all Bryntum widgets (grid.material.css bundled
   the Roboto 300/400/500/700 faces); v7 inherits the page font. Keep the
   familiar Roboto look (Roboto is already loaded by the layout). */
.b-widget {
    font-family: Roboto, "Open Sans", sans-serif;
}

/* SELECTOR NOTE: material3-light.css declares its variables twice — on
   :root:not(.b-nothing) AND on .b-bryntum:not(.b-nothing) — and Widget's
   defaultCls puts .b-bryntum on EVERY widget's own element. A variable set on
   the widget element always beats one inherited from :root (proximity, not
   specificity), so a plain :root override of anything in the theme's
   .b-bryntum block silently does nothing. Overrides must therefore also
   target the widget elements themselves: .b-bryntum.b-bryntum is (0,3,0),
   out-gunning the theme's (0,2,0) regardless of stylesheet order. The :root
   leg keeps covering variables the theme only defines at :root. */
:root:not(.b-nothing),
.b-bryntum.b-bryntum:not(.b-nothing) {
    /* Focus/hover accent for all Bryntum form fields (filter bars, toolbars,
       cell editors). Replaces the dead per-template
       `.b-field-inner:focus-within { border-color: #428BCA }` copies. */
    --b-text-field-focus-border-color: #428BCA;
    --b-text-field-hover-border-color: #9ec5e4;

    /* v6 themes set no widget text colour (widgets inherited the page's
       #333333 from components.css). v7 defaults to --b-text-1 (near-black),
       which reads noticeably darker. */
    --b-widget-color: #333333;
    --b-list-item-color: #616161;

    /* Menus (e.g. the "Set Follow-up / Assign Task" caret dropdowns on the
       Orders/Quotes grids). v6 material rendered a white menu with #616161
       item text/icons and a #eeeeee focus state; v7 material3 uses
       near-black text on a primary-tinted panel. Menus float in the float
       root outside any grid container, so this cannot be scoped per grid. */
    --b-menu-background: #ffffff;
    --b-menu-item-color: #616161;
    --b-menu-item-hover-color: #616161;
    --b-menu-item-focus-color: #616161;
    --b-menu-item-hover-icon-color: #616161;
    --b-menu-item-focus-icon-color: #616161;
    --b-menu-item-hover-background: #eeeeee;
    --b-menu-item-focus-background: #eeeeee;
}
