novo-elements 13.2.0 → 13.4.0

package/elements/form/extras/address/Address.scss

@@ -148,3 +148,80 @@
     }
   }
 }
+
+:host-context([data-theme='bh2026']) {
+  gap: var(--field-spacing-gap);
+
+  // Take out the space that the overlay template takes up between the fields
+  novo-overlay-template {
+    display: none;
+  }
+
+  // Each sub-field gets its own bordered input treatment
+  .street-address,
+  .apt,
+  .city,
+  .state,
+  .zip,
+  .country-name {
+    border: var(--field-border-width-default) solid var(--field-color-border-default);
+    border-radius: var(--field-border-radius-default);
+    background: var(--field-color-background-default);
+    padding: var(--field-spacing-padding-vertical) var(--field-spacing-padding-horizontal) !important;
+    min-height: 4rem;
+    box-sizing: border-box;
+    gap: var(--field-spacing-gap);
+
+    &:hover {
+      border-color: var(--field-color-border-hover);
+    }
+    &:focus-within {
+      border-width: var(--field-border-width-focus);
+      border-color: var(--field-color-border-focus);
+    }
+
+    input,
+    novo-picker > ::ng-deep input {
+      border: none !important;
+      border-bottom: none !important;
+      &:hover,
+      &:focus {
+        border: none !important;
+        border-bottom: none !important;
+      }
+    }
+    div[type="button"] {
+      border-bottom: none !important;
+      padding: 0 !important;
+    }
+
+    &.disabled {
+      border-color: var(--field-color-border-disabled);
+      border-style: dashed;
+      background: var(--field-color-background-disabled);
+    }
+
+    &.invalid {
+      border-color: var(--field-color-border-negative);
+    }
+
+    i {
+      border-bottom: none !important;
+
+      &.required-indicator.bhi-circle {
+        line-height: 1rem;
+      }
+      &.required-indicator.bhi-check {
+        line-height: 1.8rem;
+      }
+    }
+  }
+
+  // address1 full width on its own row; address2 full width on the row below
+  .street-address {
+    flex: 0 0 100%;
+  }
+  .apt {
+    flex: 0 0 100%;
+  }
+}

package/elements/form/fieldset-header.scss

@@ -15,3 +15,35 @@
     display: none;
   }
 }
+
+:host-context([data-theme='bh2026'] .card-section) {
+  padding: var(--card-spacing-header-padding-vertical) var(--card-spacing-header-padding-horizontal);
+  margin: 0 0 var(--card-spacing-header-padding-vertical);
+  background: var(--background-bright);
+  border-bottom: 1px solid var(--color-border-default);
+  align-items: center;
+  gap: var(--spacing-gap-sm);
+  font-size: var(--typography-title-small-font-size, 1.8rem);
+  font-weight: 600;
+  line-height: var(--typography-title-small-line-height, 2.4rem);
+  letter-spacing: var(--typography-title-small-letter-spacing, 0);
+  text-transform: capitalize;
+  color: var(--color-text-body);
+  > span {
+    flex: 1 0 0;
+    min-width: 0;
+  }
+  ::ng-deep novo-icon {
+    font-size: 1.6rem;
+    width: 1.6rem;
+    height: 1.6rem;
+    flex-shrink: 0;
+    color: var(--color-content-icon);
+    margin: 0;
+    i {
+      font-size: 1.6rem;
+      width: 1.6rem;
+      height: 1.6rem;
+    }
+  }
+}

package/elements/form/index.d.ts

@@ -945,8 +945,10 @@ declare class NovoControlTemplates implements AfterViewInit {
 declare class NovoFieldsetHeaderElement {
     title: string;
     icon: string;
+    cardSection: boolean;
+    get cardIcon(): string;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoFieldsetHeaderElement, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFieldsetHeaderElement, "novo-fieldset-header", never, { "title": { "alias": "title"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; }, {}, never, ["*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFieldsetHeaderElement, "novo-fieldset-header", never, { "title": { "alias": "title"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "cardSection": { "alias": "cardSection"; "required": false; }; }, {}, never, ["*"], false, never>;
 }
 declare class NovoFieldsetElement {
     controls: Array<any>;
@@ -958,8 +960,9 @@ declare class NovoFieldsetElement {
     isEmbedded: boolean;
     isInlineEmbedded: boolean;
     hidden: boolean;
+    cardSection: boolean;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoFieldsetElement, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFieldsetElement, "novo-fieldset", never, { "controls": { "alias": "controls"; "required": false; }; "form": { "alias": "form"; "required": false; }; "title": { "alias": "title"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "index": { "alias": "index"; "required": false; }; "autoFocus": { "alias": "autoFocus"; "required": false; }; "isEmbedded": { "alias": "isEmbedded"; "required": false; }; "isInlineEmbedded": { "alias": "isInlineEmbedded"; "required": false; }; "hidden": { "alias": "hidden"; "required": false; }; }, {}, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFieldsetElement, "novo-fieldset", never, { "controls": { "alias": "controls"; "required": false; }; "form": { "alias": "form"; "required": false; }; "title": { "alias": "title"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "index": { "alias": "index"; "required": false; }; "autoFocus": { "alias": "autoFocus"; "required": false; }; "isEmbedded": { "alias": "isEmbedded"; "required": false; }; "isInlineEmbedded": { "alias": "isInlineEmbedded"; "required": false; }; "hidden": { "alias": "hidden"; "required": false; }; "cardSection": { "alias": "cardSection"; "required": false; }; }, {}, never, never, false, never>;
 }
 declare class NovoDynamicFormElement implements OnChanges, OnInit, AfterContentInit {
     private element;
@@ -970,6 +973,7 @@ declare class NovoDynamicFormElement implements OnChanges, OnInit, AfterContentI
     layout: string;
     hideNonRequiredFields: boolean;
     autoFocusFirstField: boolean;
+    readonly hasCardSections: i0.InputSignal<boolean>;
     customTemplates: QueryList<NovoTemplate>;
     private fieldsAlreadyHidden;
     allFieldsRequired: boolean;
@@ -977,10 +981,14 @@ declare class NovoDynamicFormElement implements OnChanges, OnInit, AfterContentI
     showingAllFields: boolean;
     showingRequiredFields: boolean;
     numControls: number;
+    private readonly theme;
+    readonly effectiveCardSections: i0.Signal<boolean>;
+    get visibleFieldsets(): NovoFieldset[];
     constructor(element: ElementRef, templates: NovoTemplateService);
     ngOnInit(): void;
     ngOnChanges(changes?: SimpleChanges): void;
     ngAfterContentInit(): void;
+    hasVisibleControls(fieldset: NovoFieldset): boolean;
     showAllFields(): void;
     showOnlyRequired(hideRequiredWithValue: any): void;
     get values(): any;
@@ -988,7 +996,7 @@ declare class NovoDynamicFormElement implements OnChanges, OnInit, AfterContentI
     updatedValues(): any;
     forceValidation(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoDynamicFormElement, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoDynamicFormElement, "novo-dynamic-form", never, { "controls": { "alias": "controls"; "required": false; }; "fieldsets": { "alias": "fieldsets"; "required": false; }; "form": { "alias": "form"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "hideNonRequiredFields": { "alias": "hideNonRequiredFields"; "required": false; }; "autoFocusFirstField": { "alias": "autoFocusFirstField"; "required": false; }; }, {}, ["customTemplates"], ["form-title", "form-subtitle"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoDynamicFormElement, "novo-dynamic-form", never, { "controls": { "alias": "controls"; "required": false; }; "fieldsets": { "alias": "fieldsets"; "required": false; }; "form": { "alias": "form"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "hideNonRequiredFields": { "alias": "hideNonRequiredFields"; "required": false; }; "autoFocusFirstField": { "alias": "autoFocusFirstField"; "required": false; }; "hasCardSections": { "alias": "hasCardSections"; "required": false; "isSignal": true; }; }, {}, ["customTemplates"], ["form-title", "form-subtitle"], false, never>;
 }
 
 interface AddressLookupResult {
@@ -1301,6 +1309,8 @@ declare class NovoFormElement implements AfterContentInit, OnInit {
     form: NovoFormGroup;
     layout: string;
     hideHeader: boolean;
+    readonly hasCardSections: i0.InputSignal<boolean>;
+    readonly effectiveCardSections: i0.Signal<boolean>;
     customTemplates: QueryList<NovoTemplate>;
     showingAllFields: boolean;
     showingRequiredFields: boolean;
@@ -1313,7 +1323,7 @@ declare class NovoFormElement implements AfterContentInit, OnInit {
     showOnlyRequired(hideRequiredWithValue: any): void;
     forceValidation(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoFormElement, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFormElement, "novo-form", never, { "form": { "alias": "form"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "hideHeader": { "alias": "hideHeader"; "required": false; }; }, {}, ["customTemplates"], ["form-title", "form-subtitle", "*"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoFormElement, "novo-form", never, { "form": { "alias": "form"; "required": false; }; "layout": { "alias": "layout"; "required": false; }; "hideHeader": { "alias": "hideHeader"; "required": false; }; "hasCardSections": { "alias": "hasCardSections"; "required": false; "isSignal": true; }; }, {}, ["customTemplates"], ["form-title", "form-subtitle", "*"], false, never>;
 }
 
 declare class NovoFormModule {

package/elements/header/Header.scss

@@ -152,9 +152,51 @@
   }
 }
 
-// bh2026: soften the entity-accent underline
+// bh2026: frosted translucent header + entity squircle icon
 :host-context([data-theme='bh2026']) {
-  &[class*='novo-accent-'] > section:first-of-type {
-    border-bottom: 1px solid var(--color-border-default, #f0f5f9);
+  & > section {
+    gap: var(--spacing-gap-lg);
+  }
+
+  .header-actions {
+    gap: var(--spacing-gap-sm);
+  }
+
+  ::ng-deep utils,
+  ::ng-deep novo-utils {
+    gap: var(--spacing-gap-sm);
+  }
+
+  &[class*='novo-accent-'] {
+    background: var(--header-background, var(--color-transparency-white-90));
+    backdrop-filter: blur(12px);
+    box-shadow: 0 1px 2px var(--color-transparency-charcoal-08);
+    padding-top: var(--spacing-md);
+    padding-left: var(--spacing-lg);
+    padding-right: var(--spacing-lg);
+
+    & > section:first-of-type {
+      border-bottom: none;
+    }
+
+    utils {
+      color: var(--color-text-subtle);
+    }
+  }
+
+  @each $entity, $color in $entity-colors {
+    &.novo-accent-#{$entity} {
+      ::ng-deep .header-icon i {
+        color: var(--color-white);
+        background: $color;
+        border-radius: var(--border-radius-sm);
+        width: var(--typography-font-size-40);
+        height: var(--typography-font-size-40);
+        display: flex;
+        align-items: center;
+        justify-content: center;
+      }
+    }
   }
+  background-color: transparent;
 }

package/elements/layout/index.d.ts

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { AfterContentInit, ChangeDetectorRef, ElementRef, NgZone, DestroyRef, InjectionToken, AfterContentChecked, OnDestroy, EventEmitter, DoCheck, QueryList } from '@angular/core';
+import { ElementRef, AfterContentInit, ChangeDetectorRef, NgZone, DestroyRef, InjectionToken, AfterContentChecked, OnDestroy, EventEmitter, DoCheck, QueryList } from '@angular/core';
 import { Directionality } from '@angular/cdk/bidi';
 import { BooleanInput, NumberInput } from '@angular/cdk/coercion';
 import { CdkScrollable, ScrollDispatcher, ViewportRuler } from '@angular/cdk/overlay';
@@ -9,6 +9,14 @@ import { FocusTrapFactory, FocusMonitor, FocusOrigin } from '@angular/cdk/a11y';
 import { Platform } from '@angular/cdk/platform';
 import * as i6 from '@angular/common';
 
+type NavTransitionState = 'collapsed' | 'expanding' | 'expanded' | 'collapsing';
+declare class CollapsibleNavExpansionEvent extends Event {
+    srcEvent: Event;
+    private _expandPrevented;
+    get expandPrevented(): boolean;
+    constructor(srcEvent: Event);
+    preventExpand(): void;
+}
 /**
  * A slide-out navigation panel that expands to a full-width panel or collapses to a narrow icon rail.
  * Generic building block: consumers project their own header, body, and footer content.
@@ -20,10 +28,22 @@ declare class NovoCollapsibleNavComponent {
     expandedWidth: i0.InputSignal<string>;
     /** Width of the panel when collapsed to the icon rail. */
     collapsedWidth: i0.InputSignal<string>;
+    /** Time in ms to delay between the user entering the nav region, and expanding it */
+    expandDelay: i0.ModelSignal<number>;
     /** When true, hovering a collapsed panel temporarily expands it as an overlay without affecting layout. */
     overlayOnHover: i0.InputSignal<boolean>;
+    hoveredChange: i0.OutputEmitterRef<boolean>;
+    transitionChange: i0.OutputEmitterRef<NavTransitionState>;
+    manualExpand: i0.OutputEmitterRef<CollapsibleNavExpansionEvent>;
+    readonly element: ElementRef<any>;
+    private readonly destroyRef;
     private readonly isHovered;
+    private readonly isHoveredDebounced$;
+    private readonly isEffectiveHovered;
     private readonly effectiveCollapsed;
+    private readonly clicked$;
+    private readonly activationKeyPressed$;
+    private readonly manualExpandUnprevented$;
     constructor();
     onMouseEnter(): void;
     onMouseLeave(): void;
@@ -34,12 +54,16 @@ declare class NovoCollapsibleNavComponent {
             collapsedWidth: string;
         };
     };
+    transitionStart(event: any): void;
+    transitionEnd(event: any): void;
+    private debounceHover;
+    private setupExpandFromActivation;
     get isCollapsed(): boolean;
     toggle(): void;
     expand(): void;
     collapse(): void;
     static ɵfac: i0.ɵɵFactoryDeclaration<NovoCollapsibleNavComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<NovoCollapsibleNavComponent, "novo-collapsible-nav", ["novoCollapsibleNav"], { "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "expandedWidth": { "alias": "expandedWidth"; "required": false; "isSignal": true; }; "collapsedWidth": { "alias": "collapsedWidth"; "required": false; "isSignal": true; }; "overlayOnHover": { "alias": "overlayOnHover"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; }, never, ["[novo-collapsible-nav-header]", "[novo-collapsible-nav-body]", "[novo-collapsible-nav-footer]"], false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<NovoCollapsibleNavComponent, "novo-collapsible-nav", ["novoCollapsibleNav"], { "collapsed": { "alias": "collapsed"; "required": false; "isSignal": true; }; "expandedWidth": { "alias": "expandedWidth"; "required": false; "isSignal": true; }; "collapsedWidth": { "alias": "collapsedWidth"; "required": false; "isSignal": true; }; "expandDelay": { "alias": "expandDelay"; "required": false; "isSignal": true; }; "overlayOnHover": { "alias": "overlayOnHover"; "required": false; "isSignal": true; }; }, { "collapsed": "collapsedChange"; "expandDelay": "expandDelayChange"; "hoveredChange": "hoveredChange"; "transitionChange": "transitionChange"; "manualExpand": "manualExpand"; }, never, ["[novo-collapsible-nav-header]", "[novo-collapsible-nav-body]", "[novo-collapsible-nav-footer]"], false, never>;
 }
 
 declare class NovoLayoutContent extends CdkScrollable implements AfterContentInit {
@@ -335,5 +359,5 @@ declare class NovoLayoutModule {
     static ɵinj: i0.ɵɵInjectorDeclaration<NovoLayoutModule>;
 }
 
-export { NOVO_LAYOUT_CONTAINER, NOVO_LAYOUT_DEFAULT_AUTOSIZE, NOVO_LAYOUT_DEFAULT_AUTOSIZE_FACTORY, NovoCollapsibleNavComponent, NovoLayoutContainer, NovoLayoutContent, NovoLayoutModule, NovoRailComponent, NovoSidenavComponent, throwNovoDuplicatedSidenavError };
-export type { NovoSidenavMode, NovoSidenavToggleResult };
+export { CollapsibleNavExpansionEvent, NOVO_LAYOUT_CONTAINER, NOVO_LAYOUT_DEFAULT_AUTOSIZE, NOVO_LAYOUT_DEFAULT_AUTOSIZE_FACTORY, NovoCollapsibleNavComponent, NovoLayoutContainer, NovoLayoutContent, NovoLayoutModule, NovoRailComponent, NovoSidenavComponent, throwNovoDuplicatedSidenavError };
+export type { NavTransitionState, NovoSidenavMode, NovoSidenavToggleResult };

package/elements/list/list-item-content.scss

@@ -1,10 +1,10 @@
 @import "../../styles/variables.scss";
 
 @include theme-colors() using ($name, $color, $contrast, $tint, $shade, $pale) {
-  :host-context([theme="#{$name}"]) {
-    &.novo-item-content > ::ng-deep * {
-      color: rgba(#fff, 0.65);
-    }
+  // Wonky deprecation: For 2026, stringently avoid using * selectors to apply font/color changes - prefer inherit functionality
+  // This setup made it very hard to provide overrides.
+  :host-context([theme="#{$name}"]).novo-item-content {
+    color: rgba(#fff, 0.65);
   }
 }
 
@@ -15,13 +15,14 @@
 :host {
   display: flex;
   margin-left: 0.2em;
-  &.novo-item-content > ::ng-deep * {
+  
+  &.novo-item-content {
     color: rgba(#434343, 0.85);
-  }
-  &.novo-item-content ::ng-deep i {
-    @include theme-colors() using ($name, $color, $contrast, $tint, $shade, $pale) {
-      &.#{$name} {
-        color: getCssVarname($name);
+    ::ng-deep i {
+      @include theme-colors() using ($name, $color, $contrast, $tint, $shade, $pale) {
+        &.#{$name} {
+          color: getCssVarname($name);
+        }
       }
     }
   }

package/elements/menu/menu-content.component.scss

@@ -16,6 +16,7 @@
       cursor: default;
       list-style: none;
       background-color: var(--background-bright);
+      border-radius: var(--border-radius-sm);
       padding-inline-start: 0px !important;
       box-shadow: $shadow-multi;
       :hover {

package/elements/modal/modal.component.scss

@@ -3,7 +3,7 @@
 :host {
   display: block;
   background-color: var(--background-bright);
-  border-radius: var(--border-radius-default, 4px);
+  border-radius: var(--border-radius-md, 4px);
   box-shadow: 0 1px 7px rgba(0, 0, 0, 0.09), 0 1px 3px rgba(0, 0, 0, 0.2);
   z-index: z(modal);
   position: relative;
@@ -17,8 +17,8 @@
   }
 
   > ::ng-deep header {
-    border-top-left-radius: 4px;
-    border-top-right-radius: 4px;
+    border-top-left-radius: var(--border-radius-md, 4px);
+    border-top-right-radius: var(--border-radius-md, 4px);
     overflow: hidden;
 
     h1,
@@ -44,13 +44,3 @@
     }
   }
 }
-
-// bh2026: rounded modal and header top corners.
-:host-context([data-theme='bh2026']) {
-  border-radius: var(--border-radius-md, 1.6rem);
-
-  > ::ng-deep header {
-    border-top-left-radius: var(--border-radius-md, 1.6rem);
-    border-top-right-radius: var(--border-radius-md, 1.6rem);
-  }
-}

package/elements/modal/notification.component.scss

@@ -4,7 +4,7 @@
   text-align: center;
   display: block;
   background-color: var(--background-bright);
-  border-radius: var(--border-radius-default, 4px);
+  border-radius: var(--border-radius-md, 4px);
   box-shadow: 0 1px 7px rgba(0, 0, 0, 0.09), 0 1px 3px rgba(0, 0, 0, 0.2);
   z-index: z(modal);
   position: relative;
@@ -106,8 +106,3 @@
     }
   }
 }
-
-// bh2026: rounded notifications
-:host-context([data-theme='bh2026']) {
-  border-radius: var(--border-radius-md, 1.6rem);
-}

package/elements/picker/Picker.scss

@@ -6,16 +6,17 @@ novo-picker {
   align-items: center;
   flex-wrap: wrap;
   justify-content: flex-start;
-  padding-bottom: 5px;
+  padding-bottom: 0;
   transition: all 200ms ease-in-out;
   position: relative;
+
   &.selected,
   &.selected:hover {
     & + i {
       color: var(--color-positive);
     }
   }
-  padding-bottom: 0;
+
   &.ng-touched.ng-invalid:not(.ng-pristine) {
     > input,
     > input:hover,
@@ -23,6 +24,7 @@ novo-picker {
       border-bottom-color: transparent !important;
     }
   }
+
   input {
     font-size: 1em;
     background: transparent !important;
@@ -38,26 +40,33 @@ novo-picker {
     box-sizing: content-box;
     transition: all 300ms;
     color: #26282b;
+
     &:hover {
       border-bottom: 1px solid brightenLive('--color-dark', 15);
     }
+
     &:focus {
       border-bottom: 1px solid var(--color-positive);
     }
+
     &:invalid {
       border-bottom: 1px solid #da4453;
     }
+
     &.entity-picker {
       padding-left: 2em;
     }
+
     &.entity-selected {
       padding-left: 2.5em;
       background: var(--background-main) !important;
     }
+
     &:disabled {
       border-bottom: 1px dashed brightenLive('--color-dark', 45) !important;
     }
   }
+
   i.bhi-more {
     position: absolute;
     left: 0;
@@ -67,6 +76,7 @@ novo-picker {
     border-radius: var(--border-radius-sm, 3px);
     padding: 3px;
   }
+
   i.entity-icon {
     position: absolute;
     left: 5px;
@@ -76,28 +86,39 @@ novo-picker {
     padding: 3px;
     color: $white;
 
-    @include theme-colors() using ($name, $color, $contrast, $tint, $shade, $pale) {
+    @include theme-colors() using($name, $color, $contrast, $tint, $shade, $pale) {
       &.#{$name} {
         background: getCssVarname($name);
       }
     }
   }
+
   i.bhi-search,
   i.bhi-times {
     position: absolute;
     right: 0;
     color: var(--font-color-base);
+
     &.entity-selected {
       right: 5px;
     }
   }
+
   i.bhi-search {
-    top: 0px;
+    top: 0;
     font-size: var(--font-size-sm);
   }
+
   i.bhi-times {
-    top: 0px;
+    top: 0;
     cursor: pointer;
     font-size: var(--font-size-sm);
   }
+
+  [data-theme='bh2026'] & {
+    i {
+      font-size: var(--typography-body-lg-font-size);
+      line-height: normal;
+    }
+  }
 }

package/elements/picker/extras/picker-results/PickerResults.scss

@@ -44,6 +44,10 @@ entity-picker-results {
     color: black;
   }
 
+  > p {
+    margin: 0;
+  }
+
   picker-error,
   picker-loader,
   picker-null-recent-results,
@@ -167,6 +171,7 @@ entity-picker-results {
   background: $white;
   width: 100%;
   min-width: 250px;
+  display: block;
   novo-list {
     background: $white;
     min-width: 30rem;
@@ -300,3 +305,50 @@ distribution-list-picker-results {
   }
 }
 
+// bh2026: border belongs on the host (border is not clipped by overflow:hidden),
+// not on children (where overflow:hidden + border-radius clips the corners)
+:root[data-theme='bh2026'] {
+  picker-results,
+  entity-picker-results,
+  skill-specialty-picker-results {
+    border: 1px solid var(--color-border-default);
+    margin-block: var(--spacing-gap-sm);
+    background: var(--background-bright);
+
+    .novo-list,
+    novo-list,
+    ul {
+      border: none;
+      box-shadow: none;
+    }
+
+    picker-error,
+    picker-loader,
+    picker-null-recent-results,
+    picker-null-results,
+    .picker-error,
+    .picker-loader,
+    .picker-null-recent-results,
+    .picker-null-results {
+      border: none;
+      box-shadow: none;
+    }
+
+    > p {
+      margin: 0;
+      padding: var(--spacing-padding-md) var(--spacing-padding-lg);
+    }
+  }
+
+  workers-comp-codes-picker-results,
+  distribution-list-picker-results {
+    color: var(--text-secondary);
+    background: var(--background-body);
+    border-radius: var(--border-radius-sm);
+
+    .novo-list-item {
+      border-radius: var(--border-radius-sm);
+    }
+  }
+}
+

package/elements/progress/Progress.scss

@@ -36,3 +36,11 @@
     width: 100%;
   }
 }
+
+:host-context([data-theme='bh2026']) {
+  &.linear {
+    border-radius: var(--border-radius-pill);
+    background-color: var(--color-background-subtle-hover);
+    border-color: var(--color-border-default);
+  }
+}

package/elements/progress/ProgressBar.scss

@@ -106,8 +106,11 @@
   100% { transform: translateX(0%) }
 }
 
-// bh2026: pill progress bar ends (fill color rides on the deferred accent).
+// bh2026: pill ends; default fill uses primary blue only when no explicit color is set
 :host-context([data-theme='bh2026']) {
+  &.linear:not([color]) {
+    background-color: var(--button-primary-background);
+  }
   &.linear:first-child {
     border-radius: 999px 0 0 999px;
   }