@fundamental-ngx/core 0.65.0-rc.8 → 0.65.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (44) hide show
  1. package/fesm2022/fundamental-ngx-core-avatar-group.mjs +118 -39
  2. package/fesm2022/fundamental-ngx-core-avatar-group.mjs.map +1 -1
  3. package/fesm2022/fundamental-ngx-core-combobox.mjs +166 -22
  4. package/fesm2022/fundamental-ngx-core-combobox.mjs.map +1 -1
  5. package/fesm2022/fundamental-ngx-core-date-picker.mjs +1 -4
  6. package/fesm2022/fundamental-ngx-core-date-picker.mjs.map +1 -1
  7. package/fesm2022/fundamental-ngx-core-datetime-picker.mjs +21 -0
  8. package/fesm2022/fundamental-ngx-core-datetime-picker.mjs.map +1 -1
  9. package/fesm2022/fundamental-ngx-core-icon.mjs +2 -2
  10. package/fesm2022/fundamental-ngx-core-icon.mjs.map +1 -1
  11. package/fesm2022/fundamental-ngx-core-list.mjs +10 -6
  12. package/fesm2022/fundamental-ngx-core-list.mjs.map +1 -1
  13. package/fesm2022/fundamental-ngx-core-menu.mjs +63 -2
  14. package/fesm2022/fundamental-ngx-core-menu.mjs.map +1 -1
  15. package/fesm2022/fundamental-ngx-core-multi-combobox.mjs +21 -36
  16. package/fesm2022/fundamental-ngx-core-multi-combobox.mjs.map +1 -1
  17. package/fesm2022/fundamental-ngx-core-multi-input.mjs +1 -1
  18. package/fesm2022/fundamental-ngx-core-multi-input.mjs.map +1 -1
  19. package/fesm2022/fundamental-ngx-core-popover.mjs +22 -40
  20. package/fesm2022/fundamental-ngx-core-popover.mjs.map +1 -1
  21. package/fesm2022/fundamental-ngx-core-select.mjs +1 -1
  22. package/fesm2022/fundamental-ngx-core-select.mjs.map +1 -1
  23. package/fesm2022/fundamental-ngx-core-settings.mjs +113 -13
  24. package/fesm2022/fundamental-ngx-core-settings.mjs.map +1 -1
  25. package/fesm2022/fundamental-ngx-core-table.mjs +373 -499
  26. package/fesm2022/fundamental-ngx-core-table.mjs.map +1 -1
  27. package/fesm2022/fundamental-ngx-core-token.mjs +1 -1
  28. package/fesm2022/fundamental-ngx-core-token.mjs.map +1 -1
  29. package/fesm2022/fundamental-ngx-core-upload-collection.mjs +1 -1
  30. package/fesm2022/fundamental-ngx-core-upload-collection.mjs.map +1 -1
  31. package/fesm2022/fundamental-ngx-core-vertical-navigation.mjs +1 -1
  32. package/fesm2022/fundamental-ngx-core-vertical-navigation.mjs.map +1 -1
  33. package/package.json +3 -3
  34. package/schematics/package.json +1 -1
  35. package/types/fundamental-ngx-core-avatar-group.d.ts +52 -19
  36. package/types/fundamental-ngx-core-combobox.d.ts +44 -6
  37. package/types/fundamental-ngx-core-datetime-picker.d.ts +3 -1
  38. package/types/fundamental-ngx-core-list.d.ts +4 -1
  39. package/types/fundamental-ngx-core-menu.d.ts +8 -1
  40. package/types/fundamental-ngx-core-mobile-mode.d.ts +2 -0
  41. package/types/fundamental-ngx-core-multi-combobox.d.ts +1 -1
  42. package/types/fundamental-ngx-core-popover.d.ts +11 -16
  43. package/types/fundamental-ngx-core-settings.d.ts +57 -5
  44. package/types/fundamental-ngx-core-table.d.ts +133 -164
@@ -1,13 +1,13 @@
1
1
  import { LiveAnnouncer } from '@angular/cdk/a11y';
2
2
  import { NgTemplateOutlet } from '@angular/common';
3
3
  import * as i0 from '@angular/core';
4
- import { InjectionToken, inject, TemplateRef, Input, Directive, ViewContainerRef, ElementRef, signal, DestroyRef, ChangeDetectorRef, ContentChildren, ViewEncapsulation, ChangeDetectionStrategy, Component, forwardRef, HostBinding, output, input, computed, Renderer2, ViewChildren, viewChild, ContentChild, NgModule } from '@angular/core';
4
+ import { InjectionToken, inject, TemplateRef, Input, Directive, ViewContainerRef, input, ElementRef, signal, DestroyRef, ChangeDetectorRef, ContentChildren, ViewEncapsulation, ChangeDetectionStrategy, Component, forwardRef, HostBinding, output, computed, Renderer2, ViewChildren, viewChild, ContentChild, NgModule } from '@angular/core';
5
5
  import { FDK_FOCUSABLE_ITEM_DIRECTIVE, ResizeObserverDirective, applyCssClass, FocusableItemDirective, RtlService, elementClick$, FocusableListDirective } from '@fundamental-ngx/cdk/utils';
6
6
  import { PopoverBodyHeaderDirective, PopoverComponent, PopoverControlComponent, PopoverBodyDirective } from '@fundamental-ngx/core/popover';
7
7
  import { FdTranslatePipe, resolveTranslationSignalFn } from '@fundamental-ngx/i18n';
8
8
  import { __decorate, __metadata } from 'tslib';
9
- import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
10
- import { BehaviorSubject, fromEvent, Subject, combineLatest, map, startWith, delayWhen, animationFrames, merge } from 'rxjs';
9
+ import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
10
+ import { BehaviorSubject, fromEvent, combineLatest, map, startWith, delayWhen, animationFrames, merge } from 'rxjs';
11
11
  import * as i1 from '@angular/cdk/portal';
12
12
  import { CdkPortalOutlet, TemplatePortal, PortalModule } from '@angular/cdk/portal';
13
13
  import { filter, switchMap } from 'rxjs/operators';
@@ -83,7 +83,7 @@ class AvatarGroupItemRendererDirective {
83
83
  const width = rect.width;
84
84
  const marginLeft = parseFloat(style.marginLeft);
85
85
  const marginRight = parseFloat(style.marginRight);
86
- if (!isNaN(width) && !isNaN(marginLeft) && !isNaN(marginRight)) {
86
+ if (width > 0 && !isNaN(marginLeft) && !isNaN(marginRight)) {
87
87
  this._lastSavedWidth = width + marginLeft + marginRight;
88
88
  }
89
89
  }
@@ -241,6 +241,18 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
241
241
 
242
242
  class AvatarGroupHostComponent {
243
243
  constructor() {
244
+ /**
245
+ * Maximum number of avatars to show before the overflow button.
246
+ * When set, overrides the width-based visibility calculation.
247
+ **/
248
+ this.maxVisibleItems = input(null, /* @ts-ignore */
249
+ ...(ngDevMode ? [{ debugName: "maxVisibleItems" }] : /* istanbul ignore next */ []));
250
+ /**
251
+ * The orientation of the avatar group.
252
+ * Options include 'horizontal' and 'vertical'.
253
+ **/
254
+ this.orientation = input('horizontal', /* @ts-ignore */
255
+ ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
244
256
  /** @hidden */
245
257
  this._resizeEmitter = inject(ResizeObserverDirective).resizeEvents$;
246
258
  /** The reference to the host element */
@@ -249,11 +261,11 @@ class AvatarGroupHostComponent {
249
261
  this._hiddenItems = signal([], /* @ts-ignore */
250
262
  ...(ngDevMode ? [{ debugName: "_hiddenItems" }] : /* istanbul ignore next */ []));
251
263
  /** @hidden */
264
+ this._maxVisibleItems$ = toObservable(this.maxVisibleItems);
265
+ /** @hidden */
252
266
  this._destroyRef = inject(DestroyRef);
253
267
  /** @hidden */
254
268
  this._cdr = inject(ChangeDetectorRef);
255
- /** @hidden */
256
- this._onChanges$ = new Subject();
257
269
  }
258
270
  /** @hidden */
259
271
  buildComponentCssClass() {
@@ -262,7 +274,7 @@ class AvatarGroupHostComponent {
262
274
  'fd-avatar-group',
263
275
  this.type === 'individual' ? 'fd-avatar-group--individual-type' : '',
264
276
  this.type === 'group' ? 'fd-avatar-group--group-type' : '',
265
- this.orientation ? 'fd-avatar-group--' + this.orientation : '',
277
+ this.orientation() ? 'fd-avatar-group--' + this.orientation() : '',
266
278
  this.size ? 'fd-avatar-group--' + this.size : ''
267
279
  ];
268
280
  }
@@ -271,18 +283,17 @@ class AvatarGroupHostComponent {
271
283
  this.buildComponentCssClass();
272
284
  }
273
285
  /** @hidden */
274
- ngOnChanges(changes) {
286
+ ngOnChanges() {
275
287
  this.buildComponentCssClass();
276
- this._onChanges$.next(changes);
277
288
  }
278
289
  /** @hidden */
279
290
  ngAfterViewInit() {
280
291
  combineLatest([
281
292
  this._resizeEmitter.pipe(map((entries) => entries[0].contentRect.width)),
282
293
  this._portals.changes.pipe(startWith(this._portals), map((r) => r.toArray())),
283
- this._onChanges$.pipe(startWith({}))
294
+ this._maxVisibleItems$
284
295
  ])
285
- .pipe(map(([containerWidth, items]) => this._calculateVisibility(containerWidth, items)), delayWhen(() => animationFrames()), takeUntilDestroyed(this._destroyRef))
296
+ .pipe(map(([containerWidth, items, maxVisibleItems]) => this._calculateVisibility(containerWidth, items, maxVisibleItems)), delayWhen(() => animationFrames()), takeUntilDestroyed(this._destroyRef))
286
297
  .subscribe(({ hiddenItems, visibleItems }) => {
287
298
  const allItems = this._portals.toArray();
288
299
  const total = allItems.length;
@@ -297,13 +308,50 @@ class AvatarGroupHostComponent {
297
308
  });
298
309
  }
299
310
  /** @hidden */
300
- _calculateVisibility(containerWidth, items) {
301
- if (this.orientation === 'vertical') {
302
- return {
303
- visibleItems: items,
304
- hiddenItems: []
305
- };
311
+ _calculateVisibility(containerWidth, items, maxVisibleItems) {
312
+ if (this.orientation() === 'vertical') {
313
+ return maxVisibleItems != null
314
+ ? this._calculateVisibilityWithMaxItems(Infinity, items, maxVisibleItems)
315
+ : { visibleItems: items, hiddenItems: [] };
316
+ }
317
+ return maxVisibleItems != null
318
+ ? this._calculateVisibilityWithMaxItems(containerWidth, items, maxVisibleItems)
319
+ : this._calculateVisibilityByWidth(containerWidth, items);
320
+ }
321
+ /** @hidden */
322
+ _calculateVisibilityWithMaxItems(containerWidth, items, maxVisibleItems) {
323
+ const forcedVisible = items.filter((i) => i.forceVisibility);
324
+ const regular = items.filter((i) => !i.forceVisibility);
325
+ const maxRegularSlots = Math.max(0, maxVisibleItems - forcedVisible.length);
326
+ // Respect both maxVisibleItems cap and containerWidth constraint
327
+ let accWidth = forcedVisible.reduce((acc, item) => acc + item.width, 0);
328
+ const visibleRegular = [];
329
+ for (let i = 0; i < Math.min(regular.length, maxRegularSlots); i++) {
330
+ const item = regular[i];
331
+ accWidth += item.width;
332
+ if (accWidth <= containerWidth) {
333
+ visibleRegular.push(item);
334
+ }
335
+ else {
336
+ break;
337
+ }
306
338
  }
339
+ const hiddenRegular = regular.slice(visibleRegular.length);
340
+ // If there are hidden items and visible regular items,
341
+ // move the last one to hidden to make room for overflow button
342
+ if (hiddenRegular.length > 0 && visibleRegular.length > 0) {
343
+ const movedItem = visibleRegular.pop();
344
+ if (movedItem) {
345
+ hiddenRegular.unshift(movedItem);
346
+ }
347
+ }
348
+ return {
349
+ visibleItems: [...forcedVisible, ...visibleRegular],
350
+ hiddenItems: hiddenRegular
351
+ };
352
+ }
353
+ /** @hidden */
354
+ _calculateVisibilityByWidth(containerWidth, items) {
307
355
  const visibleItems = items.filter((i) => i.forceVisibility);
308
356
  const hiddenItems = [];
309
357
  let accWidth = items.reduce((acc, item) => (item.forceVisibility ? acc + item.width : acc), 0);
@@ -319,9 +367,8 @@ class AvatarGroupHostComponent {
319
367
  hiddenItems.push(item);
320
368
  }
321
369
  }
322
- /* take last item from the visibleItems which is not forced to be visible and push it to the hiddenItems
323
- * This is done to free up the space for the overflow button
324
- */
370
+ // Take last item from the visibleItems which is not forced to be visible
371
+ // and push it to the hiddenItems to free up the space for the overflow button
325
372
  if (hiddenItems.length > 0) {
326
373
  const lastAllowedToBeHidden = visibleItems.reverse().findIndex((item) => !item.forceVisibility);
327
374
  hiddenItems.push(...visibleItems.splice(lastAllowedToBeHidden * -1, 1));
@@ -332,7 +379,7 @@ class AvatarGroupHostComponent {
332
379
  };
333
380
  }
334
381
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: AvatarGroupHostComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
335
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.0.5", type: AvatarGroupHostComponent, isStandalone: true, selector: "fd-avatar-group-host", inputs: { class: "class", type: "type", orientation: "orientation", size: "size", items: "items" }, queries: [{ propertyName: "_portals", predicate: AvatarGroupItemRendererDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["fd-avatar-group-host{position:relative}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
382
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: AvatarGroupHostComponent, isStandalone: true, selector: "fd-avatar-group-host", inputs: { class: { classPropertyName: "class", publicName: "class", isSignal: false, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: false, isRequired: false, transformFunction: null }, maxVisibleItems: { classPropertyName: "maxVisibleItems", publicName: "maxVisibleItems", isSignal: true, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "_portals", predicate: AvatarGroupItemRendererDirective, descendants: true }], usesOnChanges: true, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: ["fd-avatar-group-host{position:relative}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
336
383
  }
337
384
  __decorate([
338
385
  applyCssClass,
@@ -347,8 +394,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
347
394
  type: Input
348
395
  }], type: [{
349
396
  type: Input
350
- }], orientation: [{
351
- type: Input
352
397
  }], size: [{
353
398
  type: Input
354
399
  }], items: [{
@@ -356,7 +401,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
356
401
  }], _portals: [{
357
402
  type: ContentChildren,
358
403
  args: [AvatarGroupItemRendererDirective, { descendants: true }]
359
- }], buildComponentCssClass: [] } });
404
+ }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], buildComponentCssClass: [] } });
360
405
 
361
406
  /**
362
407
  * Avatar group overflow button component.
@@ -539,7 +584,11 @@ class DefaultAvatarGroupOverflowBodyComponent {
539
584
  // tabindex=-1 and isFocusable=false on each avatar via AvatarGroupItemRendererDirective,
540
585
  // making them invisible to fdkFocusableList and unreachable by keyboard.
541
586
  provide: AVATAR_GROUP_HOST_CONFIG,
542
- useValue: { type: 'individual', orientation: 'horizontal', size: 's' }
587
+ useValue: {
588
+ type: 'individual',
589
+ orientation: signal('horizontal'),
590
+ size: 's'
591
+ }
543
592
  }
544
593
  ], viewQueries: [{ propertyName: "_avatarGroupItemPortals", predicate: AvatarGroupItemRendererDirective, descendants: true }], ngImport: i0, template: "<div fd-popover-body-header>\n <div fd-bar barDesign=\"header\">\n <div fd-bar-left>\n @if (_isDetailStage) {\n <fd-button-bar\n (click)=\"openOverflowMain()\"\n [glyph]=\"navigationArrow()\"\n fdType=\"transparent\"\n [attr.aria-label]=\"('coreAvatarGroup.backButton' | fdTranslate)()\"\n [title]=\"('coreAvatarGroup.backButton' | fdTranslate)()\"\n ></fd-button-bar>\n }\n <fd-bar-element\n ><span\n class=\"fd-title\"\n [class]=\"'fd-title--h' + overflowHeadingLevel()\"\n role=\"heading\"\n [attr.aria-level]=\"overflowHeadingLevel()\"\n >\n {{ _isDetailStage ? _selectedItem.title : overflowPopoverTitle }}\n </span></fd-bar-element\n >\n @if (_isDetailStage) {\n <fd-bar-element>&nbsp;</fd-bar-element>\n }\n </div>\n </div>\n</div>\n<div\n class=\"fd-avatar-group__overflow-body\"\n [class.fd-avatar-group__overflow-body--no-padding]=\"_isDetailStage\"\n [class.fd-avatar-group__overflow-body--no-horizontal-scroll]=\"_isDetailStage\"\n fdkFocusableList\n role=\"list\"\n navigationDirection=\"horizontal\"\n>\n @if (_overflowPopoverStage === 'main') {\n @for (item of avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [avatarGroupItem]=\"item.avatarGroupItem\"\n [forceVisibility]=\"true\"\n [posInSet]=\"item.posInSet\"\n [setSize]=\"item.setSize\"\n >\n </ng-template>\n }\n } @else {\n <ng-template [ngTemplateOutlet]=\"_selectedItem.details\"></ng-template>\n }\n</div>\n", styles: ["fd-default-avatar-group-overflow-body{display:flex;flex-direction:column}\n"], dependencies: [{ kind: "ngmodule", type: PortalModule }, { kind: "directive", type: i1.CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "directive", type: AvatarGroupItemRendererDirective, selector: "[fdAvatarGroupItemPortal]", inputs: ["avatarGroupItem", "forceVisibility", "posInSet", "setSize"], exportAs: ["fdAvatarGroupItemPortal"] }, { kind: "directive", type: FocusableListDirective, selector: "[fdkFocusableList]", inputs: ["focusable", "navigationDirection", "contentDirection", "wrap", "listFocusedEventAnnouncer"], outputs: ["navigationDirectionChange", "contentDirectionChange", "itemFocused"], exportAs: ["fdkFocusableList"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: PopoverBodyHeaderDirective, selector: "[fdPopoverBodyHeader], [fd-popover-body-header]" }, { kind: "component", type: BarComponent, selector: "[fd-bar]", inputs: ["barDesign", "inPage", "inHomePage", "clear", "size", "initialSuggestionTitle", "initialSuggestionSubline", "role"] }, { kind: "component", type: ButtonBarComponent, selector: "fd-button-bar", inputs: ["fullWidth", "fdType", "title", "ariaLabelledby", "id"] }, { kind: "directive", type: BarElementDirective, selector: "fd-bar-element", inputs: ["fullWidth"] }, { kind: "directive", type: BarLeftDirective, selector: "[fd-bar-left]", inputs: ["stackContentsVertically"] }, { kind: "pipe", type: FdTranslatePipe, name: "fdTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
545
594
  }
@@ -566,7 +615,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
566
615
  // tabindex=-1 and isFocusable=false on each avatar via AvatarGroupItemRendererDirective,
567
616
  // making them invisible to fdkFocusableList and unreachable by keyboard.
568
617
  provide: AVATAR_GROUP_HOST_CONFIG,
569
- useValue: { type: 'individual', orientation: 'horizontal', size: 's' }
618
+ useValue: {
619
+ type: 'individual',
620
+ orientation: signal('horizontal'),
621
+ size: 's'
622
+ }
570
623
  }
571
624
  ], encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div fd-popover-body-header>\n <div fd-bar barDesign=\"header\">\n <div fd-bar-left>\n @if (_isDetailStage) {\n <fd-button-bar\n (click)=\"openOverflowMain()\"\n [glyph]=\"navigationArrow()\"\n fdType=\"transparent\"\n [attr.aria-label]=\"('coreAvatarGroup.backButton' | fdTranslate)()\"\n [title]=\"('coreAvatarGroup.backButton' | fdTranslate)()\"\n ></fd-button-bar>\n }\n <fd-bar-element\n ><span\n class=\"fd-title\"\n [class]=\"'fd-title--h' + overflowHeadingLevel()\"\n role=\"heading\"\n [attr.aria-level]=\"overflowHeadingLevel()\"\n >\n {{ _isDetailStage ? _selectedItem.title : overflowPopoverTitle }}\n </span></fd-bar-element\n >\n @if (_isDetailStage) {\n <fd-bar-element>&nbsp;</fd-bar-element>\n }\n </div>\n </div>\n</div>\n<div\n class=\"fd-avatar-group__overflow-body\"\n [class.fd-avatar-group__overflow-body--no-padding]=\"_isDetailStage\"\n [class.fd-avatar-group__overflow-body--no-horizontal-scroll]=\"_isDetailStage\"\n fdkFocusableList\n role=\"list\"\n navigationDirection=\"horizontal\"\n>\n @if (_overflowPopoverStage === 'main') {\n @for (item of avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [avatarGroupItem]=\"item.avatarGroupItem\"\n [forceVisibility]=\"true\"\n [posInSet]=\"item.posInSet\"\n [setSize]=\"item.setSize\"\n >\n </ng-template>\n }\n } @else {\n <ng-template [ngTemplateOutlet]=\"_selectedItem.details\"></ng-template>\n }\n</div>\n", styles: ["fd-default-avatar-group-overflow-body{display:flex;flex-direction:column}\n"] }]
572
625
  }], propDecorators: { avatars: [{
@@ -686,25 +739,53 @@ class AvatarGroupComponent {
686
739
  * `individual`: The avatars are displayed side-by-side and each avatar has its own click/tap area.
687
740
  * */
688
741
  this.type = 'individual';
689
- /**
690
- * Orientation of the AvatarGroup control.
691
- *
692
- * `horizontal`: The avatars are displayed horizontally.
693
- * `vertical`: The avatars are displayed vertically.
694
- */
695
- this.orientation = 'horizontal';
696
742
  /**
697
743
  * The spacing between the items depends on the size of the avatars in the group.
698
744
  * The size is also used for the default overflow button.
699
745
  * `xs`, `s`, `m`, `l`, `xl`
700
746
  */
701
747
  this.size = 'l';
748
+ /**
749
+ * Orientation of the AvatarGroup control.
750
+ *
751
+ * `horizontal`: The avatars are displayed horizontally.
752
+ * `vertical`: The avatars are displayed vertically.
753
+ */
754
+ this.orientation = input('horizontal', /* @ts-ignore */
755
+ ...(ngDevMode ? [{ debugName: "orientation" }] : /* istanbul ignore next */ []));
702
756
  /**
703
757
  * Heading level for the overflow popover title.
704
758
  * @default 5
705
759
  */
706
760
  this.overflowHeadingLevel = input(5, /* @ts-ignore */
707
761
  ...(ngDevMode ? [{ debugName: "overflowHeadingLevel" }] : /* istanbul ignore next */ []));
762
+ /**
763
+ * Placement of the group overflow popover relative to the avatar group.
764
+ * Defaults to `'right'` when `orientation="vertical"`, otherwise `'bottom'`.
765
+ * Use `'bottom-start'` / `'bottom-end'` to align to an edge.
766
+ * Only applies to `type="group"`.
767
+ */
768
+ this.popoverPlacement = input(/* @ts-ignore */
769
+ ...(ngDevMode ? [undefined, { debugName: "popoverPlacement" }] : /* istanbul ignore next */ []));
770
+ /** @hidden */
771
+ this._effectivePlacement = computed(() => this.popoverPlacement() ?? (this.orientation() === 'vertical' ? 'right' : 'bottom'), /* @ts-ignore */
772
+ ...(ngDevMode ? [{ debugName: "_effectivePlacement" }] : /* istanbul ignore next */ []));
773
+ /**
774
+ * Shape of the default overflow button.
775
+ * Use `'circle'` when the avatar group displays circle avatars, so the overflow button matches their shape.
776
+ * Has no effect when a custom overflow button is provided via `fdAvatarGroupOverflowButton`.
777
+ * @default 'square'
778
+ */
779
+ this.overflowButtonShape = input('square', /* @ts-ignore */
780
+ ...(ngDevMode ? [{ debugName: "overflowButtonShape" }] : /* istanbul ignore next */ []));
781
+ /**
782
+ * Maximum number of avatars to display before the overflow button appears.
783
+ * When set, the group shows exactly this many avatars regardless of the container width.
784
+ * When `null` (default), visibility is determined by the available container width.
785
+ * @default null
786
+ */
787
+ this.maxVisibleItems = input(null, /* @ts-ignore */
788
+ ...(ngDevMode ? [{ debugName: "maxVisibleItems" }] : /* istanbul ignore next */ []));
708
789
  /** @hidden */
709
790
  this._avatarGroupHost = viewChild(AvatarGroupHostComponent, /* @ts-ignore */
710
791
  ...(ngDevMode ? [{ debugName: "_avatarGroupHost" }] : /* istanbul ignore next */ []));
@@ -747,12 +828,12 @@ class AvatarGroupComponent {
747
828
  return this._translate('coreAvatarGroup.popupBodyAriaLabel', signal({ count }))();
748
829
  }
749
830
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: AvatarGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
750
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: AvatarGroupComponent, isStandalone: true, selector: "fd-avatar-group", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, overflowPopoverTitle: { classPropertyName: "overflowPopoverTitle", publicName: "overflowPopoverTitle", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, overflowHeadingLevel: { classPropertyName: "overflowHeadingLevel", publicName: "overflowHeadingLevel", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
831
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: AvatarGroupComponent, isStandalone: true, selector: "fd-avatar-group", inputs: { type: { classPropertyName: "type", publicName: "type", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, overflowPopoverTitle: { classPropertyName: "overflowPopoverTitle", publicName: "overflowPopoverTitle", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, overflowHeadingLevel: { classPropertyName: "overflowHeadingLevel", publicName: "overflowHeadingLevel", isSignal: true, isRequired: false, transformFunction: null }, popoverPlacement: { classPropertyName: "popoverPlacement", publicName: "popoverPlacement", isSignal: true, isRequired: false, transformFunction: null }, overflowButtonShape: { classPropertyName: "overflowButtonShape", publicName: "overflowButtonShape", isSignal: true, isRequired: false, transformFunction: null }, maxVisibleItems: { classPropertyName: "maxVisibleItems", publicName: "maxVisibleItems", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
751
832
  {
752
833
  provide: AVATAR_GROUP_HOST_CONFIG,
753
834
  useExisting: AvatarGroupComponent
754
835
  }
755
- ], queries: [{ propertyName: "_overflowButton", first: true, predicate: AvatarGroupOverflowButtonDirective, descendants: true }, { propertyName: "_avatarGroupPopoverBody", first: true, predicate: AvatarGroupOverflowBodyDirective, descendants: true }, { propertyName: "_avatars", predicate: AvatarGroupItemDirective }], viewQueries: [{ propertyName: "_avatarGroupHost", first: true, predicate: AvatarGroupHostComponent, descendants: true, isSignal: true }, { propertyName: "_avatarRenderers", predicate: AvatarGroupItemRendererDirective, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n@if (type === 'individual') {\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation\"\n fdkResizeObserver\n fdkFocusableList\n [contentDirection]=\"contentDirection()\"\n [wrap]=\"true\"\n [navigationDirection]=\"orientation\"\n [items]=\"_avatars\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelIndividual()\"\n (resized)=\"_detectChanges()\"\n (itemFocused)=\"_onItemFocused($event)\"\n >\n @for (item of _avatars; track item) {\n <fd-popover [noArrow]=\"false\" [focusAutoCapture]=\"true\">\n <fd-popover-control\n class=\"fd-avatar-group__popover-control\"\n tabindex=\"-1\"\n (click)=\"outletItem.element.focus()\"\n >\n <ng-template\n #outletItem=\"fdAvatarGroupItemPortal\"\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n </fd-popover-control>\n @if (item.details) {\n <ng-template fdPopoverBody>\n <ng-template [ngTemplateOutlet]=\"item.details\"></ng-template>\n </ng-template>\n }\n </fd-popover>\n }\n <ng-template [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\" let-hiddenItems>\n <fd-popover\n #overflowPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(hiddenItems.length)\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\" tabindex=\"-1\">\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button [size]=\"size\" [colorAccent]=\"1\">\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems, popoverRef: overflowPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n </ng-template>\n </fd-avatar-group-host>\n} @else {\n <fd-popover\n #groupPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(_avatars.length)\"\n fdkResizeObserver\n (resized)=\"_detectChanges()\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\">\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelGroup()\"\n role=\"button\"\n tabindex=\"0\"\n >\n @for (item of _avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n }\n <ng-template\n [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\"\n let-hiddenItems\n >\n <ng-template\n [ngTemplateOutlet]=\"overflowButtonTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems }\"\n ></ng-template>\n </ng-template>\n </fd-avatar-group-host>\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: _avatarRenderers, popoverRef: groupPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n}\n<ng-template #overflowButtonTemplate let-hiddenItems>\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button [size]=\"size\" [colorAccent]=\"1\" [fdkFocusableItem]=\"false\">\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n</ng-template>\n<ng-template #avatarGroupOverflowBodyTemplate let-hiddenItems let-popoverRef=\"popoverRef\">\n @if (_avatarGroupPopoverBody) {\n <ng-template\n [ngTemplateOutlet]=\"_avatarGroupPopoverBody._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-default-avatar-group-overflow-body\n [avatars]=\"hiddenItems\"\n [overflowPopoverTitle]=\"overflowPopoverTitle\"\n [overflowHeadingLevel]=\"overflowHeadingLevel()\"\n (escapePressed)=\"popoverRef?.close()\"\n />\n }\n</ng-template>\n", styles: [".fd-avatar{--fdAvatarZoomIconPosition:0;background-color:var(--fdAvatarBackgroundColor);background-position:50%;background-repeat:no-repeat;background-size:var(--fdAvatarBackgroundSize);border:0;border:var(--fdAvatarBorderWidth, .0625rem) solid var(--fdAvatarBorderColor);border-radius:var(--fdAvatarBorderRadius);-webkit-box-shadow:var(--fdAvatarBoxShadow);box-shadow:var(--fdAvatarBoxShadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdAvatarColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdAvatarFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdAvatarRatio);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdAvatarRatio);max-width:var(--fdAvatarRatio);min-height:var(--fdAvatarRatio);min-width:var(--fdAvatarRatio);padding-block:0;padding-inline:0;position:relative;text-shadow:var(--fdAvatarTextShadow);vertical-align:middle;width:var(--fdAvatarRatio)}.fd-avatar:after,.fd-avatar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar.is-focus,.fd-avatar:focus{outline:none}.fd-avatar.is-focus:after,.fd-avatar:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--interactive,.fd-avatar[role=button],.fd-avatar[tabindex=\"0\"]{cursor:pointer}.fd-avatar--interactive.is-hover,.fd-avatar--interactive:hover,.fd-avatar[role=button].is-hover,.fd-avatar[role=button]:hover,.fd-avatar[tabindex=\"0\"].is-hover,.fd-avatar[tabindex=\"0\"]:hover{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar--interactive.is-disabled,.fd-avatar--interactive:disabled,.fd-avatar--interactive[aria-disabled=true],.fd-avatar[role=button].is-disabled,.fd-avatar[role=button]:disabled,.fd-avatar[role=button][aria-disabled=true],.fd-avatar[tabindex=\"0\"].is-disabled,.fd-avatar[tabindex=\"0\"]:disabled,.fd-avatar[tabindex=\"0\"][aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--interactive.is-active,.fd-avatar--interactive:active,.fd-avatar[role=button].is-active,.fd-avatar[role=button]:active,.fd-avatar[tabindex=\"0\"].is-active,.fd-avatar[tabindex=\"0\"]:active{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-active.is-hover,.fd-avatar--interactive.is-active:hover,.fd-avatar--interactive:active.is-hover,.fd-avatar--interactive:active:hover,.fd-avatar[role=button].is-active.is-hover,.fd-avatar[role=button].is-active:hover,.fd-avatar[role=button]:active.is-hover,.fd-avatar[role=button]:active:hover,.fd-avatar[tabindex=\"0\"].is-active.is-hover,.fd-avatar[tabindex=\"0\"].is-active:hover,.fd-avatar[tabindex=\"0\"]:active.is-hover,.fd-avatar[tabindex=\"0\"]:active:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-toggled,.fd-avatar[role=button].is-toggled,.fd-avatar[tabindex=\"0\"].is-toggled{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-toggled.is-hover,.fd-avatar--interactive.is-toggled:hover,.fd-avatar[role=button].is-toggled.is-hover,.fd-avatar[role=button].is-toggled:hover,.fd-avatar[tabindex=\"0\"].is-toggled.is-hover,.fd-avatar[tabindex=\"0\"].is-toggled:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-focus,.fd-avatar--interactive:focus,.fd-avatar[role=button].is-focus,.fd-avatar[role=button]:focus,.fd-avatar[tabindex=\"0\"].is-focus,.fd-avatar[tabindex=\"0\"]:focus{padding-block:.125rem;padding-inline:.125rem;z-index:5}.fd-avatar__zoom-icon{--fdAvatarZoomIconColor:var(--sapButton_Emphasized_TextColor);--fdAvatarZoomIconBorderColor:var(--sapButton_Emphasized_BorderColor);--fdAvatarZoomIconBackground:var(--sapButton_Emphasized_Background)}.fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdAvatarZoomIconBackground);border:.0625rem solid var(--fdAvatarZoomIconBorderColor);border-radius:100%;color:var(--fdAvatarZoomIconColor);font-size:var(--fdAvatarZoomIconFontSize);height:var(--fdAvatarZoomIconDimensions);min-width:var(--fdAvatarZoomIconDimensions);position:absolute;width:var(--fdAvatarZoomIconDimensions);z-index:5}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{bottom:var(--fdAvatarZoomIconPosition);right:var(--fdAvatarZoomIconPosition)}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon][dir=rtl],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{left:var(--fdAvatarZoomIconPosition);right:auto}.fd-avatar__zoom-icon--positive{--fdAvatarZoomIconColor:var(--sapPositiveTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapSuccessBackground)}.fd-avatar__zoom-icon--caution{--fdAvatarZoomIconColor:var(--sapCriticalTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapWarningBackground)}.fd-avatar__zoom-icon--negative{--fdAvatarZoomIconColor:var(--sapNegativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapErrorBackground)}.fd-avatar__zoom-icon--information{--fdAvatarZoomIconColor:var(--sapInformativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapInformationBackground)}.fd-avatar__zoom-icon--indication-1{--fdAvatarZoomIconColor:var(--sapIndicationColor_1_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_1_Background)}.fd-avatar__zoom-icon--indication-2{--fdAvatarZoomIconColor:var(--sapIndicationColor_2_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_2_Background)}.fd-avatar__zoom-icon--indication-3{--fdAvatarZoomIconColor:var(--sapIndicationColor_3_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_3_Background)}.fd-avatar__zoom-icon--indication-4{--fdAvatarZoomIconColor:var(--sapIndicationColor_4_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_4_Background)}.fd-avatar__zoom-icon--indication-5{--fdAvatarZoomIconColor:var(--sapIndicationColor_5_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_5_Background)}.fd-avatar__zoom-icon--indication-6{--fdAvatarZoomIconColor:var(--sapIndicationColor_6_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_6_Background)}.fd-avatar__zoom-icon--indication-7{--fdAvatarZoomIconColor:var(--sapIndicationColor_7_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_7_Background)}.fd-avatar__zoom-icon--indication-8{--fdAvatarZoomIconColor:var(--sapIndicationColor_8_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_8_Background)}.fd-avatar__zoom-icon--indication-9{--fdAvatarZoomIconColor:var(--sapIndicationColor_9_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_9_Background)}.fd-avatar__zoom-icon--indication-10{--fdAvatarZoomIconColor:var(--sapIndicationColor_10_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_10_Background)}.fd-avatar__icon [class*=sap-icon],.fd-avatar__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:center;align-content:center}.fd-avatar--circle{--fdAvatarBorderRadius:100%}.fd-avatar--circle.is-focus,.fd-avatar--circle:focus{outline:none}.fd-avatar--circle.is-focus:after,.fd-avatar--circle:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--background-contain{--fdAvatarBackgroundSize:contain}.fd-avatar--transparent{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarColor:var(--sapContent_IconColor);--fdAvatarBorderHoverColor:var(--sapContent_IconColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--tile{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapTile_Background);--fdAvatarColor:var(--sapTile_IconColor);--fdAvatarBorderHoverColor:var(--sapTile_IconColor);--fdAvatarHoverBackgroundColor:var(--sapTile_Background)}.fd-avatar--placeholder{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapContent_ImagePlaceholderBackground);--fdAvatarColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarBorderHoverColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarHoverBackgroundColor:var(--sapContent_ImagePlaceholderBackground)}.fd-avatar--thumbnail{--fdAvatarBorderColor:var(--fdAvatar_Thumbnail_BorderColor);--fdAvatarHoverBorderColor:var(--sapContent_IconColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--border{--fdAvatarBorderColor:var(--sapGroup_ContentBorderColor);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor)}.fd-avatar--overflow{cursor:pointer;--fdAvatarBorderWidth:var(--fdAvatar_Overflow_Border_Width);--fdAvatarBorderColor:var(--sapButton_BorderColor);--fdAvatarBackgroundColor:var(--sapButton_Background);--fdAvatarColor:var(--sapButton_TextColor);--fdAvatarHoverBackgroundColor:var(--sapButton_Hover_Background);--fdAvatarHoverBorderColor:var(--sapButton_Hover_BorderColor);--fdAvatarBorderActiveColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapButton_Active_Background);--fdAvatarActiveColor:var(--sapButton_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapButton_Active_Background);--fdAvatarActiveHoverColor:var(--sapButton_Active_TextColor)}.fd-avatar--overflow.is-disabled,.fd-avatar--overflow:disabled,.fd-avatar--overflow[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--accent-color-1,.fd-avatar--accent-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_1_BorderColor);--fdAvatarColor:var(--sapAvatar_1_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_1_Hover_Background)}.fd-avatar--accent-color-2,.fd-avatar--accent-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_2_BorderColor);--fdAvatarColor:var(--sapAvatar_2_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_2_Hover_Background)}.fd-avatar--accent-color-3,.fd-avatar--accent-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_3_BorderColor);--fdAvatarColor:var(--sapAvatar_3_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_3_Hover_Background)}.fd-avatar--accent-color-4,.fd-avatar--accent-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_4_BorderColor);--fdAvatarColor:var(--sapAvatar_4_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_4_Hover_Background)}.fd-avatar--accent-color-5,.fd-avatar--accent-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_5_BorderColor);--fdAvatarColor:var(--sapAvatar_5_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_5_Hover_Background)}.fd-avatar--accent-color-6,.fd-avatar--accent-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_6_BorderColor);--fdAvatarColor:var(--sapAvatar_6_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_6_Hover_Background)}.fd-avatar--accent-color-7,.fd-avatar--accent-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_7_BorderColor);--fdAvatarColor:var(--sapAvatar_7_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_7_Hover_Background)}.fd-avatar--accent-color-8,.fd-avatar--accent-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_8_BorderColor);--fdAvatarColor:var(--sapAvatar_8_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_8_Hover_Background)}.fd-avatar--accent-color-9,.fd-avatar--accent-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_9_BorderColor);--fdAvatarColor:var(--sapAvatar_9_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_9_Hover_Background)}.fd-avatar--accent-color-10,.fd-avatar--accent-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_10_BorderColor);--fdAvatarColor:var(--sapAvatar_10_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_10_Hover_Background)}.fd-avatar--indication-color-1,.fd-avatar--indication-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_1_BorderColor);--fdAvatarColor:var(--sapIndicationColor_1_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_1_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_1_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_1_Active_TextColor)}.fd-avatar--indication-color-2,.fd-avatar--indication-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_2_BorderColor);--fdAvatarColor:var(--sapIndicationColor_2_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_2_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_2_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_2_Active_TextColor)}.fd-avatar--indication-color-3,.fd-avatar--indication-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_3_BorderColor);--fdAvatarColor:var(--sapIndicationColor_3_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_3_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_3_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_3_Active_TextColor)}.fd-avatar--indication-color-4,.fd-avatar--indication-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_4_BorderColor);--fdAvatarColor:var(--sapIndicationColor_4_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_4_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_4_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_4_Active_TextColor)}.fd-avatar--indication-color-5,.fd-avatar--indication-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_5_BorderColor);--fdAvatarColor:var(--sapIndicationColor_5_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_5_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_5_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_5_Active_TextColor)}.fd-avatar--indication-color-6,.fd-avatar--indication-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_6_BorderColor);--fdAvatarColor:var(--sapIndicationColor_6_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_6_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_6_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_6_Active_TextColor)}.fd-avatar--indication-color-7,.fd-avatar--indication-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_7_BorderColor);--fdAvatarColor:var(--sapIndicationColor_7_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_7_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_7_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_7_Active_TextColor)}.fd-avatar--indication-color-8,.fd-avatar--indication-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_8_BorderColor);--fdAvatarColor:var(--sapIndicationColor_8_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_8_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_8_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_8_Active_TextColor)}.fd-avatar--indication-color-9,.fd-avatar--indication-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_9_BorderColor);--fdAvatarColor:var(--sapIndicationColor_9_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_9_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_9_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_9_Active_TextColor)}.fd-avatar--indication-color-10,.fd-avatar--indication-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_10_BorderColor);--fdAvatarColor:var(--sapIndicationColor_10_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_10_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_10_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_10_Active_TextColor)}.fd-avatar--xs{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:2rem;--fdAvatarFontSize:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.25rem}.fd-avatar--xs .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xs .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--s{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--s .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--s .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--sm{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--sm .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--sm .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--m{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--m .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--m .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--md{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--md .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--md .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--l{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--l .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--l .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--lg{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--lg .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--lg .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--xl{--fdAvatarZoomIconOffset:-.25rem;--fdAvatarRatio:7rem;--fdAvatarFontSize:3rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:3.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:3.75rem}.fd-avatar--xl .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xl .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.75rem;--fdAvatarZoomIconFontSize:1rem}.fd-avatar--accent-color-1.fd-avatar--shell,.fd-avatar--accent-color-10.fd-avatar--shell,.fd-avatar--accent-color-2.fd-avatar--shell,.fd-avatar--accent-color-3.fd-avatar--shell,.fd-avatar--accent-color-4.fd-avatar--shell,.fd-avatar--accent-color-5.fd-avatar--shell,.fd-avatar--accent-color-6.fd-avatar--shell,.fd-avatar--accent-color-7.fd-avatar--shell,.fd-avatar--accent-color-8.fd-avatar--shell,.fd-avatar--accent-color-9.fd-avatar--shell,.fd-avatar--indication-color-1.fd-avatar--shell,.fd-avatar--indication-color-10.fd-avatar--shell,.fd-avatar--indication-color-2.fd-avatar--shell,.fd-avatar--indication-color-3.fd-avatar--shell,.fd-avatar--indication-color-4.fd-avatar--shell,.fd-avatar--indication-color-5.fd-avatar--shell,.fd-avatar--indication-color-6.fd-avatar--shell,.fd-avatar--indication-color-7.fd-avatar--shell,.fd-avatar--indication-color-8.fd-avatar--shell,.fd-avatar--indication-color-9.fd-avatar--shell{border:.0625rem solid var(--sapShell_InteractiveBorderColor)}.fd-avatar--l,.fd-avatar--lg,.fd-avatar--m,.fd-avatar--md,.fd-avatar--s,.fd-avatar--sm,.fd-avatar--xl,.fd-avatar--xs{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-avatar--l:not(.fd-avatar--circle),.fd-avatar--lg:not(.fd-avatar--circle),.fd-avatar--m:not(.fd-avatar--circle),.fd-avatar--md:not(.fd-avatar--circle),.fd-avatar--s:not(.fd-avatar--circle),.fd-avatar--sm:not(.fd-avatar--circle),.fd-avatar--xl:not(.fd-avatar--circle),.fd-avatar--xs:not(.fd-avatar--circle){--fdAvatarZoomIconPosition:var(--fdAvatarZoomIconOffset)}.fd-avatar-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.fd-avatar-group:after,.fd-avatar-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group .fd-avatar:not(:first-child){margin-block:var(--fdAvatarGroupItemsSpacingY) 0;margin-inline:var(--fdAvatarGroupItemsSpacingX) 0}.fd-avatar-group__overflow-body{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;white-space:normal}.fd-avatar-group__overflow-body:after,.fd-avatar-group__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group__overflow-body--no-padding{padding-block:0;padding-inline:0}.fd-avatar-group__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group__overflow-body>.fd-avatar{margin-block:.25rem;margin-inline:.25rem}.fd-avatar-group__popover-control{position:relative}.fd-avatar-group__popover-control.is-focus,.fd-avatar-group__popover-control:focus{z-index:5}.fd-avatar-group__popover-control.is-focus.is-focus,.fd-avatar-group__popover-control.is-focus:focus,.fd-avatar-group__popover-control:focus.is-focus,.fd-avatar-group__popover-control:focus:focus{outline:none}.fd-avatar-group__popover-control.is-focus.is-focus:after,.fd-avatar-group__popover-control.is-focus:focus:after,.fd-avatar-group__popover-control:focus.is-focus:after,.fd-avatar-group__popover-control:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar-group--vertical{height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-avatar-group--individual-type{gap:var(--fdAvatarGroupItemsGap)}.fd-avatar-group--individual-type.fd-avatar-group--xs{--fdAvatarGroupItemsGap:.0625rem}.fd-avatar-group--individual-type.fd-avatar-group--l,.fd-avatar-group--individual-type.fd-avatar-group--lg,.fd-avatar-group--individual-type.fd-avatar-group--m,.fd-avatar-group--individual-type.fd-avatar-group--md,.fd-avatar-group--individual-type.fd-avatar-group--s,.fd-avatar-group--individual-type.fd-avatar-group--sm{--fdAvatarGroupItemsGap:.125rem}.fd-avatar-group--individual-type.fd-avatar-group--xl{--fdAvatarGroupItemsGap:.25rem}.fd-avatar-group--group-type{position:relative}.fd-avatar-group--group-type .fd-avatar{pointer-events:none}.fd-avatar-group--group-type.fd-avatar-group--xs{--fdAvatarGroupItemsSpacingX:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--xs.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--s{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--s.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--m{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--m.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--l{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--l.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--xl{--fdAvatarGroupItemsSpacingX:-2.75rem}.fd-avatar-group--group-type.fd-avatar-group--xl.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2.75rem}.fd-avatar-group--group-type.is-hover .fd-avatar,.fd-avatar-group--group-type:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar-group--group-type.is-active .fd-avatar,.fd-avatar-group--group-type:active .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-active.is-hover .fd-avatar,.fd-avatar-group--group-type.is-active:hover .fd-avatar,.fd-avatar-group--group-type:active.is-hover .fd-avatar,.fd-avatar-group--group-type:active:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-toggled .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-toggled.is-hover .fd-avatar,.fd-avatar-group--group-type.is-toggled:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-disabled,.fd-avatar-group--group-type:disabled,.fd-avatar-group--group-type[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-avatar-group--group-type.is-focus,.fd-avatar-group--group-type:focus{z-index:5}.fd-avatar-group--group-type.is-focus.is-focus,.fd-avatar-group--group-type.is-focus:focus,.fd-avatar-group--group-type:focus.is-focus,.fd-avatar-group--group-type:focus:focus{outline:none}.fd-avatar-group--group-type.is-focus.is-focus:after,.fd-avatar-group--group-type.is-focus:focus:after,.fd-avatar-group--group-type:focus.is-focus:after,.fd-avatar-group--group-type:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}fd-popover{display:inline-block}fd-avatar-group{display:block}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type{gap:initial}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control{display:block;height:100%}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline-start:var(--fdAvatarGroupItemsGap)}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover:first-child>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline:0}fd-avatar-group>.fd-popover-custom{width:100%}fd-avatar-group>.fd-popover-custom .fd-popover__control{display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group{display:inline-block}\n/*!\n * Fundamental Library Styles v0.41.9\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n"], dependencies: [{ kind: "component", type: AvatarGroupHostComponent, selector: "fd-avatar-group-host", inputs: ["class", "type", "orientation", "size", "items"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "directive", type: PopoverBodyDirective, selector: "[fdPopoverBody]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusableListDirective, selector: "[fdkFocusableList]", inputs: ["focusable", "navigationDirection", "contentDirection", "wrap", "listFocusedEventAnnouncer"], outputs: ["navigationDirectionChange", "contentDirectionChange", "itemFocused"], exportAs: ["fdkFocusableList"] }, { kind: "directive", type: AvatarGroupItemRendererDirective, selector: "[fdAvatarGroupItemPortal]", inputs: ["avatarGroupItem", "forceVisibility", "posInSet", "setSize"], exportAs: ["fdAvatarGroupItemPortal"] }, { kind: "component", type: AvatarGroupOverflowButtonComponent, selector: "fd-avatar-group-overflow-button", inputs: ["size", "circle", "colorAccent", "class"] }, { kind: "component", type: DefaultAvatarGroupOverflowBodyComponent, selector: "fd-default-avatar-group-overflow-body", inputs: ["avatars", "overflowPopoverTitle", "overflowHeadingLevel"], outputs: ["escapePressed"] }, { kind: "directive", type: AvatarGroupInternalOverflowButtonDirective, selector: "[fdAvatarGroupInternalOverflowButton]", inputs: ["fdAvatarGroupInternalOverflowButton"] }, { kind: "directive", type: ResizeObserverDirective, selector: "[fdkResizeObserver]", outputs: ["resized"], exportAs: ["fdkResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
836
+ ], queries: [{ propertyName: "_overflowButton", first: true, predicate: AvatarGroupOverflowButtonDirective, descendants: true }, { propertyName: "_avatarGroupPopoverBody", first: true, predicate: AvatarGroupOverflowBodyDirective, descendants: true }, { propertyName: "_avatars", predicate: AvatarGroupItemDirective }], viewQueries: [{ propertyName: "_avatarGroupHost", first: true, predicate: AvatarGroupHostComponent, descendants: true, isSignal: true }, { propertyName: "_avatarRenderers", predicate: AvatarGroupItemRendererDirective, descendants: true }], ngImport: i0, template: "<ng-content></ng-content>\n@if (type === 'individual') {\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n fdkResizeObserver\n fdkFocusableList\n [contentDirection]=\"contentDirection()\"\n [wrap]=\"true\"\n [navigationDirection]=\"orientation()\"\n [items]=\"_avatars\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelIndividual()\"\n (resized)=\"_detectChanges()\"\n (itemFocused)=\"_onItemFocused($event)\"\n >\n @for (item of _avatars; track item) {\n <fd-popover [noArrow]=\"false\" [focusAutoCapture]=\"true\">\n <fd-popover-control\n class=\"fd-avatar-group__popover-control\"\n tabindex=\"-1\"\n (click)=\"outletItem.element.focus()\"\n >\n <ng-template\n #outletItem=\"fdAvatarGroupItemPortal\"\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n </fd-popover-control>\n @if (item.details) {\n <ng-template fdPopoverBody>\n <ng-template [ngTemplateOutlet]=\"item.details\"></ng-template>\n </ng-template>\n }\n </fd-popover>\n }\n <ng-template [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\" let-hiddenItems>\n <fd-popover\n #overflowPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(hiddenItems.length)\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\" tabindex=\"-1\">\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button\n [size]=\"size\"\n [colorAccent]=\"1\"\n [circle]=\"overflowButtonShape() === 'circle'\"\n >\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems, popoverRef: overflowPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n </ng-template>\n </fd-avatar-group-host>\n} @else {\n <fd-popover\n #groupPopover\n [placement]=\"_effectivePlacement()\"\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(_avatars.length)\"\n fdkResizeObserver\n (resized)=\"_detectChanges()\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\">\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelGroup()\"\n role=\"button\"\n tabindex=\"0\"\n >\n @for (item of _avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n }\n <ng-template\n [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\"\n let-hiddenItems\n >\n <ng-template\n [ngTemplateOutlet]=\"overflowButtonTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems }\"\n ></ng-template>\n </ng-template>\n </fd-avatar-group-host>\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: _avatarRenderers, popoverRef: groupPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n}\n<ng-template #overflowButtonTemplate let-hiddenItems>\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button\n [size]=\"size\"\n [colorAccent]=\"1\"\n [fdkFocusableItem]=\"false\"\n [circle]=\"overflowButtonShape() === 'circle'\"\n >\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n</ng-template>\n<ng-template #avatarGroupOverflowBodyTemplate let-hiddenItems let-popoverRef=\"popoverRef\">\n @if (_avatarGroupPopoverBody) {\n <ng-template\n [ngTemplateOutlet]=\"_avatarGroupPopoverBody._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-default-avatar-group-overflow-body\n [avatars]=\"hiddenItems\"\n [overflowPopoverTitle]=\"overflowPopoverTitle\"\n [overflowHeadingLevel]=\"overflowHeadingLevel()\"\n (escapePressed)=\"popoverRef?.close()\"\n />\n }\n</ng-template>\n", styles: [".fd-avatar{--fdAvatarZoomIconPosition:0;background-color:var(--fdAvatarBackgroundColor);background-position:50%;background-repeat:no-repeat;background-size:var(--fdAvatarBackgroundSize);border:0;border:var(--fdAvatarBorderWidth, .0625rem) solid var(--fdAvatarBorderColor);border-radius:var(--fdAvatarBorderRadius);-webkit-box-shadow:var(--fdAvatarBoxShadow);box-shadow:var(--fdAvatarBoxShadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdAvatarColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdAvatarFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdAvatarRatio);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdAvatarRatio);max-width:var(--fdAvatarRatio);min-height:var(--fdAvatarRatio);min-width:var(--fdAvatarRatio);padding-block:0;padding-inline:0;position:relative;text-shadow:var(--fdAvatarTextShadow);vertical-align:middle;width:var(--fdAvatarRatio)}.fd-avatar:after,.fd-avatar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar.is-focus,.fd-avatar:focus{outline:none}.fd-avatar.is-focus:after,.fd-avatar:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--interactive,.fd-avatar[role=button],.fd-avatar[tabindex=\"0\"]{cursor:pointer}.fd-avatar--interactive.is-hover,.fd-avatar--interactive:hover,.fd-avatar[role=button].is-hover,.fd-avatar[role=button]:hover,.fd-avatar[tabindex=\"0\"].is-hover,.fd-avatar[tabindex=\"0\"]:hover{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar--interactive.is-disabled,.fd-avatar--interactive:disabled,.fd-avatar--interactive[aria-disabled=true],.fd-avatar[role=button].is-disabled,.fd-avatar[role=button]:disabled,.fd-avatar[role=button][aria-disabled=true],.fd-avatar[tabindex=\"0\"].is-disabled,.fd-avatar[tabindex=\"0\"]:disabled,.fd-avatar[tabindex=\"0\"][aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--interactive.is-active,.fd-avatar--interactive:active,.fd-avatar[role=button].is-active,.fd-avatar[role=button]:active,.fd-avatar[tabindex=\"0\"].is-active,.fd-avatar[tabindex=\"0\"]:active{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-active.is-hover,.fd-avatar--interactive.is-active:hover,.fd-avatar--interactive:active.is-hover,.fd-avatar--interactive:active:hover,.fd-avatar[role=button].is-active.is-hover,.fd-avatar[role=button].is-active:hover,.fd-avatar[role=button]:active.is-hover,.fd-avatar[role=button]:active:hover,.fd-avatar[tabindex=\"0\"].is-active.is-hover,.fd-avatar[tabindex=\"0\"].is-active:hover,.fd-avatar[tabindex=\"0\"]:active.is-hover,.fd-avatar[tabindex=\"0\"]:active:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-toggled,.fd-avatar[role=button].is-toggled,.fd-avatar[tabindex=\"0\"].is-toggled{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-toggled.is-hover,.fd-avatar--interactive.is-toggled:hover,.fd-avatar[role=button].is-toggled.is-hover,.fd-avatar[role=button].is-toggled:hover,.fd-avatar[tabindex=\"0\"].is-toggled.is-hover,.fd-avatar[tabindex=\"0\"].is-toggled:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-focus,.fd-avatar--interactive:focus,.fd-avatar[role=button].is-focus,.fd-avatar[role=button]:focus,.fd-avatar[tabindex=\"0\"].is-focus,.fd-avatar[tabindex=\"0\"]:focus{padding-block:.125rem;padding-inline:.125rem;z-index:5}.fd-avatar__zoom-icon{--fdAvatarZoomIconColor:var(--sapButton_Emphasized_TextColor);--fdAvatarZoomIconBorderColor:var(--sapButton_Emphasized_BorderColor);--fdAvatarZoomIconBackground:var(--sapButton_Emphasized_Background)}.fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdAvatarZoomIconBackground);border:.0625rem solid var(--fdAvatarZoomIconBorderColor);border-radius:100%;color:var(--fdAvatarZoomIconColor);font-size:var(--fdAvatarZoomIconFontSize);height:var(--fdAvatarZoomIconDimensions);min-width:var(--fdAvatarZoomIconDimensions);position:absolute;width:var(--fdAvatarZoomIconDimensions);z-index:5}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{bottom:var(--fdAvatarZoomIconPosition);right:var(--fdAvatarZoomIconPosition)}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon][dir=rtl],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{left:var(--fdAvatarZoomIconPosition);right:auto}.fd-avatar__zoom-icon--positive{--fdAvatarZoomIconColor:var(--sapPositiveTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapSuccessBackground)}.fd-avatar__zoom-icon--caution{--fdAvatarZoomIconColor:var(--sapCriticalTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapWarningBackground)}.fd-avatar__zoom-icon--negative{--fdAvatarZoomIconColor:var(--sapNegativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapErrorBackground)}.fd-avatar__zoom-icon--information{--fdAvatarZoomIconColor:var(--sapInformativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapInformationBackground)}.fd-avatar__zoom-icon--indication-1{--fdAvatarZoomIconColor:var(--sapIndicationColor_1_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_1_Background)}.fd-avatar__zoom-icon--indication-2{--fdAvatarZoomIconColor:var(--sapIndicationColor_2_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_2_Background)}.fd-avatar__zoom-icon--indication-3{--fdAvatarZoomIconColor:var(--sapIndicationColor_3_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_3_Background)}.fd-avatar__zoom-icon--indication-4{--fdAvatarZoomIconColor:var(--sapIndicationColor_4_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_4_Background)}.fd-avatar__zoom-icon--indication-5{--fdAvatarZoomIconColor:var(--sapIndicationColor_5_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_5_Background)}.fd-avatar__zoom-icon--indication-6{--fdAvatarZoomIconColor:var(--sapIndicationColor_6_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_6_Background)}.fd-avatar__zoom-icon--indication-7{--fdAvatarZoomIconColor:var(--sapIndicationColor_7_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_7_Background)}.fd-avatar__zoom-icon--indication-8{--fdAvatarZoomIconColor:var(--sapIndicationColor_8_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_8_Background)}.fd-avatar__zoom-icon--indication-9{--fdAvatarZoomIconColor:var(--sapIndicationColor_9_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_9_Background)}.fd-avatar__zoom-icon--indication-10{--fdAvatarZoomIconColor:var(--sapIndicationColor_10_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_10_Background)}.fd-avatar__icon [class*=sap-icon],.fd-avatar__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:center;align-content:center}.fd-avatar--circle{--fdAvatarBorderRadius:100%}.fd-avatar--circle.is-focus,.fd-avatar--circle:focus{outline:none}.fd-avatar--circle.is-focus:after,.fd-avatar--circle:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--background-contain{--fdAvatarBackgroundSize:contain}.fd-avatar--transparent{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarColor:var(--sapContent_IconColor);--fdAvatarBorderHoverColor:var(--sapContent_IconColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--tile{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapTile_Background);--fdAvatarColor:var(--sapTile_IconColor);--fdAvatarBorderHoverColor:var(--sapTile_IconColor);--fdAvatarHoverBackgroundColor:var(--sapTile_Background)}.fd-avatar--placeholder{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapContent_ImagePlaceholderBackground);--fdAvatarColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarBorderHoverColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarHoverBackgroundColor:var(--sapContent_ImagePlaceholderBackground)}.fd-avatar--thumbnail{--fdAvatarBorderColor:var(--fdAvatar_Thumbnail_BorderColor);--fdAvatarHoverBorderColor:var(--sapContent_IconColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--border{--fdAvatarBorderColor:var(--sapGroup_ContentBorderColor);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor)}.fd-avatar--overflow{cursor:pointer;--fdAvatarBorderWidth:var(--fdAvatar_Overflow_Border_Width);--fdAvatarBorderColor:var(--sapButton_BorderColor);--fdAvatarBackgroundColor:var(--sapButton_Background);--fdAvatarColor:var(--sapButton_TextColor);--fdAvatarHoverBackgroundColor:var(--sapButton_Hover_Background);--fdAvatarHoverBorderColor:var(--sapButton_Hover_BorderColor);--fdAvatarBorderActiveColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapButton_Active_Background);--fdAvatarActiveColor:var(--sapButton_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapButton_Active_Background);--fdAvatarActiveHoverColor:var(--sapButton_Active_TextColor)}.fd-avatar--overflow.is-disabled,.fd-avatar--overflow:disabled,.fd-avatar--overflow[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--accent-color-1,.fd-avatar--accent-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_1_BorderColor);--fdAvatarColor:var(--sapAvatar_1_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_1_Hover_Background)}.fd-avatar--accent-color-2,.fd-avatar--accent-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_2_BorderColor);--fdAvatarColor:var(--sapAvatar_2_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_2_Hover_Background)}.fd-avatar--accent-color-3,.fd-avatar--accent-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_3_BorderColor);--fdAvatarColor:var(--sapAvatar_3_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_3_Hover_Background)}.fd-avatar--accent-color-4,.fd-avatar--accent-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_4_BorderColor);--fdAvatarColor:var(--sapAvatar_4_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_4_Hover_Background)}.fd-avatar--accent-color-5,.fd-avatar--accent-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_5_BorderColor);--fdAvatarColor:var(--sapAvatar_5_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_5_Hover_Background)}.fd-avatar--accent-color-6,.fd-avatar--accent-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_6_BorderColor);--fdAvatarColor:var(--sapAvatar_6_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_6_Hover_Background)}.fd-avatar--accent-color-7,.fd-avatar--accent-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_7_BorderColor);--fdAvatarColor:var(--sapAvatar_7_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_7_Hover_Background)}.fd-avatar--accent-color-8,.fd-avatar--accent-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_8_BorderColor);--fdAvatarColor:var(--sapAvatar_8_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_8_Hover_Background)}.fd-avatar--accent-color-9,.fd-avatar--accent-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_9_BorderColor);--fdAvatarColor:var(--sapAvatar_9_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_9_Hover_Background)}.fd-avatar--accent-color-10,.fd-avatar--accent-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_10_BorderColor);--fdAvatarColor:var(--sapAvatar_10_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_10_Hover_Background)}.fd-avatar--indication-color-1,.fd-avatar--indication-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_1_BorderColor);--fdAvatarColor:var(--sapIndicationColor_1_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_1_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_1_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_1_Active_TextColor)}.fd-avatar--indication-color-2,.fd-avatar--indication-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_2_BorderColor);--fdAvatarColor:var(--sapIndicationColor_2_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_2_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_2_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_2_Active_TextColor)}.fd-avatar--indication-color-3,.fd-avatar--indication-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_3_BorderColor);--fdAvatarColor:var(--sapIndicationColor_3_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_3_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_3_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_3_Active_TextColor)}.fd-avatar--indication-color-4,.fd-avatar--indication-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_4_BorderColor);--fdAvatarColor:var(--sapIndicationColor_4_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_4_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_4_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_4_Active_TextColor)}.fd-avatar--indication-color-5,.fd-avatar--indication-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_5_BorderColor);--fdAvatarColor:var(--sapIndicationColor_5_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_5_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_5_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_5_Active_TextColor)}.fd-avatar--indication-color-6,.fd-avatar--indication-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_6_BorderColor);--fdAvatarColor:var(--sapIndicationColor_6_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_6_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_6_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_6_Active_TextColor)}.fd-avatar--indication-color-7,.fd-avatar--indication-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_7_BorderColor);--fdAvatarColor:var(--sapIndicationColor_7_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_7_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_7_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_7_Active_TextColor)}.fd-avatar--indication-color-8,.fd-avatar--indication-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_8_BorderColor);--fdAvatarColor:var(--sapIndicationColor_8_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_8_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_8_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_8_Active_TextColor)}.fd-avatar--indication-color-9,.fd-avatar--indication-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_9_BorderColor);--fdAvatarColor:var(--sapIndicationColor_9_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_9_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_9_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_9_Active_TextColor)}.fd-avatar--indication-color-10,.fd-avatar--indication-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_10_BorderColor);--fdAvatarColor:var(--sapIndicationColor_10_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_10_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_10_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_10_Active_TextColor)}.fd-avatar--xs{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:2rem;--fdAvatarFontSize:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.25rem}.fd-avatar--xs .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xs .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--s{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--s .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--s .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--sm{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--sm .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--sm .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--m{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--m .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--m .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--md{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--md .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--md .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--l{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--l .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--l .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--lg{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--lg .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--lg .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--xl{--fdAvatarZoomIconOffset:-.25rem;--fdAvatarRatio:7rem;--fdAvatarFontSize:3rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:3.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:3.75rem}.fd-avatar--xl .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xl .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.75rem;--fdAvatarZoomIconFontSize:1rem}.fd-avatar--accent-color-1.fd-avatar--shell,.fd-avatar--accent-color-10.fd-avatar--shell,.fd-avatar--accent-color-2.fd-avatar--shell,.fd-avatar--accent-color-3.fd-avatar--shell,.fd-avatar--accent-color-4.fd-avatar--shell,.fd-avatar--accent-color-5.fd-avatar--shell,.fd-avatar--accent-color-6.fd-avatar--shell,.fd-avatar--accent-color-7.fd-avatar--shell,.fd-avatar--accent-color-8.fd-avatar--shell,.fd-avatar--accent-color-9.fd-avatar--shell,.fd-avatar--indication-color-1.fd-avatar--shell,.fd-avatar--indication-color-10.fd-avatar--shell,.fd-avatar--indication-color-2.fd-avatar--shell,.fd-avatar--indication-color-3.fd-avatar--shell,.fd-avatar--indication-color-4.fd-avatar--shell,.fd-avatar--indication-color-5.fd-avatar--shell,.fd-avatar--indication-color-6.fd-avatar--shell,.fd-avatar--indication-color-7.fd-avatar--shell,.fd-avatar--indication-color-8.fd-avatar--shell,.fd-avatar--indication-color-9.fd-avatar--shell{border:.0625rem solid var(--sapShell_InteractiveBorderColor)}.fd-avatar--l,.fd-avatar--lg,.fd-avatar--m,.fd-avatar--md,.fd-avatar--s,.fd-avatar--sm,.fd-avatar--xl,.fd-avatar--xs{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-avatar--l:not(.fd-avatar--circle),.fd-avatar--lg:not(.fd-avatar--circle),.fd-avatar--m:not(.fd-avatar--circle),.fd-avatar--md:not(.fd-avatar--circle),.fd-avatar--s:not(.fd-avatar--circle),.fd-avatar--sm:not(.fd-avatar--circle),.fd-avatar--xl:not(.fd-avatar--circle),.fd-avatar--xs:not(.fd-avatar--circle){--fdAvatarZoomIconPosition:var(--fdAvatarZoomIconOffset)}.fd-avatar-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.fd-avatar-group:after,.fd-avatar-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group .fd-avatar:not(:first-child){margin-block:var(--fdAvatarGroupItemsSpacingY) 0;margin-inline:var(--fdAvatarGroupItemsSpacingX) 0}.fd-avatar-group__overflow-body{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;white-space:normal}.fd-avatar-group__overflow-body:after,.fd-avatar-group__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group__overflow-body--no-padding{padding-block:0;padding-inline:0}.fd-avatar-group__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group__overflow-body>.fd-avatar{margin-block:.25rem;margin-inline:.25rem}.fd-avatar-group__popover-control{position:relative}.fd-avatar-group__popover-control.is-focus,.fd-avatar-group__popover-control:focus{z-index:5}.fd-avatar-group__popover-control.is-focus.is-focus,.fd-avatar-group__popover-control.is-focus:focus,.fd-avatar-group__popover-control:focus.is-focus,.fd-avatar-group__popover-control:focus:focus{outline:none}.fd-avatar-group__popover-control.is-focus.is-focus:after,.fd-avatar-group__popover-control.is-focus:focus:after,.fd-avatar-group__popover-control:focus.is-focus:after,.fd-avatar-group__popover-control:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar-group--vertical{height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-avatar-group--individual-type{gap:var(--fdAvatarGroupItemsGap)}.fd-avatar-group--individual-type.fd-avatar-group--xs{--fdAvatarGroupItemsGap:.0625rem}.fd-avatar-group--individual-type.fd-avatar-group--l,.fd-avatar-group--individual-type.fd-avatar-group--lg,.fd-avatar-group--individual-type.fd-avatar-group--m,.fd-avatar-group--individual-type.fd-avatar-group--md,.fd-avatar-group--individual-type.fd-avatar-group--s,.fd-avatar-group--individual-type.fd-avatar-group--sm{--fdAvatarGroupItemsGap:.125rem}.fd-avatar-group--individual-type.fd-avatar-group--xl{--fdAvatarGroupItemsGap:.25rem}.fd-avatar-group--group-type{position:relative}.fd-avatar-group--group-type .fd-avatar{pointer-events:none}.fd-avatar-group--group-type.fd-avatar-group--xs{--fdAvatarGroupItemsSpacingX:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--xs.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--s{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--s.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--m{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--m.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--l{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--l.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--xl{--fdAvatarGroupItemsSpacingX:-2.75rem}.fd-avatar-group--group-type.fd-avatar-group--xl.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2.75rem}.fd-avatar-group--group-type.is-hover .fd-avatar,.fd-avatar-group--group-type:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar-group--group-type.is-active .fd-avatar,.fd-avatar-group--group-type:active .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-active.is-hover .fd-avatar,.fd-avatar-group--group-type.is-active:hover .fd-avatar,.fd-avatar-group--group-type:active.is-hover .fd-avatar,.fd-avatar-group--group-type:active:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-toggled .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-toggled.is-hover .fd-avatar,.fd-avatar-group--group-type.is-toggled:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-disabled,.fd-avatar-group--group-type:disabled,.fd-avatar-group--group-type[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-avatar-group--group-type.is-focus,.fd-avatar-group--group-type:focus{z-index:5}.fd-avatar-group--group-type.is-focus.is-focus,.fd-avatar-group--group-type.is-focus:focus,.fd-avatar-group--group-type:focus.is-focus,.fd-avatar-group--group-type:focus:focus{outline:none}.fd-avatar-group--group-type.is-focus.is-focus:after,.fd-avatar-group--group-type.is-focus:focus:after,.fd-avatar-group--group-type:focus.is-focus:after,.fd-avatar-group--group-type:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}fd-popover{display:inline-block}fd-avatar-group{display:block}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type{gap:initial}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control{display:block;height:100%}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline-start:var(--fdAvatarGroupItemsGap)}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover:first-child>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline:0}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type.fd-avatar-group--vertical>fd-popover{align-self:flex-start}fd-avatar-group>.fd-popover-custom{width:100%}fd-avatar-group>.fd-popover-custom .fd-popover__control{display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group:not(.fd-avatar-group--vertical){display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group.fd-avatar-group--vertical{display:flex}\n/*!\n * Fundamental Library Styles v0.41.9\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n"], dependencies: [{ kind: "component", type: AvatarGroupHostComponent, selector: "fd-avatar-group-host", inputs: ["class", "type", "size", "items", "maxVisibleItems", "orientation"] }, { kind: "component", type: PopoverComponent, selector: "fd-popover", inputs: ["config", "title", "trigger", "id", "mobile", "mobileConfig", "preventSpaceKeyScroll", "placement", "maxWidth", "fillControlMode", "closeOnOutsideClick", "closeOnEscapeKey", "disabled", "triggers", "focusTrapped", "focusAutoCapture", "restoreFocusOnClose", "noArrow", "disableScrollbar", "appendTo", "placementContainer", "scrollStrategy", "cdkPositions", "applyOverlay", "additionalBodyClass", "additionalTriggerClass", "closeOnNavigation", "fixedPosition", "resizable", "bodyAriaLabel", "bodyRole", "bodyAriaLabelledBy", "isOpen"], outputs: ["triggerChange", "isOpenChange", "beforeOpen"] }, { kind: "component", type: PopoverControlComponent, selector: "fd-popover-control, [fdPopoverControl]" }, { kind: "directive", type: PopoverBodyDirective, selector: "[fdPopoverBody]" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: FocusableListDirective, selector: "[fdkFocusableList]", inputs: ["focusable", "navigationDirection", "contentDirection", "wrap", "listFocusedEventAnnouncer"], outputs: ["navigationDirectionChange", "contentDirectionChange", "itemFocused"], exportAs: ["fdkFocusableList"] }, { kind: "directive", type: AvatarGroupItemRendererDirective, selector: "[fdAvatarGroupItemPortal]", inputs: ["avatarGroupItem", "forceVisibility", "posInSet", "setSize"], exportAs: ["fdAvatarGroupItemPortal"] }, { kind: "component", type: AvatarGroupOverflowButtonComponent, selector: "fd-avatar-group-overflow-button", inputs: ["size", "circle", "colorAccent", "class"] }, { kind: "component", type: DefaultAvatarGroupOverflowBodyComponent, selector: "fd-default-avatar-group-overflow-body", inputs: ["avatars", "overflowPopoverTitle", "overflowHeadingLevel"], outputs: ["escapePressed"] }, { kind: "directive", type: AvatarGroupInternalOverflowButtonDirective, selector: "[fdAvatarGroupInternalOverflowButton]", inputs: ["fdAvatarGroupInternalOverflowButton"] }, { kind: "directive", type: ResizeObserverDirective, selector: "[fdkResizeObserver]", outputs: ["resized"], exportAs: ["fdkResizeObserver"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
756
837
  }
757
838
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: AvatarGroupComponent, decorators: [{
758
839
  type: Component,
@@ -773,11 +854,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
773
854
  DefaultAvatarGroupOverflowBodyComponent,
774
855
  AvatarGroupInternalOverflowButtonDirective,
775
856
  ResizeObserverDirective
776
- ], template: "<ng-content></ng-content>\n@if (type === 'individual') {\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation\"\n fdkResizeObserver\n fdkFocusableList\n [contentDirection]=\"contentDirection()\"\n [wrap]=\"true\"\n [navigationDirection]=\"orientation\"\n [items]=\"_avatars\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelIndividual()\"\n (resized)=\"_detectChanges()\"\n (itemFocused)=\"_onItemFocused($event)\"\n >\n @for (item of _avatars; track item) {\n <fd-popover [noArrow]=\"false\" [focusAutoCapture]=\"true\">\n <fd-popover-control\n class=\"fd-avatar-group__popover-control\"\n tabindex=\"-1\"\n (click)=\"outletItem.element.focus()\"\n >\n <ng-template\n #outletItem=\"fdAvatarGroupItemPortal\"\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n </fd-popover-control>\n @if (item.details) {\n <ng-template fdPopoverBody>\n <ng-template [ngTemplateOutlet]=\"item.details\"></ng-template>\n </ng-template>\n }\n </fd-popover>\n }\n <ng-template [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\" let-hiddenItems>\n <fd-popover\n #overflowPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(hiddenItems.length)\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\" tabindex=\"-1\">\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button [size]=\"size\" [colorAccent]=\"1\">\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems, popoverRef: overflowPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n </ng-template>\n </fd-avatar-group-host>\n} @else {\n <fd-popover\n #groupPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(_avatars.length)\"\n fdkResizeObserver\n (resized)=\"_detectChanges()\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\">\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelGroup()\"\n role=\"button\"\n tabindex=\"0\"\n >\n @for (item of _avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n }\n <ng-template\n [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\"\n let-hiddenItems\n >\n <ng-template\n [ngTemplateOutlet]=\"overflowButtonTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems }\"\n ></ng-template>\n </ng-template>\n </fd-avatar-group-host>\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: _avatarRenderers, popoverRef: groupPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n}\n<ng-template #overflowButtonTemplate let-hiddenItems>\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button [size]=\"size\" [colorAccent]=\"1\" [fdkFocusableItem]=\"false\">\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n</ng-template>\n<ng-template #avatarGroupOverflowBodyTemplate let-hiddenItems let-popoverRef=\"popoverRef\">\n @if (_avatarGroupPopoverBody) {\n <ng-template\n [ngTemplateOutlet]=\"_avatarGroupPopoverBody._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-default-avatar-group-overflow-body\n [avatars]=\"hiddenItems\"\n [overflowPopoverTitle]=\"overflowPopoverTitle\"\n [overflowHeadingLevel]=\"overflowHeadingLevel()\"\n (escapePressed)=\"popoverRef?.close()\"\n />\n }\n</ng-template>\n", styles: [".fd-avatar{--fdAvatarZoomIconPosition:0;background-color:var(--fdAvatarBackgroundColor);background-position:50%;background-repeat:no-repeat;background-size:var(--fdAvatarBackgroundSize);border:0;border:var(--fdAvatarBorderWidth, .0625rem) solid var(--fdAvatarBorderColor);border-radius:var(--fdAvatarBorderRadius);-webkit-box-shadow:var(--fdAvatarBoxShadow);box-shadow:var(--fdAvatarBoxShadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdAvatarColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdAvatarFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdAvatarRatio);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdAvatarRatio);max-width:var(--fdAvatarRatio);min-height:var(--fdAvatarRatio);min-width:var(--fdAvatarRatio);padding-block:0;padding-inline:0;position:relative;text-shadow:var(--fdAvatarTextShadow);vertical-align:middle;width:var(--fdAvatarRatio)}.fd-avatar:after,.fd-avatar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar.is-focus,.fd-avatar:focus{outline:none}.fd-avatar.is-focus:after,.fd-avatar:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--interactive,.fd-avatar[role=button],.fd-avatar[tabindex=\"0\"]{cursor:pointer}.fd-avatar--interactive.is-hover,.fd-avatar--interactive:hover,.fd-avatar[role=button].is-hover,.fd-avatar[role=button]:hover,.fd-avatar[tabindex=\"0\"].is-hover,.fd-avatar[tabindex=\"0\"]:hover{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar--interactive.is-disabled,.fd-avatar--interactive:disabled,.fd-avatar--interactive[aria-disabled=true],.fd-avatar[role=button].is-disabled,.fd-avatar[role=button]:disabled,.fd-avatar[role=button][aria-disabled=true],.fd-avatar[tabindex=\"0\"].is-disabled,.fd-avatar[tabindex=\"0\"]:disabled,.fd-avatar[tabindex=\"0\"][aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--interactive.is-active,.fd-avatar--interactive:active,.fd-avatar[role=button].is-active,.fd-avatar[role=button]:active,.fd-avatar[tabindex=\"0\"].is-active,.fd-avatar[tabindex=\"0\"]:active{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-active.is-hover,.fd-avatar--interactive.is-active:hover,.fd-avatar--interactive:active.is-hover,.fd-avatar--interactive:active:hover,.fd-avatar[role=button].is-active.is-hover,.fd-avatar[role=button].is-active:hover,.fd-avatar[role=button]:active.is-hover,.fd-avatar[role=button]:active:hover,.fd-avatar[tabindex=\"0\"].is-active.is-hover,.fd-avatar[tabindex=\"0\"].is-active:hover,.fd-avatar[tabindex=\"0\"]:active.is-hover,.fd-avatar[tabindex=\"0\"]:active:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-toggled,.fd-avatar[role=button].is-toggled,.fd-avatar[tabindex=\"0\"].is-toggled{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-toggled.is-hover,.fd-avatar--interactive.is-toggled:hover,.fd-avatar[role=button].is-toggled.is-hover,.fd-avatar[role=button].is-toggled:hover,.fd-avatar[tabindex=\"0\"].is-toggled.is-hover,.fd-avatar[tabindex=\"0\"].is-toggled:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-focus,.fd-avatar--interactive:focus,.fd-avatar[role=button].is-focus,.fd-avatar[role=button]:focus,.fd-avatar[tabindex=\"0\"].is-focus,.fd-avatar[tabindex=\"0\"]:focus{padding-block:.125rem;padding-inline:.125rem;z-index:5}.fd-avatar__zoom-icon{--fdAvatarZoomIconColor:var(--sapButton_Emphasized_TextColor);--fdAvatarZoomIconBorderColor:var(--sapButton_Emphasized_BorderColor);--fdAvatarZoomIconBackground:var(--sapButton_Emphasized_Background)}.fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdAvatarZoomIconBackground);border:.0625rem solid var(--fdAvatarZoomIconBorderColor);border-radius:100%;color:var(--fdAvatarZoomIconColor);font-size:var(--fdAvatarZoomIconFontSize);height:var(--fdAvatarZoomIconDimensions);min-width:var(--fdAvatarZoomIconDimensions);position:absolute;width:var(--fdAvatarZoomIconDimensions);z-index:5}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{bottom:var(--fdAvatarZoomIconPosition);right:var(--fdAvatarZoomIconPosition)}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon][dir=rtl],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{left:var(--fdAvatarZoomIconPosition);right:auto}.fd-avatar__zoom-icon--positive{--fdAvatarZoomIconColor:var(--sapPositiveTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapSuccessBackground)}.fd-avatar__zoom-icon--caution{--fdAvatarZoomIconColor:var(--sapCriticalTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapWarningBackground)}.fd-avatar__zoom-icon--negative{--fdAvatarZoomIconColor:var(--sapNegativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapErrorBackground)}.fd-avatar__zoom-icon--information{--fdAvatarZoomIconColor:var(--sapInformativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapInformationBackground)}.fd-avatar__zoom-icon--indication-1{--fdAvatarZoomIconColor:var(--sapIndicationColor_1_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_1_Background)}.fd-avatar__zoom-icon--indication-2{--fdAvatarZoomIconColor:var(--sapIndicationColor_2_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_2_Background)}.fd-avatar__zoom-icon--indication-3{--fdAvatarZoomIconColor:var(--sapIndicationColor_3_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_3_Background)}.fd-avatar__zoom-icon--indication-4{--fdAvatarZoomIconColor:var(--sapIndicationColor_4_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_4_Background)}.fd-avatar__zoom-icon--indication-5{--fdAvatarZoomIconColor:var(--sapIndicationColor_5_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_5_Background)}.fd-avatar__zoom-icon--indication-6{--fdAvatarZoomIconColor:var(--sapIndicationColor_6_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_6_Background)}.fd-avatar__zoom-icon--indication-7{--fdAvatarZoomIconColor:var(--sapIndicationColor_7_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_7_Background)}.fd-avatar__zoom-icon--indication-8{--fdAvatarZoomIconColor:var(--sapIndicationColor_8_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_8_Background)}.fd-avatar__zoom-icon--indication-9{--fdAvatarZoomIconColor:var(--sapIndicationColor_9_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_9_Background)}.fd-avatar__zoom-icon--indication-10{--fdAvatarZoomIconColor:var(--sapIndicationColor_10_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_10_Background)}.fd-avatar__icon [class*=sap-icon],.fd-avatar__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:center;align-content:center}.fd-avatar--circle{--fdAvatarBorderRadius:100%}.fd-avatar--circle.is-focus,.fd-avatar--circle:focus{outline:none}.fd-avatar--circle.is-focus:after,.fd-avatar--circle:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--background-contain{--fdAvatarBackgroundSize:contain}.fd-avatar--transparent{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarColor:var(--sapContent_IconColor);--fdAvatarBorderHoverColor:var(--sapContent_IconColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--tile{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapTile_Background);--fdAvatarColor:var(--sapTile_IconColor);--fdAvatarBorderHoverColor:var(--sapTile_IconColor);--fdAvatarHoverBackgroundColor:var(--sapTile_Background)}.fd-avatar--placeholder{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapContent_ImagePlaceholderBackground);--fdAvatarColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarBorderHoverColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarHoverBackgroundColor:var(--sapContent_ImagePlaceholderBackground)}.fd-avatar--thumbnail{--fdAvatarBorderColor:var(--fdAvatar_Thumbnail_BorderColor);--fdAvatarHoverBorderColor:var(--sapContent_IconColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--border{--fdAvatarBorderColor:var(--sapGroup_ContentBorderColor);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor)}.fd-avatar--overflow{cursor:pointer;--fdAvatarBorderWidth:var(--fdAvatar_Overflow_Border_Width);--fdAvatarBorderColor:var(--sapButton_BorderColor);--fdAvatarBackgroundColor:var(--sapButton_Background);--fdAvatarColor:var(--sapButton_TextColor);--fdAvatarHoverBackgroundColor:var(--sapButton_Hover_Background);--fdAvatarHoverBorderColor:var(--sapButton_Hover_BorderColor);--fdAvatarBorderActiveColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapButton_Active_Background);--fdAvatarActiveColor:var(--sapButton_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapButton_Active_Background);--fdAvatarActiveHoverColor:var(--sapButton_Active_TextColor)}.fd-avatar--overflow.is-disabled,.fd-avatar--overflow:disabled,.fd-avatar--overflow[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--accent-color-1,.fd-avatar--accent-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_1_BorderColor);--fdAvatarColor:var(--sapAvatar_1_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_1_Hover_Background)}.fd-avatar--accent-color-2,.fd-avatar--accent-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_2_BorderColor);--fdAvatarColor:var(--sapAvatar_2_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_2_Hover_Background)}.fd-avatar--accent-color-3,.fd-avatar--accent-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_3_BorderColor);--fdAvatarColor:var(--sapAvatar_3_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_3_Hover_Background)}.fd-avatar--accent-color-4,.fd-avatar--accent-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_4_BorderColor);--fdAvatarColor:var(--sapAvatar_4_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_4_Hover_Background)}.fd-avatar--accent-color-5,.fd-avatar--accent-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_5_BorderColor);--fdAvatarColor:var(--sapAvatar_5_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_5_Hover_Background)}.fd-avatar--accent-color-6,.fd-avatar--accent-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_6_BorderColor);--fdAvatarColor:var(--sapAvatar_6_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_6_Hover_Background)}.fd-avatar--accent-color-7,.fd-avatar--accent-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_7_BorderColor);--fdAvatarColor:var(--sapAvatar_7_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_7_Hover_Background)}.fd-avatar--accent-color-8,.fd-avatar--accent-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_8_BorderColor);--fdAvatarColor:var(--sapAvatar_8_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_8_Hover_Background)}.fd-avatar--accent-color-9,.fd-avatar--accent-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_9_BorderColor);--fdAvatarColor:var(--sapAvatar_9_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_9_Hover_Background)}.fd-avatar--accent-color-10,.fd-avatar--accent-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_10_BorderColor);--fdAvatarColor:var(--sapAvatar_10_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_10_Hover_Background)}.fd-avatar--indication-color-1,.fd-avatar--indication-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_1_BorderColor);--fdAvatarColor:var(--sapIndicationColor_1_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_1_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_1_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_1_Active_TextColor)}.fd-avatar--indication-color-2,.fd-avatar--indication-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_2_BorderColor);--fdAvatarColor:var(--sapIndicationColor_2_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_2_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_2_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_2_Active_TextColor)}.fd-avatar--indication-color-3,.fd-avatar--indication-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_3_BorderColor);--fdAvatarColor:var(--sapIndicationColor_3_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_3_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_3_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_3_Active_TextColor)}.fd-avatar--indication-color-4,.fd-avatar--indication-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_4_BorderColor);--fdAvatarColor:var(--sapIndicationColor_4_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_4_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_4_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_4_Active_TextColor)}.fd-avatar--indication-color-5,.fd-avatar--indication-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_5_BorderColor);--fdAvatarColor:var(--sapIndicationColor_5_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_5_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_5_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_5_Active_TextColor)}.fd-avatar--indication-color-6,.fd-avatar--indication-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_6_BorderColor);--fdAvatarColor:var(--sapIndicationColor_6_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_6_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_6_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_6_Active_TextColor)}.fd-avatar--indication-color-7,.fd-avatar--indication-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_7_BorderColor);--fdAvatarColor:var(--sapIndicationColor_7_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_7_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_7_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_7_Active_TextColor)}.fd-avatar--indication-color-8,.fd-avatar--indication-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_8_BorderColor);--fdAvatarColor:var(--sapIndicationColor_8_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_8_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_8_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_8_Active_TextColor)}.fd-avatar--indication-color-9,.fd-avatar--indication-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_9_BorderColor);--fdAvatarColor:var(--sapIndicationColor_9_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_9_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_9_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_9_Active_TextColor)}.fd-avatar--indication-color-10,.fd-avatar--indication-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_10_BorderColor);--fdAvatarColor:var(--sapIndicationColor_10_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_10_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_10_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_10_Active_TextColor)}.fd-avatar--xs{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:2rem;--fdAvatarFontSize:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.25rem}.fd-avatar--xs .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xs .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--s{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--s .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--s .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--sm{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--sm .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--sm .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--m{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--m .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--m .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--md{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--md .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--md .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--l{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--l .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--l .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--lg{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--lg .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--lg .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--xl{--fdAvatarZoomIconOffset:-.25rem;--fdAvatarRatio:7rem;--fdAvatarFontSize:3rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:3.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:3.75rem}.fd-avatar--xl .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xl .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.75rem;--fdAvatarZoomIconFontSize:1rem}.fd-avatar--accent-color-1.fd-avatar--shell,.fd-avatar--accent-color-10.fd-avatar--shell,.fd-avatar--accent-color-2.fd-avatar--shell,.fd-avatar--accent-color-3.fd-avatar--shell,.fd-avatar--accent-color-4.fd-avatar--shell,.fd-avatar--accent-color-5.fd-avatar--shell,.fd-avatar--accent-color-6.fd-avatar--shell,.fd-avatar--accent-color-7.fd-avatar--shell,.fd-avatar--accent-color-8.fd-avatar--shell,.fd-avatar--accent-color-9.fd-avatar--shell,.fd-avatar--indication-color-1.fd-avatar--shell,.fd-avatar--indication-color-10.fd-avatar--shell,.fd-avatar--indication-color-2.fd-avatar--shell,.fd-avatar--indication-color-3.fd-avatar--shell,.fd-avatar--indication-color-4.fd-avatar--shell,.fd-avatar--indication-color-5.fd-avatar--shell,.fd-avatar--indication-color-6.fd-avatar--shell,.fd-avatar--indication-color-7.fd-avatar--shell,.fd-avatar--indication-color-8.fd-avatar--shell,.fd-avatar--indication-color-9.fd-avatar--shell{border:.0625rem solid var(--sapShell_InteractiveBorderColor)}.fd-avatar--l,.fd-avatar--lg,.fd-avatar--m,.fd-avatar--md,.fd-avatar--s,.fd-avatar--sm,.fd-avatar--xl,.fd-avatar--xs{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-avatar--l:not(.fd-avatar--circle),.fd-avatar--lg:not(.fd-avatar--circle),.fd-avatar--m:not(.fd-avatar--circle),.fd-avatar--md:not(.fd-avatar--circle),.fd-avatar--s:not(.fd-avatar--circle),.fd-avatar--sm:not(.fd-avatar--circle),.fd-avatar--xl:not(.fd-avatar--circle),.fd-avatar--xs:not(.fd-avatar--circle){--fdAvatarZoomIconPosition:var(--fdAvatarZoomIconOffset)}.fd-avatar-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.fd-avatar-group:after,.fd-avatar-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group .fd-avatar:not(:first-child){margin-block:var(--fdAvatarGroupItemsSpacingY) 0;margin-inline:var(--fdAvatarGroupItemsSpacingX) 0}.fd-avatar-group__overflow-body{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;white-space:normal}.fd-avatar-group__overflow-body:after,.fd-avatar-group__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group__overflow-body--no-padding{padding-block:0;padding-inline:0}.fd-avatar-group__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group__overflow-body>.fd-avatar{margin-block:.25rem;margin-inline:.25rem}.fd-avatar-group__popover-control{position:relative}.fd-avatar-group__popover-control.is-focus,.fd-avatar-group__popover-control:focus{z-index:5}.fd-avatar-group__popover-control.is-focus.is-focus,.fd-avatar-group__popover-control.is-focus:focus,.fd-avatar-group__popover-control:focus.is-focus,.fd-avatar-group__popover-control:focus:focus{outline:none}.fd-avatar-group__popover-control.is-focus.is-focus:after,.fd-avatar-group__popover-control.is-focus:focus:after,.fd-avatar-group__popover-control:focus.is-focus:after,.fd-avatar-group__popover-control:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar-group--vertical{height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-avatar-group--individual-type{gap:var(--fdAvatarGroupItemsGap)}.fd-avatar-group--individual-type.fd-avatar-group--xs{--fdAvatarGroupItemsGap:.0625rem}.fd-avatar-group--individual-type.fd-avatar-group--l,.fd-avatar-group--individual-type.fd-avatar-group--lg,.fd-avatar-group--individual-type.fd-avatar-group--m,.fd-avatar-group--individual-type.fd-avatar-group--md,.fd-avatar-group--individual-type.fd-avatar-group--s,.fd-avatar-group--individual-type.fd-avatar-group--sm{--fdAvatarGroupItemsGap:.125rem}.fd-avatar-group--individual-type.fd-avatar-group--xl{--fdAvatarGroupItemsGap:.25rem}.fd-avatar-group--group-type{position:relative}.fd-avatar-group--group-type .fd-avatar{pointer-events:none}.fd-avatar-group--group-type.fd-avatar-group--xs{--fdAvatarGroupItemsSpacingX:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--xs.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--s{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--s.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--m{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--m.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--l{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--l.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--xl{--fdAvatarGroupItemsSpacingX:-2.75rem}.fd-avatar-group--group-type.fd-avatar-group--xl.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2.75rem}.fd-avatar-group--group-type.is-hover .fd-avatar,.fd-avatar-group--group-type:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar-group--group-type.is-active .fd-avatar,.fd-avatar-group--group-type:active .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-active.is-hover .fd-avatar,.fd-avatar-group--group-type.is-active:hover .fd-avatar,.fd-avatar-group--group-type:active.is-hover .fd-avatar,.fd-avatar-group--group-type:active:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-toggled .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-toggled.is-hover .fd-avatar,.fd-avatar-group--group-type.is-toggled:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-disabled,.fd-avatar-group--group-type:disabled,.fd-avatar-group--group-type[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-avatar-group--group-type.is-focus,.fd-avatar-group--group-type:focus{z-index:5}.fd-avatar-group--group-type.is-focus.is-focus,.fd-avatar-group--group-type.is-focus:focus,.fd-avatar-group--group-type:focus.is-focus,.fd-avatar-group--group-type:focus:focus{outline:none}.fd-avatar-group--group-type.is-focus.is-focus:after,.fd-avatar-group--group-type.is-focus:focus:after,.fd-avatar-group--group-type:focus.is-focus:after,.fd-avatar-group--group-type:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}fd-popover{display:inline-block}fd-avatar-group{display:block}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type{gap:initial}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control{display:block;height:100%}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline-start:var(--fdAvatarGroupItemsGap)}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover:first-child>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline:0}fd-avatar-group>.fd-popover-custom{width:100%}fd-avatar-group>.fd-popover-custom .fd-popover__control{display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group{display:inline-block}\n/*!\n * Fundamental Library Styles v0.41.9\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n"] }]
857
+ ], template: "<ng-content></ng-content>\n@if (type === 'individual') {\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n fdkResizeObserver\n fdkFocusableList\n [contentDirection]=\"contentDirection()\"\n [wrap]=\"true\"\n [navigationDirection]=\"orientation()\"\n [items]=\"_avatars\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelIndividual()\"\n (resized)=\"_detectChanges()\"\n (itemFocused)=\"_onItemFocused($event)\"\n >\n @for (item of _avatars; track item) {\n <fd-popover [noArrow]=\"false\" [focusAutoCapture]=\"true\">\n <fd-popover-control\n class=\"fd-avatar-group__popover-control\"\n tabindex=\"-1\"\n (click)=\"outletItem.element.focus()\"\n >\n <ng-template\n #outletItem=\"fdAvatarGroupItemPortal\"\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n </fd-popover-control>\n @if (item.details) {\n <ng-template fdPopoverBody>\n <ng-template [ngTemplateOutlet]=\"item.details\"></ng-template>\n </ng-template>\n }\n </fd-popover>\n }\n <ng-template [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\" let-hiddenItems>\n <fd-popover\n #overflowPopover\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(hiddenItems.length)\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\" tabindex=\"-1\">\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button\n [size]=\"size\"\n [colorAccent]=\"1\"\n [circle]=\"overflowButtonShape() === 'circle'\"\n >\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems, popoverRef: overflowPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n </ng-template>\n </fd-avatar-group-host>\n} @else {\n <fd-popover\n #groupPopover\n [placement]=\"_effectivePlacement()\"\n [noArrow]=\"false\"\n [focusAutoCapture]=\"true\"\n [bodyAriaLabel]=\"_popupBodyAriaLabel(_avatars.length)\"\n fdkResizeObserver\n (resized)=\"_detectChanges()\"\n >\n <fd-popover-control class=\"fd-avatar-group__popover-control\">\n <fd-avatar-group-host\n #avatarGroupHostComponent\n [type]=\"type\"\n [size]=\"size\"\n [orientation]=\"orientation()\"\n [maxVisibleItems]=\"maxVisibleItems()\"\n [attr.aria-label]=\"ariaLabel || _defaultAriaLabelGroup()\"\n role=\"button\"\n tabindex=\"0\"\n >\n @for (item of _avatars; track item) {\n <ng-template\n cdkPortalOutlet\n fdAvatarGroupItemPortal\n [forceVisibility]=\"item.forceVisibility\"\n [avatarGroupItem]=\"item\"\n >\n </ng-template>\n }\n <ng-template\n [fdAvatarGroupInternalOverflowButton]=\"avatarGroupHostComponent._hiddenItems()\"\n let-hiddenItems\n >\n <ng-template\n [ngTemplateOutlet]=\"overflowButtonTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: hiddenItems }\"\n ></ng-template>\n </ng-template>\n </fd-avatar-group-host>\n </fd-popover-control>\n <ng-template fdPopoverBody>\n <ng-template\n [ngTemplateOutlet]=\"avatarGroupOverflowBodyTemplate\"\n [ngTemplateOutletContext]=\"{ $implicit: _avatarRenderers, popoverRef: groupPopover }\"\n ></ng-template>\n </ng-template>\n </fd-popover>\n}\n<ng-template #overflowButtonTemplate let-hiddenItems>\n @if (_overflowButton) {\n <ng-template\n [ngTemplateOutlet]=\"_overflowButton._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-avatar-group-overflow-button\n [size]=\"size\"\n [colorAccent]=\"1\"\n [fdkFocusableItem]=\"false\"\n [circle]=\"overflowButtonShape() === 'circle'\"\n >\n +{{ hiddenItems.length }}\n </fd-avatar-group-overflow-button>\n }\n</ng-template>\n<ng-template #avatarGroupOverflowBodyTemplate let-hiddenItems let-popoverRef=\"popoverRef\">\n @if (_avatarGroupPopoverBody) {\n <ng-template\n [ngTemplateOutlet]=\"_avatarGroupPopoverBody._templateRef\"\n [ngTemplateOutletContext]=\"{ hiddenItems: hiddenItems }\"\n />\n } @else {\n <fd-default-avatar-group-overflow-body\n [avatars]=\"hiddenItems\"\n [overflowPopoverTitle]=\"overflowPopoverTitle\"\n [overflowHeadingLevel]=\"overflowHeadingLevel()\"\n (escapePressed)=\"popoverRef?.close()\"\n />\n }\n</ng-template>\n", styles: [".fd-avatar{--fdAvatarZoomIconPosition:0;background-color:var(--fdAvatarBackgroundColor);background-position:50%;background-repeat:no-repeat;background-size:var(--fdAvatarBackgroundSize);border:0;border:var(--fdAvatarBorderWidth, .0625rem) solid var(--fdAvatarBorderColor);border-radius:var(--fdAvatarBorderRadius);-webkit-box-shadow:var(--fdAvatarBoxShadow);box-shadow:var(--fdAvatarBoxShadow);-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);color:var(--fdAvatarColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-size:var(--fdAvatarFontSize);font-weight:400;forced-color-adjust:none;height:var(--fdAvatarRatio);line-height:normal;margin-block:0;margin-inline:0;max-height:var(--fdAvatarRatio);max-width:var(--fdAvatarRatio);min-height:var(--fdAvatarRatio);min-width:var(--fdAvatarRatio);padding-block:0;padding-inline:0;position:relative;text-shadow:var(--fdAvatarTextShadow);vertical-align:middle;width:var(--fdAvatarRatio)}.fd-avatar:after,.fd-avatar:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar.is-focus,.fd-avatar:focus{outline:none}.fd-avatar.is-focus:after,.fd-avatar:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--interactive,.fd-avatar[role=button],.fd-avatar[tabindex=\"0\"]{cursor:pointer}.fd-avatar--interactive.is-hover,.fd-avatar--interactive:hover,.fd-avatar[role=button].is-hover,.fd-avatar[role=button]:hover,.fd-avatar[tabindex=\"0\"].is-hover,.fd-avatar[tabindex=\"0\"]:hover{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar--interactive.is-disabled,.fd-avatar--interactive:disabled,.fd-avatar--interactive[aria-disabled=true],.fd-avatar[role=button].is-disabled,.fd-avatar[role=button]:disabled,.fd-avatar[role=button][aria-disabled=true],.fd-avatar[tabindex=\"0\"].is-disabled,.fd-avatar[tabindex=\"0\"]:disabled,.fd-avatar[tabindex=\"0\"][aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--interactive.is-active,.fd-avatar--interactive:active,.fd-avatar[role=button].is-active,.fd-avatar[role=button]:active,.fd-avatar[tabindex=\"0\"].is-active,.fd-avatar[tabindex=\"0\"]:active{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-active.is-hover,.fd-avatar--interactive.is-active:hover,.fd-avatar--interactive:active.is-hover,.fd-avatar--interactive:active:hover,.fd-avatar[role=button].is-active.is-hover,.fd-avatar[role=button].is-active:hover,.fd-avatar[role=button]:active.is-hover,.fd-avatar[role=button]:active:hover,.fd-avatar[tabindex=\"0\"].is-active.is-hover,.fd-avatar[tabindex=\"0\"].is-active:hover,.fd-avatar[tabindex=\"0\"]:active.is-hover,.fd-avatar[tabindex=\"0\"]:active:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-toggled,.fd-avatar[role=button].is-toggled,.fd-avatar[tabindex=\"0\"].is-toggled{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar--interactive.is-toggled.is-hover,.fd-avatar--interactive.is-toggled:hover,.fd-avatar[role=button].is-toggled.is-hover,.fd-avatar[role=button].is-toggled:hover,.fd-avatar[tabindex=\"0\"].is-toggled.is-hover,.fd-avatar[tabindex=\"0\"].is-toggled:hover{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar--interactive.is-focus,.fd-avatar--interactive:focus,.fd-avatar[role=button].is-focus,.fd-avatar[role=button]:focus,.fd-avatar[tabindex=\"0\"].is-focus,.fd-avatar[tabindex=\"0\"]:focus{padding-block:.125rem;padding-inline:.125rem;z-index:5}.fd-avatar__zoom-icon{--fdAvatarZoomIconColor:var(--sapButton_Emphasized_TextColor);--fdAvatarZoomIconBorderColor:var(--sapButton_Emphasized_BorderColor);--fdAvatarZoomIconBackground:var(--sapButton_Emphasized_Background)}.fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;background:var(--fdAvatarZoomIconBackground);border:.0625rem solid var(--fdAvatarZoomIconBorderColor);border-radius:100%;color:var(--fdAvatarZoomIconColor);font-size:var(--fdAvatarZoomIconFontSize);height:var(--fdAvatarZoomIconDimensions);min-width:var(--fdAvatarZoomIconDimensions);position:absolute;width:var(--fdAvatarZoomIconDimensions);z-index:5}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{bottom:var(--fdAvatarZoomIconPosition);right:var(--fdAvatarZoomIconPosition)}.fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon][dir=rtl],.fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon][dir=rtl],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon [class*=sap-icon][class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon] [class*=sap-icon],[dir=rtl] .fd-avatar__zoom-icon[class*=sap-icon][class*=sap-icon]{left:var(--fdAvatarZoomIconPosition);right:auto}.fd-avatar__zoom-icon--positive{--fdAvatarZoomIconColor:var(--sapPositiveTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapSuccessBackground)}.fd-avatar__zoom-icon--caution{--fdAvatarZoomIconColor:var(--sapCriticalTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapWarningBackground)}.fd-avatar__zoom-icon--negative{--fdAvatarZoomIconColor:var(--sapNegativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapErrorBackground)}.fd-avatar__zoom-icon--information{--fdAvatarZoomIconColor:var(--sapInformativeTextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapInformationBackground)}.fd-avatar__zoom-icon--indication-1{--fdAvatarZoomIconColor:var(--sapIndicationColor_1_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_1_Background)}.fd-avatar__zoom-icon--indication-2{--fdAvatarZoomIconColor:var(--sapIndicationColor_2_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_2_Background)}.fd-avatar__zoom-icon--indication-3{--fdAvatarZoomIconColor:var(--sapIndicationColor_3_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_3_Background)}.fd-avatar__zoom-icon--indication-4{--fdAvatarZoomIconColor:var(--sapIndicationColor_4_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_4_Background)}.fd-avatar__zoom-icon--indication-5{--fdAvatarZoomIconColor:var(--sapIndicationColor_5_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_5_Background)}.fd-avatar__zoom-icon--indication-6{--fdAvatarZoomIconColor:var(--sapIndicationColor_6_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_6_Background)}.fd-avatar__zoom-icon--indication-7{--fdAvatarZoomIconColor:var(--sapIndicationColor_7_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_7_Background)}.fd-avatar__zoom-icon--indication-8{--fdAvatarZoomIconColor:var(--sapIndicationColor_8_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_8_Background)}.fd-avatar__zoom-icon--indication-9{--fdAvatarZoomIconColor:var(--sapIndicationColor_9_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_9_Background)}.fd-avatar__zoom-icon--indication-10{--fdAvatarZoomIconColor:var(--sapIndicationColor_10_TextColor);--fdAvatarZoomIconBorderColor: ;--fdAvatarZoomIconBackground:var(--sapIndicationColor_10_Background)}.fd-avatar__icon [class*=sap-icon],.fd-avatar__icon[class*=sap-icon]{background:inherit;border-radius:inherit;color:inherit;display:-webkit-box;display:-ms-flexbox;display:flex;font-size:inherit;line-height:1;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-ms-flex-line-pack:center;align-content:center}.fd-avatar--circle{--fdAvatarBorderRadius:100%}.fd-avatar--circle.is-focus,.fd-avatar--circle:focus{outline:none}.fd-avatar--circle.is-focus:after,.fd-avatar--circle:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatar_Focus_Outline_Radius_Circle);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset) var(--fdAvatar_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar--background-contain{--fdAvatarBackgroundSize:contain}.fd-avatar--transparent{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarColor:var(--sapContent_IconColor);--fdAvatarBorderHoverColor:var(--sapContent_IconColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--tile{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapTile_Background);--fdAvatarColor:var(--sapTile_IconColor);--fdAvatarBorderHoverColor:var(--sapTile_IconColor);--fdAvatarHoverBackgroundColor:var(--sapTile_Background)}.fd-avatar--placeholder{--fdAvatarBorderColor:var(--sapAvatar_Lite_BorderColor);--fdAvatarBackgroundColor:var(--sapContent_ImagePlaceholderBackground);--fdAvatarColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarBorderHoverColor:var(--sapContent_ImagePlaceholderForegroundColor);--fdAvatarHoverBackgroundColor:var(--sapContent_ImagePlaceholderBackground)}.fd-avatar--thumbnail{--fdAvatarBorderColor:var(--fdAvatar_Thumbnail_BorderColor);--fdAvatarHoverBorderColor:var(--sapContent_IconColor);--fdAvatarBackgroundColor:var(--sapAvatar_Lite_Background);--fdAvatarHoverBackgroundColor:var(--sapAvatar_Lite_Background)}.fd-avatar--border{--fdAvatarBorderColor:var(--sapGroup_ContentBorderColor);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor)}.fd-avatar--overflow{cursor:pointer;--fdAvatarBorderWidth:var(--fdAvatar_Overflow_Border_Width);--fdAvatarBorderColor:var(--sapButton_BorderColor);--fdAvatarBackgroundColor:var(--sapButton_Background);--fdAvatarColor:var(--sapButton_TextColor);--fdAvatarHoverBackgroundColor:var(--sapButton_Hover_Background);--fdAvatarHoverBorderColor:var(--sapButton_Hover_BorderColor);--fdAvatarBorderActiveColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapButton_Active_Background);--fdAvatarActiveColor:var(--sapButton_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapButton_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapButton_Active_Background);--fdAvatarActiveHoverColor:var(--sapButton_Active_TextColor)}.fd-avatar--overflow.is-disabled,.fd-avatar--overflow:disabled,.fd-avatar--overflow[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity)}.fd-avatar--accent-color-1,.fd-avatar--accent-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_1_BorderColor);--fdAvatarColor:var(--sapAvatar_1_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_1_Hover_Background)}.fd-avatar--accent-color-2,.fd-avatar--accent-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_2_BorderColor);--fdAvatarColor:var(--sapAvatar_2_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_2_Hover_Background)}.fd-avatar--accent-color-3,.fd-avatar--accent-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_3_BorderColor);--fdAvatarColor:var(--sapAvatar_3_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_3_Hover_Background)}.fd-avatar--accent-color-4,.fd-avatar--accent-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_4_BorderColor);--fdAvatarColor:var(--sapAvatar_4_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_4_Hover_Background)}.fd-avatar--accent-color-5,.fd-avatar--accent-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_5_BorderColor);--fdAvatarColor:var(--sapAvatar_5_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_5_Hover_Background)}.fd-avatar--accent-color-6,.fd-avatar--accent-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_6_BorderColor);--fdAvatarColor:var(--sapAvatar_6_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_6_Hover_Background)}.fd-avatar--accent-color-7,.fd-avatar--accent-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_7_BorderColor);--fdAvatarColor:var(--sapAvatar_7_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_7_Hover_Background)}.fd-avatar--accent-color-8,.fd-avatar--accent-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_8_BorderColor);--fdAvatarColor:var(--sapAvatar_8_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_8_Hover_Background)}.fd-avatar--accent-color-9,.fd-avatar--accent-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_9_BorderColor);--fdAvatarColor:var(--sapAvatar_9_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_9_Hover_Background)}.fd-avatar--accent-color-10,.fd-avatar--accent-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapAvatar_10_BorderColor);--fdAvatarColor:var(--sapAvatar_10_TextColor);--fdAvatarBackgroundColor:var(--sapAvatar_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapAvatar_10_Hover_Background)}.fd-avatar--indication-color-1,.fd-avatar--indication-color-1.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_1_BorderColor);--fdAvatarColor:var(--sapIndicationColor_1_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_1_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_1_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_1_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_1_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_1_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_1_Active_TextColor)}.fd-avatar--indication-color-2,.fd-avatar--indication-color-2.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_2_BorderColor);--fdAvatarColor:var(--sapIndicationColor_2_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_2_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_2_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_2_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_2_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_2_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_2_Active_TextColor)}.fd-avatar--indication-color-3,.fd-avatar--indication-color-3.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_3_BorderColor);--fdAvatarColor:var(--sapIndicationColor_3_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_3_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_3_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_3_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_3_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_3_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_3_Active_TextColor)}.fd-avatar--indication-color-4,.fd-avatar--indication-color-4.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_4_BorderColor);--fdAvatarColor:var(--sapIndicationColor_4_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_4_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_4_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_4_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_4_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_4_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_4_Active_TextColor)}.fd-avatar--indication-color-5,.fd-avatar--indication-color-5.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_5_BorderColor);--fdAvatarColor:var(--sapIndicationColor_5_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_5_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_5_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_5_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_5_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_5_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_5_Active_TextColor)}.fd-avatar--indication-color-6,.fd-avatar--indication-color-6.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_6_BorderColor);--fdAvatarColor:var(--sapIndicationColor_6_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_6_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_6_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_6_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_6_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_6_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_6_Active_TextColor)}.fd-avatar--indication-color-7,.fd-avatar--indication-color-7.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_7_BorderColor);--fdAvatarColor:var(--sapIndicationColor_7_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_7_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_7_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_7_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_7_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_7_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_7_Active_TextColor)}.fd-avatar--indication-color-8,.fd-avatar--indication-color-8.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_8_BorderColor);--fdAvatarColor:var(--sapIndicationColor_8_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_8_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_8_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_8_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_8_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_8_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_8_Active_TextColor)}.fd-avatar--indication-color-9,.fd-avatar--indication-color-9.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_9_BorderColor);--fdAvatarColor:var(--sapIndicationColor_9_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_9_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_9_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_9_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_9_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_9_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_9_Active_TextColor)}.fd-avatar--indication-color-10,.fd-avatar--indication-color-10.fd-avatar--overflow{--fdAvatarBorderColor:var(--sapIndicationColor_10_BorderColor);--fdAvatarColor:var(--sapIndicationColor_10_TextColor);--fdAvatarBackgroundColor:var(--sapIndicationColor_10_Background);--fdAvatarBorderHoverColor:var(--sapAvatar_Hover_BorderColor);--fdAvatarHoverBackgroundColor:var(--sapIndicationColor_10_Hover_Background);--fdAvatarBorderActiveColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveColor:var(--sapIndicationColor_10_Active_TextColor);--fdAvatarBorderActiveHoverColor:var(--sapIndicationColor_10_Active_BorderColor);--fdAvatarBackgroundActiveHoverColor:var(--sapIndicationColor_10_Active_Background);--fdAvatarActiveHoverColor:var(--sapIndicationColor_10_Active_TextColor)}.fd-avatar--xs{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:2rem;--fdAvatarFontSize:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xs.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.25rem}.fd-avatar--xs .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xs .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--s{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--s.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--s .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--s .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--sm{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:3rem;--fdAvatarFontSize:1.125rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--sm.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:1.75rem}.fd-avatar--sm .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--sm .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--m{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--m.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--m .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--m .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--md{--fdAvatarZoomIconOffset:-.125rem;--fdAvatarRatio:4rem;--fdAvatarFontSize:1.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2rem}:not(.fd-avatar-group--vertical)>.fd-avatar--md.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.25rem}.fd-avatar--md .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--md .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.125rem;--fdAvatarZoomIconFontSize:.75rem}.fd-avatar--l{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--l.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--l .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--l .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--lg{--fdAvatarZoomIconOffset:-.1875rem;--fdAvatarRatio:5rem;--fdAvatarFontSize:2.25rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:2.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--lg.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:2.75rem}.fd-avatar--lg .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--lg .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.25rem;--fdAvatarZoomIconFontSize:.875rem}.fd-avatar--xl{--fdAvatarZoomIconOffset:-.25rem;--fdAvatarRatio:7rem;--fdAvatarFontSize:3rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow{max-width:-webkit-fit-content;max-width:-moz-fit-content;max-width:fit-content;padding-inline:.5rem;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle{--fdAvatarBorderRadius:3.5rem}:not(.fd-avatar-group--vertical)>.fd-avatar--xl.fd-avatar--overflow.fd-avatar--circle:focus:after{border-radius:3.75rem}.fd-avatar--xl .fd-avatar__zoom-icon [class*=sap-icon],.fd-avatar--xl .fd-avatar__zoom-icon[class*=sap-icon]{--fdAvatarZoomIconDimensions:1.75rem;--fdAvatarZoomIconFontSize:1rem}.fd-avatar--accent-color-1.fd-avatar--shell,.fd-avatar--accent-color-10.fd-avatar--shell,.fd-avatar--accent-color-2.fd-avatar--shell,.fd-avatar--accent-color-3.fd-avatar--shell,.fd-avatar--accent-color-4.fd-avatar--shell,.fd-avatar--accent-color-5.fd-avatar--shell,.fd-avatar--accent-color-6.fd-avatar--shell,.fd-avatar--accent-color-7.fd-avatar--shell,.fd-avatar--accent-color-8.fd-avatar--shell,.fd-avatar--accent-color-9.fd-avatar--shell,.fd-avatar--indication-color-1.fd-avatar--shell,.fd-avatar--indication-color-10.fd-avatar--shell,.fd-avatar--indication-color-2.fd-avatar--shell,.fd-avatar--indication-color-3.fd-avatar--shell,.fd-avatar--indication-color-4.fd-avatar--shell,.fd-avatar--indication-color-5.fd-avatar--shell,.fd-avatar--indication-color-6.fd-avatar--shell,.fd-avatar--indication-color-7.fd-avatar--shell,.fd-avatar--indication-color-8.fd-avatar--shell,.fd-avatar--indication-color-9.fd-avatar--shell{border:.0625rem solid var(--sapShell_InteractiveBorderColor)}.fd-avatar--l,.fd-avatar--lg,.fd-avatar--m,.fd-avatar--md,.fd-avatar--s,.fd-avatar--sm,.fd-avatar--xl,.fd-avatar--xs{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.fd-avatar--l:not(.fd-avatar--circle),.fd-avatar--lg:not(.fd-avatar--circle),.fd-avatar--m:not(.fd-avatar--circle),.fd-avatar--md:not(.fd-avatar--circle),.fd-avatar--s:not(.fd-avatar--circle),.fd-avatar--sm:not(.fd-avatar--circle),.fd-avatar--xl:not(.fd-avatar--circle),.fd-avatar--xs:not(.fd-avatar--circle){--fdAvatarZoomIconPosition:var(--fdAvatarZoomIconOffset)}.fd-avatar-group{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);display:-webkit-box;display:-ms-flexbox;display:flex;font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-inline:0;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-ms-flex-direction:row;flex-direction:row}.fd-avatar-group:after,.fd-avatar-group:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group .fd-avatar:not(:first-child){margin-block:var(--fdAvatarGroupItemsSpacingY) 0;margin-inline:var(--fdAvatarGroupItemsSpacingX) 0}.fd-avatar-group__overflow-body{border:0;-webkit-box-sizing:border-box;box-sizing:border-box;color:var(--sapTextColor);font-family:var(--sapFontFamily);font-size:var(--sapFontSize);font-weight:400;forced-color-adjust:none;line-height:normal;margin-block:0;margin-inline:0;padding-block:0;padding-block:1rem;padding-inline:0;padding-inline:1rem;white-space:normal}.fd-avatar-group__overflow-body:after,.fd-avatar-group__overflow-body:before{-webkit-box-sizing:inherit;box-sizing:inherit;font-size:inherit}.fd-avatar-group__overflow-body--no-padding{padding-block:0;padding-inline:0}.fd-avatar-group__overflow-body--no-horizontal-scroll{overflow-x:hidden}.fd-avatar-group__overflow-body--no-vertical-scroll{overflow-y:hidden}.fd-avatar-group__overflow-body>.fd-avatar{margin-block:.25rem;margin-inline:.25rem}.fd-avatar-group__popover-control{position:relative}.fd-avatar-group__popover-control.is-focus,.fd-avatar-group__popover-control:focus{z-index:5}.fd-avatar-group__popover-control.is-focus.is-focus,.fd-avatar-group__popover-control.is-focus:focus,.fd-avatar-group__popover-control:focus.is-focus,.fd-avatar-group__popover-control:focus:focus{outline:none}.fd-avatar-group__popover-control.is-focus.is-focus:after,.fd-avatar-group__popover-control.is-focus:focus:after,.fd-avatar-group__popover-control:focus.is-focus:after,.fd-avatar-group__popover-control:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}.fd-avatar-group--vertical{height:100%;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.fd-avatar-group--individual-type{gap:var(--fdAvatarGroupItemsGap)}.fd-avatar-group--individual-type.fd-avatar-group--xs{--fdAvatarGroupItemsGap:.0625rem}.fd-avatar-group--individual-type.fd-avatar-group--l,.fd-avatar-group--individual-type.fd-avatar-group--lg,.fd-avatar-group--individual-type.fd-avatar-group--m,.fd-avatar-group--individual-type.fd-avatar-group--md,.fd-avatar-group--individual-type.fd-avatar-group--s,.fd-avatar-group--individual-type.fd-avatar-group--sm{--fdAvatarGroupItemsGap:.125rem}.fd-avatar-group--individual-type.fd-avatar-group--xl{--fdAvatarGroupItemsGap:.25rem}.fd-avatar-group--group-type{position:relative}.fd-avatar-group--group-type .fd-avatar{pointer-events:none}.fd-avatar-group--group-type.fd-avatar-group--xs{--fdAvatarGroupItemsSpacingX:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--xs.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-.5rem}.fd-avatar-group--group-type.fd-avatar-group--s{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--s.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm{--fdAvatarGroupItemsSpacingX:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--sm.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.25rem}.fd-avatar-group--group-type.fd-avatar-group--m{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--m.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md{--fdAvatarGroupItemsSpacingX:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--md.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-1.625rem}.fd-avatar-group--group-type.fd-avatar-group--l{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--l.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg{--fdAvatarGroupItemsSpacingX:-2rem}.fd-avatar-group--group-type.fd-avatar-group--lg.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2rem}.fd-avatar-group--group-type.fd-avatar-group--xl{--fdAvatarGroupItemsSpacingX:-2.75rem}.fd-avatar-group--group-type.fd-avatar-group--xl.fd-avatar-group--vertical{--fdAvatarGroupItemsSpacingX:0;--fdAvatarGroupItemsSpacingY:-2.75rem}.fd-avatar-group--group-type.is-hover .fd-avatar,.fd-avatar-group--group-type:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderHoverColor,var(--sapAvatar_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarHoverBackgroundColor,var(--sapAvatar_6_Hover_Background))}.fd-avatar-group--group-type.is-active .fd-avatar,.fd-avatar-group--group-type:active .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-active.is-hover .fd-avatar,.fd-avatar-group--group-type.is-active:hover .fd-avatar,.fd-avatar-group--group-type:active.is-hover .fd-avatar,.fd-avatar-group--group-type:active:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-toggled .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveColor,var(--sapButton_Active_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveColor,var(--sapButton_Active_Background));--fdAvatarColor:var(--fdAvatarActiveColor,var(--sapButton_Active_TextColor))}.fd-avatar-group--group-type.is-toggled.is-hover .fd-avatar,.fd-avatar-group--group-type.is-toggled:hover .fd-avatar{--fdAvatarBorderColor:var(--fdAvatarBorderActiveHoverColor,var(--sapButton_Selected_Hover_BorderColor));--fdAvatarBackgroundColor:var(--fdAvatarBackgroundActiveHoverColor,var(--sapButton_Selected_Hover_Background));--fdAvatarColor:var(--fdAvatarActiveHoverColor,var(--sapButton_Selected_TextColor))}.fd-avatar-group--group-type.is-disabled,.fd-avatar-group--group-type:disabled,.fd-avatar-group--group-type[aria-disabled=true]{opacity:var(--sapContent_DisabledOpacity);pointer-events:none}.fd-avatar-group--group-type.is-focus,.fd-avatar-group--group-type:focus{z-index:5}.fd-avatar-group--group-type.is-focus.is-focus,.fd-avatar-group--group-type.is-focus:focus,.fd-avatar-group--group-type:focus.is-focus,.fd-avatar-group--group-type:focus:focus{outline:none}.fd-avatar-group--group-type.is-focus.is-focus:after,.fd-avatar-group--group-type.is-focus:focus:after,.fd-avatar-group--group-type:focus.is-focus:after,.fd-avatar-group--group-type:focus:focus:after{border-color:var(--sapContent_FocusColor);border-radius:var(--fdAvatarGroup_Focus_Outline_Radius);border-style:var(--sapContent_FocusStyle);border-width:var(--sapContent_FocusWidth);content:\"\";inset:var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset) var(--fdAvatarGroup_Focus_Outline_Offset);pointer-events:none;position:absolute}fd-popover{display:inline-block}fd-avatar-group{display:block}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type{gap:initial}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control{display:block;height:100%}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline-start:var(--fdAvatarGroupItemsGap)}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type>fd-popover:first-child>.fd-popover__control>fd-popover-control>.fd-avatar{margin-inline:0}fd-avatar-group .fd-avatar-group.fd-avatar-group--individual-type.fd-avatar-group--vertical>fd-popover{align-self:flex-start}fd-avatar-group>.fd-popover-custom{width:100%}fd-avatar-group>.fd-popover-custom .fd-popover__control{display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group:not(.fd-avatar-group--vertical){display:inline-block}fd-avatar-group>.fd-popover-custom .fd-avatar-group.fd-avatar-group--vertical{display:flex}\n/*!\n * Fundamental Library Styles v0.41.9\n * Copyright (c) 2026 SAP SE or an SAP affiliate company.\n * Licensed under Apache License 2.0 (https://github.com/SAP/fundamental-styles/blob/main/LICENSE)\n */\n"] }]
777
858
  }], propDecorators: { type: [{
778
859
  type: Input
779
- }], orientation: [{
780
- type: Input
781
860
  }], size: [{
782
861
  type: Input
783
862
  }], overflowPopoverTitle: [{
@@ -796,7 +875,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImpor
796
875
  }], _avatarGroupPopoverBody: [{
797
876
  type: ContentChild,
798
877
  args: [AvatarGroupOverflowBodyDirective]
799
- }], overflowHeadingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "overflowHeadingLevel", required: false }] }], _avatarGroupHost: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AvatarGroupHostComponent), { isSignal: true }] }] } });
878
+ }], orientation: [{ type: i0.Input, args: [{ isSignal: true, alias: "orientation", required: false }] }], overflowHeadingLevel: [{ type: i0.Input, args: [{ isSignal: true, alias: "overflowHeadingLevel", required: false }] }], popoverPlacement: [{ type: i0.Input, args: [{ isSignal: true, alias: "popoverPlacement", required: false }] }], overflowButtonShape: [{ type: i0.Input, args: [{ isSignal: true, alias: "overflowButtonShape", required: false }] }], maxVisibleItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxVisibleItems", required: false }] }], _avatarGroupHost: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AvatarGroupHostComponent), { isSignal: true }] }] } });
800
879
 
801
880
  /**
802
881
  * Avatar group overflow body component, used to provide a template for the avatar group overflow body.