@acorex/modules 21.0.0-beta.14 → 21.0.0-beta.15

package/fesm2022/{acorex-modules-organization-management-org-chart.page-Cs-wTPS-.mjs → acorex-modules-organization-management-org-chart.page-CtXZUL1l.mjs}

@@ -16,22 +16,24 @@ import { AXSwitchModule } from '@acorex/components/switch';
 import * as i3 from '@acorex/core/translation';
 import { AXTranslationModule, AXTranslationService, createMultiLanguageString, resolveMultiLanguageString } from '@acorex/core/translation';
 import { AXPDataGenerator, AXPPlatformScope, AXPDeviceService, getActionButton } from '@acorex/platform/core';
-import { AXPAvatarComponent, AXPThemeLayoutBlockComponent } from '@acorex/platform/layout/components';
+import { AXPAvatarComponent, AXPThemeLayoutBlockComponent, AXPLayoutFloatingZoomBarComponent, AXPLayoutSideDetailPanelComponent } from '@acorex/platform/layout/components';
 import { AXPPageLayoutBaseComponent, AXPPageLayoutComponent, AXPPageLayoutBase } from '@acorex/platform/layout/views';
 import * as i3$1 from '@angular/common';
 import { AsyncPipe, CommonModule } from '@angular/common';
 import * as i0 from '@angular/core';
-import { inject, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable, signal, viewChild, NgZone, Injector, ViewContainerRef, LOCALE_ID, afterNextRender, effect } from '@angular/core';
+import { InjectionToken, inject, input, computed, ViewEncapsulation, ChangeDetectionStrategy, Component, Injectable, signal, viewChild, NgZone, Injector, ViewContainerRef, LOCALE_ID, afterNextRender, effect } from '@angular/core';
 import * as i1$1 from '@angular/forms';
 import { FormsModule } from '@angular/forms';
 import { ActivatedRoute, RouterModule } from '@angular/router';
 import set from 'lodash-es/set';
-import { A as AXM_ORG_CHART_HOST, a as AXMOrgChartNodeType, b as AXM_ORG_CHART_NODE_CONTRIBUTOR, R as RootConfig, n as normalizeVacantLeafSeatsSetting, c as AXPOrganizationManagementSettings, p as parseOrgChartMode, d as AXMOrgChartStructureRefreshHub, e as AXMOrgChartCategory, f as AXM_ORG_CHART_EMPLOYEE_SUBMENU_GROUP_ID, g as AXMOrgChartDetailPanelComponent } from './acorex-modules-organization-management-acorex-modules-organization-management-aord1Uv0.mjs';
+import { A as AXMOrgChartNodeType, a as AXM_ORG_CHART_NODE_CONTRIBUTOR, R as RootConfig, n as normalizeVacantLeafSeatsSetting, b as AXPOrganizationManagementSettings, p as parseOrgChartMode, c as AXMOrgChartStructureRefreshHub, d as AXMOrgChartCategory, e as AXM_ORG_CHART_EMPLOYEE_SUBMENU_GROUP_ID } from './acorex-modules-organization-management-acorex-modules-organization-management-DOcHVNRe.mjs';
 import { AXLoadingDialogService } from '@acorex/components/loading-dialog';
 import { AXPExportService, AXPSettingsService } from '@acorex/platform/common';
 import { AXPEntityService } from '@acorex/platform/layout/entity';
 import { AXPCommandService } from '@acorex/platform/runtime';
 
+const AXM_ORG_CHART_HOST = new InjectionToken('AXM_ORG_CHART_HOST');
+
 //#region ---- Imports ----
 //#endregion
 //#region ---- Component ----
@@ -550,7 +552,6 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         this.panX = signal(0, ...(ngDevMode ? [{ debugName: "panX" }] : /* istanbul ignore next */ []));
         this.panY = signal(0, ...(ngDevMode ? [{ debugName: "panY" }] : /* istanbul ignore next */ []));
         this.panZoomLevel = signal(100, ...(ngDevMode ? [{ debugName: "panZoomLevel" }] : /* istanbul ignore next */ []));
-        this.zoomPercentageLabel = computed(() => `${Math.round(this.panZoomLevel())}%`, ...(ngDevMode ? [{ debugName: "zoomPercentageLabel" }] : /* istanbul ignore next */ []));
         this.isChartRendered = false;
         this.selectedNodeId = signal(null, ...(ngDevMode ? [{ debugName: "selectedNodeId" }] : /* istanbul ignore next */ []));
         /** Large layouts: optional side panel with {@link getNodeInfoItems} for the selected node (same UX pattern as document drive). */
@@ -600,6 +601,82 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
             }
             return this.findNodeInTree(this.chartService.rootNode(), id);
         }, ...(ngDevMode ? [{ debugName: "detailPanelSelectedNode" }] : /* istanbul ignore next */ []));
+        /** Resolved copy for {@link AXPLayoutSideDetailPanelComponent} (loaded from i18n keys). */
+        this.detailPanelCopy = signal({
+            panelTitle: '',
+            emptyMessage: '',
+            detailsSection: '',
+            noRowsMessage: '',
+        }, ...(ngDevMode ? [{ debugName: "detailPanelCopy" }] : /* istanbul ignore next */ []));
+        this.detailPanelHeader = computed(() => {
+            const node = this.detailPanelSelectedNode();
+            if (node == null) {
+                return null;
+            }
+            const lang = this.localeId;
+            let secondaryTitle;
+            if (node.type === AXMOrgChartNodeType.BusinessUnit) {
+                if (node.description) {
+                    secondaryTitle = resolveMultiLanguageString(node.description, lang);
+                }
+                else if (node.subtitle) {
+                    secondaryTitle = resolveMultiLanguageString(node.subtitle, lang);
+                }
+            }
+            else if (node.subtitle) {
+                secondaryTitle = resolveMultiLanguageString(node.subtitle, lang);
+            }
+            return {
+                primaryTitle: resolveMultiLanguageString(node.title, lang),
+                secondaryTitle,
+                icon: {
+                    iconClass: this.detailPanelNodeIconClass(node),
+                    surfaceVars: this.getNodeColors(this.detailPanelNodeColorKey(node)),
+                },
+            };
+        }, ...(ngDevMode ? [{ debugName: "detailPanelHeader" }] : /* istanbul ignore next */ []));
+        this.detailPanelSections = computed(() => {
+            const node = this.detailPanelSelectedNode();
+            if (node == null) {
+                return [];
+            }
+            const items = this.getNodeInfoItems(node);
+            if (items.length === 0) {
+                return [];
+            }
+            const lang = this.localeId;
+            const copy = this.detailPanelCopy();
+            return [
+                {
+                    title: copy.detailsSection,
+                    rows: items.map((item) => ({
+                        label: resolveMultiLanguageString(item.label, lang),
+                        value: item.value,
+                    })),
+                },
+            ];
+        }, ...(ngDevMode ? [{ debugName: "detailPanelSections" }] : /* istanbul ignore next */ []));
+        this.detailPanelEmptyState = computed(() => {
+            if (this.detailPanelSelectedNode() != null) {
+                return null;
+            }
+            const copy = this.detailPanelCopy();
+            return {
+                primaryTitle: copy.panelTitle,
+                message: copy.emptyMessage,
+                icon: {
+                    iconClass: 'fa-solid fa-lg fa-fw fa-diagram-project',
+                    surfaceVars: this.getNodeColors('primary'),
+                },
+            };
+        }, ...(ngDevMode ? [{ debugName: "detailPanelEmptyState" }] : /* istanbul ignore next */ []));
+        this.detailPanelNoRowsMessage = computed(() => {
+            const node = this.detailPanelSelectedNode();
+            if (node == null || this.getNodeInfoItems(node).length > 0) {
+                return null;
+            }
+            return this.detailPanelCopy().noRowsMessage;
+        }, ...(ngDevMode ? [{ debugName: "detailPanelNoRowsMessage" }] : /* istanbul ignore next */ []));
         /** Bound to `ax-search-box` in the page toolbar. */
         this.chartSearchQuery = '';
         this.chartSearchPendingPresentation = 'none';
@@ -610,6 +687,11 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
             this.d3 = await import('d3');
             await this.refresh();
         });
+        //#endregion
+        //#region ---- Detail Panel ----
+        this.detailPanelI18nEffect = effect(() => {
+            void this.loadDetailPanelCopy();
+        }, ...(ngDevMode ? [{ debugName: "detailPanelI18nEffect" }] : /* istanbul ignore next */ []));
         this.chartService.applyHydratedUiPrefs(this.route.snapshot.data['orgChartUi']);
         effect(() => {
             const rev = this.orgChartStructureRefreshHub.structureDataRevision();
@@ -622,8 +704,46 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
     //#endregion
     //#region ---- Initialization ----
     #initialize;
-    //#endregion
-    //#region ---- Detail Panel ----
+    async loadDetailPanelCopy() {
+        const [panelTitle, emptyMessage, detailsSection, noRowsMessage] = await Promise.all([
+            this.translateService.translateAsync('@organization-management:organization-chart.components.chart.detail-panel.title'),
+            this.translateService.translateAsync('@organization-management:organization-chart.components.chart.detail-panel.empty'),
+            this.translateService.translateAsync('@organization-management:organization-chart.components.chart.detail-panel.details-section'),
+            this.translateService.translateAsync('@organization-management:organization-chart.components.chart.detail-panel.no-rows'),
+        ]);
+        this.detailPanelCopy.set({
+            panelTitle: panelTitle ?? '',
+            emptyMessage: emptyMessage ?? '',
+            detailsSection: detailsSection ?? '',
+            noRowsMessage: noRowsMessage ?? '',
+        });
+    }
+    /** Color token or literal CSS color for the detail panel header icon. */
+    detailPanelNodeColorKey(node) {
+        if (node.type === AXMOrgChartNodeType.Company) {
+            return 'primary';
+        }
+        if (node.type === AXMOrgChartNodeType.BusinessUnit) {
+            const typeColor = node.metadata?.['unitTypeColor'];
+            if (typeof typeColor === 'string' && typeColor.trim().length > 0) {
+                return typeColor.trim();
+            }
+            return node.metadata?.['isRegional'] === true ? 'accent1' : 'accent2';
+        }
+        if (node.type === AXMOrgChartNodeType.Position || node.type === AXMOrgChartNodeType.Employee) {
+            return 'accent3';
+        }
+        return 'primary';
+    }
+    detailPanelNodeIconClass(node) {
+        const raw = node.icon?.trim() ?? '';
+        const withoutWeight = raw
+            .replace(/\bfa-(solid|light|regular|thin|duotone)\b/gi, '')
+            .trim()
+            .replace(/\s+/g, ' ');
+        const glyph = withoutWeight.length > 0 ? withoutWeight : 'fa-sitemap';
+        return `fa-solid fa-lg fa-fw ${glyph}`;
+    }
     toggleDetailPanel() {
         this.isDetailPanelOpen.update((open) => !open);
     }
@@ -1570,7 +1690,7 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
         return null;
     }
     /**
-     * Metadata rows for {@link AXMOrgChartDetailPanelComponent} only (key-value list is not shown on chart cards).
+     * Metadata rows for the side detail panel only (key-value list is not shown on chart cards).
      */
     getNodeInfoItems(data) {
         const metadata = data.metadata ?? {};
@@ -1762,11 +1882,11 @@ class AXMOrgChartPage extends AXPPageLayoutBaseComponent {
                 useExisting: AXMOrgChartPage,
             },
             { provide: AXM_ORG_CHART_HOST, useExisting: AXMOrgChartPage },
-        ], viewQueries: [{ propertyName: "treeContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "parent", first: true, predicate: ["parent"], descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: AXContextMenuComponent, descendants: true, isSignal: true }, { propertyName: "panView", first: true, predicate: AXPanViewDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <ax-search-box\n          class=\"w-72\"\n          [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\"\n          [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"flex items-center gap-2 shrink-0 whitespace-nowrap\">\n          <span class=\"text-sm\"\n            >{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate | async }}</span\n          >\n          <ax-switch\n            [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"\n          ></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"overflow-hidden flex flex-col\">\n    <div class=\"flex flex-row gap-4 flex-1 min-h-0 overflow-hidden\" #parent id=\"parent\">\n      <div class=\"flex-1 min-w-0 min-h-0 overflow-hidden relative ax-light\">\n        <div\n          #chart\n          axPanView\n          [(panX)]=\"panX\"\n          [(panY)]=\"panY\"\n          [freeMode]=\"true\"\n          [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\"\n          wrapperClasses=\"h\"\n          class=\"ax-light\"\n          (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\"\n        ></div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button\n            look=\"blank\"\n            class=\"ax-sm __zoom-value\"\n            [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"\n          ></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu\n          [orientation]=\"'vertical'\"\n          [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\"\n        >\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel\n        class=\"sticky top-0 z-10 max-h-full flex-none\"\n        [node]=\"detailPanelSelectedNode()\"\n        (panelClose)=\"toggleDetailPanel()\"\n      />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["@layer properties;foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer;--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container.--selected .--container{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;right:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * -3);left:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:calc(var(--spacing, .25rem) * 0)}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:var(--radius-2xl, 1rem);--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, rgb(var(--node-bg-color)) 0%, rgb(var(--node-bg-color)) 55%, rgb(var(--node-bg-color)) 100% );--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100% )}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500));--oc-ring-3: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,rgb(var(--node-bg-color)) 0% 50%,rgb(var(--node-bg-color)))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:calc(var(--spacing, .25rem) * 12);height:calc(var(--spacing, .25rem) * 12);flex:none;align-items:center;justify-content:center;border-radius:var(--radius-xl, .75rem);color:rgb(var(--node-bg-color));background-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:90%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:85%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-style:var(--tw-border-style);border-width:0px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);text-transform:uppercase;color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-block:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;min-height:calc(var(--spacing, .25rem) * 14)}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){--tw-divide-x-reverse: 0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px * var(--tw-divide-x-reverse));border-inline-end-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){border-color:rgba(var(--ax-sys-color-lightest-surface))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *)>:not(:last-child)){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:95%;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:none;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:75%;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-radius:var(--radius-2xl, 1rem);padding:calc(var(--spacing, .25rem) * 1.5);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-divide-x-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-tracking: initial;--tw-divide-x-reverse: 0}}}\n/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: 
+        ], viewQueries: [{ propertyName: "treeContainer", first: true, predicate: ["chart"], descendants: true, isSignal: true }, { propertyName: "parent", first: true, predicate: ["parent"], descendants: true, isSignal: true }, { propertyName: "contextMenu", first: true, predicate: AXContextMenuComponent, descendants: true, isSignal: true }, { propertyName: "panView", first: true, predicate: AXPanViewDirective, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <ax-search-box\n          class=\"w-72\"\n          [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\"\n          [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"flex items-center gap-2 flex-shrink-0 whitespace-nowrap\">\n          <span class=\"text-sm\"\n            >{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate | async }}</span\n          >\n          <ax-switch\n            [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"\n          ></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"overflow-hidden flex flex-col\">\n    <div class=\"flex flex-row gap-4 flex-1 min-h-0 overflow-hidden\" #parent id=\"parent\">\n      <div class=\"flex-1 min-w-0 min-h-0 overflow-hidden relative ax-light\">\n        <div\n          #chart\n          axPanView\n          [(panX)]=\"panX\"\n          [(panY)]=\"panY\"\n          [freeMode]=\"true\"\n          [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\"\n          wrapperClasses=\"h\"\n          class=\"ax-light\"\n          (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\"\n        ></div>\n        <axp-layout-floating-zoom-bar\n          [zoomLevel]=\"panZoomLevel()\"\n          (zoomIn)=\"zoomIn()\"\n          (zoomOut)=\"zoomOut()\"\n          (zoomReset)=\"zoomReset()\"\n        />\n        <ax-context-menu\n          [orientation]=\"'vertical'\"\n          [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\"\n        >\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axp-layout-side-detail-panel\n        class=\"sticky top-0 z-10 max-h-full flex-none\"\n        [header]=\"detailPanelHeader()\"\n        [sections]=\"detailPanelSections()\"\n        [emptyState]=\"detailPanelEmptyState()\"\n        [noRowsMessage]=\"detailPanelNoRowsMessage()\"\n        (panelClose)=\"toggleDetailPanel()\"\n      />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["@layer properties;foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer;--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container.--selected .--container{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;right:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * -3);left:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:calc(var(--spacing, .25rem) * 0)}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:var(--radius-2xl, 1rem);--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, rgb(var(--node-bg-color)) 0%, rgb(var(--node-bg-color)) 55%, rgb(var(--node-bg-color)) 100% );--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100% )}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500));--oc-ring-3: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,rgb(var(--node-bg-color)) 0% 50%,rgb(var(--node-bg-color)))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:calc(var(--spacing, .25rem) * 12);height:calc(var(--spacing, .25rem) * 12);flex:none;align-items:center;justify-content:center;border-radius:var(--radius-xl, .75rem);color:rgb(var(--node-bg-color));background-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:90%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:85%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-style:var(--tw-border-style);border-width:0px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);text-transform:uppercase;color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-block:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;min-height:calc(var(--spacing, .25rem) * 14)}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){--tw-divide-x-reverse: 0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px * var(--tw-divide-x-reverse));border-inline-end-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){border-color:rgba(var(--ax-sys-color-lightest-surface))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *)>:not(:last-child)){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:95%;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:none;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:75%;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-divide-x-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-tracking: initial;--tw-divide-x-reverse: 0}}}\n/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: RouterModule }, { kind: "ngmodule", type: 
                 //
                 AXMenuModule }, { kind: "component", type: i2$1.AXContextMenuComponent, selector: "ax-context-menu", inputs: ["orientation", "openOn", "closeOn", "items", "target"], outputs: ["onItemClick", "onOpening", "onClose"] }, { kind: "ngmodule", type: AXButtonModule }, { kind: "component", type: i1.AXButtonComponent, selector: "ax-button", inputs: ["disabled", "size", "tabIndex", "color", "look", "text", "toggleable", "selected", "iconOnly", "type", "loadingText"], outputs: ["onBlur", "onFocus", "onClick", "selectedChange", "toggleableChange", "lookChange", "colorChange", "disabledChange", "loadingTextChange"] }, { kind: "ngmodule", type: AXDropdownButtonModule }, { kind: "ngmodule", type: AXTranslationModule }, { kind: "directive", type: i3.AXTranslatorDirective, selector: "[translate]" }, { kind: "ngmodule", type: AXDecoratorModule }, { kind: "component", type: i2.AXDecoratorIconComponent, selector: "ax-icon", inputs: ["icon"] }, { kind: "component", type: i2.AXDecoratorClearButtonComponent, selector: "ax-clear-button", inputs: ["icon"] }, { kind: "directive", type: AXPanViewDirective, selector: "[axPanView]", inputs: ["zoomStep", "minZoom", "maxZoom", "freeMode", "fitContent", "disablePan", "disableZoom", "wrapperClasses", "panX", "panY", "zoom"], outputs: ["panXChange", "panYChange", "zoomChange", "positionChange"], exportAs: ["axPanView"] }, { kind: "ngmodule", type: AXLoadingModule }, { kind: "ngmodule", type: AXBreadcrumbsModule }, { kind: "ngmodule", type: AXBadgeModule }, { kind: "ngmodule", type: AXSearchBoxModule }, { kind: "component", type: i6.AXSearchBoxComponent, selector: "ax-search-box", inputs: ["disabled", "readonly", "tabIndex", "placeholder", "value", "state", "name", "id", "look", "class", "delayTime", "type", "autoSearch"], outputs: ["valueChange", "stateChange", "onValueChanged", "onBlur", "onFocus", "readonlyChange", "disabledChange", "onKeyDown", "onKeyUp", "onKeyPress"] }, { kind: "ngmodule", type: AXSwitchModule }, { kind: "component", type: i7.AXSwitchComponent, selector: "ax-switch", inputs: ["disabled", "readonly", "color", "tabIndex", "value", "name", "isLoading"], outputs: ["onBlur", "onFocus", "valueChange", "onValueChanged", "readonlyChange", "disabledChange"] }, { kind: "component", type: 
                 //
-                AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer-container,    axp-page-footer,    axp-page-header,    axp-page-header-container,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXMOrgChartDetailPanelComponent, selector: "axm-org-chart-detail-panel", inputs: ["node"], outputs: ["panelClose"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+                AXPThemeLayoutBlockComponent, selector: "    axp-page-content,     axp-page-footer-container,    axp-page-footer,    axp-page-header,    axp-page-header-container,    axp-page-toolbar,    axp-layout-content,     axp-layout-page-content,     axp-layout-sections,    axp-layout-body,    axp-layout-page-body,    axp-layout-prefix,    axp-layout-suffix,    axp-layout-title-bar,    axp-layout-title,     axp-layout-title-actions,     axp-layout-nav-button,     axp-layout-description,     axp-layout-breadcrumbs,    axp-layout-list-action,    " }, { kind: "component", type: AXPPageLayoutComponent, selector: "axp-page-layout" }, { kind: "component", type: AXPLayoutFloatingZoomBarComponent, selector: "axp-layout-floating-zoom-bar", inputs: ["zoomLevel"], outputs: ["zoomIn", "zoomOut", "zoomReset"] }, { kind: "component", type: AXPLayoutSideDetailPanelComponent, selector: "axp-layout-side-detail-panel", inputs: ["multiSelectLabel", "header", "sections", "rows", "rowsSectionTitle", "noRowsMessage", "emptyState"], outputs: ["panelClose"] }, { kind: "pipe", type: i3$1.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.AXTranslatorPipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImport: i0, type: AXMOrgChartPage, decorators: [{
             type: Component,
@@ -1789,7 +1909,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                         //
                         AXPThemeLayoutBlockComponent,
                         AXPPageLayoutComponent,
-                        AXMOrgChartDetailPanelComponent,
+                        AXPLayoutFloatingZoomBarComponent,
+                        AXPLayoutSideDetailPanelComponent,
                     ], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, providers: [
                         AXMOrgChartService,
                         AXMOrgChartNodeContributionService,
@@ -1798,8 +1919,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.9", ngImpor
                             useExisting: AXMOrgChartPage,
                         },
                         { provide: AXM_ORG_CHART_HOST, useExisting: AXMOrgChartPage },
-                    ], template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <ax-search-box\n          class=\"w-72\"\n          [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\"\n          [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"flex items-center gap-2 shrink-0 whitespace-nowrap\">\n          <span class=\"text-sm\"\n            >{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate | async }}</span\n          >\n          <ax-switch\n            [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"\n          ></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"overflow-hidden flex flex-col\">\n    <div class=\"flex flex-row gap-4 flex-1 min-h-0 overflow-hidden\" #parent id=\"parent\">\n      <div class=\"flex-1 min-w-0 min-h-0 overflow-hidden relative ax-light\">\n        <div\n          #chart\n          axPanView\n          [(panX)]=\"panX\"\n          [(panY)]=\"panY\"\n          [freeMode]=\"true\"\n          [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\"\n          wrapperClasses=\"h\"\n          class=\"ax-light\"\n          (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\"\n        ></div>\n        <div class=\"axm-org-chart-page__floating-zoom\">\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomOut()\">\n            <ax-icon class=\"fa-solid fa-minus\"></ax-icon>\n          </ax-button>\n          <ax-button\n            look=\"blank\"\n            class=\"ax-sm __zoom-value\"\n            [text]=\"zoomPercentageLabel()\"\n            (onClick)=\"zoomReset()\"\n          ></ax-button>\n          <ax-button look=\"blank\" class=\"ax-sm __zoom-button\" (onClick)=\"zoomIn()\">\n            <ax-icon class=\"fa-solid fa-plus\"></ax-icon>\n          </ax-button>\n        </div>\n        <ax-context-menu\n          [orientation]=\"'vertical'\"\n          [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\"\n        >\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axm-org-chart-detail-panel\n        class=\"sticky top-0 z-10 max-h-full flex-none\"\n        [node]=\"detailPanelSelectedNode()\"\n        (panelClose)=\"toggleDetailPanel()\"\n      />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["@layer properties;foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer;--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container.--selected .--container{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;right:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * -3);left:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:calc(var(--spacing, .25rem) * 0)}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:var(--radius-2xl, 1rem);--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, rgb(var(--node-bg-color)) 0%, rgb(var(--node-bg-color)) 55%, rgb(var(--node-bg-color)) 100% );--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100% )}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500));--oc-ring-3: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,rgb(var(--node-bg-color)) 0% 50%,rgb(var(--node-bg-color)))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:calc(var(--spacing, .25rem) * 12);height:calc(var(--spacing, .25rem) * 12);flex:none;align-items:center;justify-content:center;border-radius:var(--radius-xl, .75rem);color:rgb(var(--node-bg-color));background-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:90%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:85%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-style:var(--tw-border-style);border-width:0px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);text-transform:uppercase;color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-block:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;min-height:calc(var(--spacing, .25rem) * 14)}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){--tw-divide-x-reverse: 0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px * var(--tw-divide-x-reverse));border-inline-end-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){border-color:rgba(var(--ax-sys-color-lightest-surface))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *)>:not(:last-child)){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:95%;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:none;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:75%;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}.axm-org-chart-page__floating-zoom{position:absolute;bottom:calc(var(--spacing, .25rem) * 4);z-index:20;display:flex;align-items:center;gap:calc(var(--spacing, .25rem) * 1);border-radius:var(--radius-2xl, 1rem);padding:calc(var(--spacing, .25rem) * 1.5);border-style:var(--tw-border-style);border-width:1px;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);inset-inline-end:1rem;backdrop-filter:blur(10px);box-shadow:0 8px 20px -12px #0000003d,0 2px 8px #00000014,inset 0 1px #ffffffbf}.axm-org-chart-page__floating-zoom .__zoom-button{border-radius:var(--radius-xl, .75rem);color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axm-org-chart-page__floating-zoom .__zoom-button:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}.axm-org-chart-page__floating-zoom .__zoom-value{min-width:calc(var(--spacing, .25rem) * 16);border-radius:var(--radius-xl, .75rem);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:rgb(var(--ax-sys-color-primary-500))}@supports (color: color-mix(in lab,red,red)){.axm-org-chart-page__floating-zoom .__zoom-value:hover{background-color:color-mix(in srgb,rgb(var(--ax-sys-color-primary-500)) 10%,white)}}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-divide-x-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-tracking: initial;--tw-divide-x-reverse: 0}}}\n/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n"] }]
+                    ], template: "<axp-page-layout *translate=\"let t\">\n  <axp-page-toolbar>\n    <axp-layout-prefix>\n      <div class=\"flex flex-wrap items-center gap-3\">\n        <ax-search-box\n          class=\"w-72\"\n          [(ngModel)]=\"chartSearchQuery\"\n          (onValueChanged)=\"onChartSearchValueChanged($event)\"\n          [placeholder]=\"\n            ('@organization-management:organization-chart.components.chart.search-placeholder' | translate | async) || ''\n          \"\n        >\n          <ax-clear-button></ax-clear-button>\n        </ax-search-box>\n        @if (chartService.selectedMode() !== 'reporting') {\n        <div class=\"flex items-center gap-2 flex-shrink-0 whitespace-nowrap\">\n          <span class=\"text-sm\"\n            >{{\n            '@organization-management:organization-chart.components.generate-dialog.fields.show-vacant-leaf-seats.label'\n            | translate | async }}</span\n          >\n          <ax-switch\n            [ngModel]=\"chartService.showVacantLeafSeats()\"\n            (onValueChanged)=\"onVacantLeafSeatsChange($event)\"\n          ></ax-switch>\n        </div>\n        }\n      </div>\n    </axp-layout-prefix>\n    <axp-layout-suffix>\n      @if (deviceService.isLarge()) {\n      <ax-button (onClick)=\"toggleDetailPanel()\">\n        <ax-icon icon=\"{{ isDetailPanelOpen() ? 'fa-solid fa-square-info' : 'fa-light fa-square-info' }}\"></ax-icon>\n      </ax-button>\n      }\n    </axp-layout-suffix>\n  </axp-page-toolbar>\n  <axp-page-content class=\"overflow-hidden flex flex-col\">\n    <div class=\"flex flex-row gap-4 flex-1 min-h-0 overflow-hidden\" #parent id=\"parent\">\n      <div class=\"flex-1 min-w-0 min-h-0 overflow-hidden relative ax-light\">\n        <div\n          #chart\n          axPanView\n          [(panX)]=\"panX\"\n          [(panY)]=\"panY\"\n          [freeMode]=\"true\"\n          [(zoom)]=\"panZoomLevel\"\n          [fitContent]=\"true\"\n          wrapperClasses=\"h\"\n          class=\"ax-light\"\n          (contextmenu)=\"onOrgChartSurfaceContextMenu($event)\"\n        ></div>\n        <axp-layout-floating-zoom-bar\n          [zoomLevel]=\"panZoomLevel()\"\n          (zoomIn)=\"zoomIn()\"\n          (zoomOut)=\"zoomOut()\"\n          (zoomReset)=\"zoomReset()\"\n        />\n        <ax-context-menu\n          [orientation]=\"'vertical'\"\n          [closeOn]=\"'leave'\"\n          (onItemClick)=\"handleContextMenuItemClick($event)\"\n        >\n        </ax-context-menu>\n      </div>\n      @if (isDetailPanelOpen() && deviceService.isLarge()) {\n      <axp-layout-side-detail-panel\n        class=\"sticky top-0 z-10 max-h-full flex-none\"\n        [header]=\"detailPanelHeader()\"\n        [sections]=\"detailPanelSections()\"\n        [emptyState]=\"detailPanelEmptyState()\"\n        [noRowsMessage]=\"detailPanelNoRowsMessage()\"\n        (panelClose)=\"toggleDetailPanel()\"\n      />\n      }\n    </div>\n  </axp-page-content>\n</axp-page-layout>\n", styles: ["@layer properties;foreignObject.axp-chart-node{overflow:visible}.axp-chart-links path.link{pointer-events:none}.axp-chart-node{display:flex;align-items:center;justify-content:center}.axp-chart-node .--node-container{position:relative;cursor:pointer;--node-bg-color: var(--ax-sys-color-primary-surface);--node-text-color: var(--ax-sys-color-on-primary-surface);--node-border-color: var(--ax-sys-color-border-primary-surface)}.axp-chart-node .--node-container.--merged-card{box-sizing:border-box;width:100%;max-width:100%}.axp-chart-node .--node-container.--selected .--container{border-style:var(--tw-border-style);border-width:2px;--tw-border-style: dashed;border-style:dashed;--tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 4px 6px -4px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.--search-hit .--container{box-shadow:0 0 0 2px rgb(var(--ax-sys-color-warning-500)),0 0 12px color-mix(in srgb,rgb(var(--ax-sys-color-warning-500)) 35%,transparent)}}.axp-chart-node .--node-container .--container{display:flex;max-height:100%;width:100%;flex-direction:column;overflow:hidden;border-radius:var(--radius-md, .375rem);border-style:var(--tw-border-style);border-width:1px;--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / .1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / .1));box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);border-color:rgba(var(--node-border-color))}.axp-chart-node .--node-container .--toggle{position:absolute;right:calc(var(--spacing, .25rem) * 0);bottom:calc(var(--spacing, .25rem) * -3);left:calc(var(--spacing, .25rem) * 0);display:flex;width:100%;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none}.axp-chart-node .--node-container.--merged-card .--container{width:100%;min-width:calc(var(--spacing, .25rem) * 0)}.axp-chart-node .--node-container.axm-org-chart-card{border-radius:var(--radius-2xl, 1rem);--oc-body-mix: 18%;--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, rgb(var(--node-bg-color)) 0%, rgb(var(--node-bg-color)) 55%, rgb(var(--node-bg-color)) 100% );--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: transparent;--oc-ring-3: transparent;border:1px solid rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000008,0 4px 12px #0000000d,0 14px 28px -16px #0000000f,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3),inset 0 1px #fffc}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--axm-org-chart-card-body-bg: radial-gradient( ellipse 130% 75% at 105% -5%, color-mix(in srgb, rgb(var(--node-bg-color)) var(--oc-body-mix), rgb(var(--ax-sys-color-lightest-surface))) 0%, color-mix(in srgb, rgb(var(--node-bg-color)) 6%, rgb(var(--ax-sys-color-lightest-surface))) 55%, color-mix(in srgb, rgb(var(--node-bg-color)) 2%, rgb(var(--ax-sys-color-lightest-surface))) 100% )}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 5%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card{border:1px solid color-mix(in srgb,rgb(var(--node-bg-color)) 12%,transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-width:2px;border-style:dashed;border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 50%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:rgb(var(--node-bg-color));box-shadow:0 1px 2px #00000038,0 6px 18px #00000042,0 16px 36px -18px #0000004d,0 0 18px var(--oc-ring-1),0 0 10px var(--oc-ring-2),0 0 14px var(--oc-ring-3)}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card){border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 22%,rgb(var(--ax-sys-color-border-primary-surface)))}}.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.dark :is(.axp-chart-node .--node-container.axm-org-chart-card).axm-org-chart-card--vacant{border-color:color-mix(in srgb,rgb(var(--node-bg-color)) 58%,rgb(var(--ax-sys-color-border-primary-surface)))}}.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: rgb(var(--node-bg-color));--oc-ring-2: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-1: color-mix(in srgb, rgb(var(--node-bg-color)) 32%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected:not(.--search-hit){--oc-ring-2: color-mix(in srgb, rgb(var(--node-bg-color)) 22%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 30%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--search-hit:not(.--selected){--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 20%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: rgb(var(--ax-sys-color-warning-500));--oc-ring-2: rgb(var(--ax-sys-color-warning-500));--oc-ring-3: rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-1: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 28%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-2: color-mix(in srgb, rgb(var(--ax-sys-color-warning-500)) 18%, transparent)}}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card.--selected.--search-hit{--oc-ring-3: color-mix(in srgb, rgb(var(--node-bg-color)) 24%, transparent)}}.axp-chart-node .--node-container.axm-org-chart-card .--container{overflow:hidden;border-radius:var(--radius-2xl, 1rem);border-style:var(--tw-border-style);border-width:0px;border-style:none;box-shadow:none}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{width:100%;flex:none;height:6px;border-top-left-radius:inherit;border-top-right-radius:inherit;border-bottom-left-radius:1.5rem;border-bottom-right-radius:0;background:linear-gradient(90deg,rgb(var(--node-bg-color)) 0% 50%,rgb(var(--node-bg-color)))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__accent{background:linear-gradient(90deg,color-mix(in srgb,rgb(var(--node-bg-color)) 70%,white),rgb(var(--node-bg-color)),color-mix(in srgb,rgb(var(--node-bg-color)) 88%,black))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body{position:relative;display:flex;width:100%;min-width:calc(var(--spacing, .25rem) * 0);flex-direction:column;overflow:hidden;background-color:var(--color-lightest);color:var(--color-on-lightest);border-color:var(--color-border-lightest);background-color:rgb(var(--ax-sys-color-lightest-surface));background-image:var(--axm-org-chart-card-body-bg, none)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__body:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card.axm-org-chart-card--employee .axm-org-chart-card__header--person .axm-org-chart-card__person-name{font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--org{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:flex-start;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__header--person{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{display:flex;width:calc(var(--spacing, .25rem) * 12);height:calc(var(--spacing, .25rem) * 12);flex:none;align-items:center;justify-content:center;border-radius:var(--radius-xl, .75rem);color:rgb(var(--node-bg-color));background-color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__leading-icon{background-color:color-mix(in srgb,rgb(var(--node-bg-color)) 16%,white)}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title-block{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-base, 1rem);line-height:var(--tw-leading, var(--text-base--line-height, 1.5 ));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__subtitle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:90%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__desc{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);opacity:85%;color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person{border-style:var(--tw-border-style);border-width:0px;padding-inline:calc(var(--spacing, .25rem) * 4);padding-top:calc(var(--spacing, .25rem) * 2);padding-bottom:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-label{margin-bottom:calc(var(--spacing, .25rem) * 2);font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-row{display:flex;min-width:calc(var(--spacing, .25rem) * 0);align-items:center;gap:calc(var(--spacing, .25rem) * 4)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-text{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:1;flex-direction:column;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);--tw-font-weight: var(--font-weight-bold, 700);font-weight:var(--font-weight-bold, 700);color:rgba(var(--ax-sys-color-on-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-role{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-leading: var(--leading-snug, 1.375);line-height:var(--leading-snug, 1.375);color:rgba(var(--ax-sys-color-on-surface-variant))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--text-xs, .75rem);line-height:var(--tw-leading, var(--text-xs--line-height, calc(1 / .75)));--tw-font-weight: var(--font-weight-medium, 500);font-weight:var(--font-weight-medium, 500);--tw-tracking: var(--tracking-wide, .025em);letter-spacing:var(--tracking-wide, .025em);text-transform:uppercase;color:rgb(var(--node-bg-color))}@supports (color: color-mix(in lab,red,red)){.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__person-vacant{color:color-mix(in srgb,rgb(var(--node-bg-color)) 72%,rgb(var(--ax-sys-color-on-surface-variant)))}}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer{display:flex;flex-direction:row;justify-content:center;padding-block:calc(var(--spacing, .25rem) * 4);border-top-style:var(--tw-border-style);border-top-width:1px;min-height:calc(var(--spacing, .25rem) * 14)}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){--tw-divide-x-reverse: 0;border-inline-style:var(--tw-border-style);border-inline-start-width:calc(1px * var(--tw-divide-x-reverse));border-inline-end-width:calc(1px * calc(1 - var(--tw-divide-x-reverse)))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer>:not(:last-child)){border-color:rgba(var(--ax-sys-color-lightest-surface))}:where(.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *)>:not(:last-child)){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){background-color:var(--color-lighter);color:var(--color-on-lighter);border-color:var(--color-border-lighter)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__footer:where(.ax-dark,.ax-dark *){border-color:rgba(var(--ax-sys-color-darkest-surface))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric{display:flex;flex:1;align-items:center;justify-content:center;gap:calc(var(--spacing, .25rem) * 2);padding-inline:calc(var(--spacing, .25rem) * 4);padding-block:calc(var(--spacing, .25rem) * 2)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-icon{flex:none;font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));opacity:95%;color:rgb(var(--node-bg-color))}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-col{display:flex;min-width:calc(var(--spacing, .25rem) * 0);flex:none;flex-direction:column;align-items:center;gap:calc(var(--spacing, .25rem) * .5)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-value{font-size:var(--text-sm, .875rem);line-height:var(--tw-leading, var(--text-sm--line-height, calc(1.25 / .875)));--tw-leading: 1;line-height:1;--tw-font-weight: var(--font-weight-semibold, 600);font-weight:var(--font-weight-semibold, 600)}.axp-chart-node .--node-container.axm-org-chart-card .axm-org-chart-card__metric-title{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px;--tw-leading: var(--leading-tight, 1.25);line-height:var(--leading-tight, 1.25);opacity:75%;color:rgba(var(--ax-sys-color-on-surface-variant))}#parent:fullscreen{background-color:rgba(var(--ax-sys-color-primary-lightest-surface))}@property --tw-border-style{syntax: \"*\"; inherits: false; initial-value: solid;}@property --tw-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-inset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-shadow-color{syntax: \"*\"; inherits: false;}@property --tw-inset-shadow-alpha{syntax: \"<percentage>\"; inherits: false; initial-value: 100%;}@property --tw-ring-color{syntax: \"*\"; inherits: false;}@property --tw-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-inset-ring-color{syntax: \"*\"; inherits: false;}@property --tw-inset-ring-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-ring-inset{syntax: \"*\"; inherits: false;}@property --tw-ring-offset-width{syntax: \"<length>\"; inherits: false; initial-value: 0px;}@property --tw-ring-offset-color{syntax: \"*\"; inherits: false; initial-value: #fff;}@property --tw-ring-offset-shadow{syntax: \"*\"; inherits: false; initial-value: 0 0 #0000;}@property --tw-font-weight{syntax: \"*\"; inherits: false;}@property --tw-leading{syntax: \"*\"; inherits: false;}@property --tw-tracking{syntax: \"*\"; inherits: false;}@property --tw-divide-x-reverse{syntax: \"*\"; inherits: false; initial-value: 0;}@layer properties{@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-border-style: solid;--tw-shadow: 0 0 #0000;--tw-shadow-color: initial;--tw-shadow-alpha: 100%;--tw-inset-shadow: 0 0 #0000;--tw-inset-shadow-color: initial;--tw-inset-shadow-alpha: 100%;--tw-ring-color: initial;--tw-ring-shadow: 0 0 #0000;--tw-inset-ring-color: initial;--tw-inset-ring-shadow: 0 0 #0000;--tw-ring-inset: initial;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-offset-shadow: 0 0 #0000;--tw-font-weight: initial;--tw-leading: initial;--tw-tracking: initial;--tw-divide-x-reverse: 0}}}\n/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */\n"] }]
         }], ctorParameters: () => [], propDecorators: { treeContainer: [{ type: i0.ViewChild, args: ['chart', { isSignal: true }] }], parent: [{ type: i0.ViewChild, args: ['parent', { isSignal: true }] }], contextMenu: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXContextMenuComponent), { isSignal: true }] }], panView: [{ type: i0.ViewChild, args: [i0.forwardRef(() => AXPanViewDirective), { isSignal: true }] }] } });
 
 export { AXMOrgChartPage };
-//# sourceMappingURL=acorex-modules-organization-management-org-chart.page-Cs-wTPS-.mjs.map
+//# sourceMappingURL=acorex-modules-organization-management-org-chart.page-CtXZUL1l.mjs.map