/* Shared integration layer: the component deliberately reuses the original
 * organization-tree DOM vocabulary. Visual dimensions, indentation, type
 * icons and light/dark states remain owned by the existing page styles. */
.org-tree-component,
.org-tree-component * {
  box-sizing: border-box;
}

.org-tree-component {
  width: 100%;
  color: inherit;
  font: inherit;
}

.org-tree-component .org-tree-list,
.org-tree-component .org-tree-group,
.org-tree-component .org-tree-child-list {
  width: 100%;
}

.org-tree-component .org-tree-group {
  display: block;
}

.org-tree-component .org-tree-child-list {
  display: block;
  margin: 0;
  padding: 0;
}

.org-tree-component .org-tree-node {
  font: inherit;
}

.org-tree-component .org-tree-status {
  width: 100%;
  min-height: 48px;
  padding: 10px 12px;
  color: inherit;
  text-align: center;
}

/* There is intentionally no connector or card treatment here. The host's
 * original tree rules provide the exact presentation used across modules. */
.org-tree-component .org-tree-connector {
  display: none;
}

/* Inventory Management's crown is the canonical agent/headquarters mark.
 * Keep the wrapper at the same compact 24px size and top alignment on every
 * organization tree, while leaving all other node types untouched. */
.organization-tree-page .org-node-icon:is(.headquarters, .agent),
.customer-org-tree .org-node-icon:is(.headquarters, .agent),
.history-store-org .history-org-icon.org-node-icon:is(.headquarters, .agent),
.store-org-tree .org-node-icon:is(.headquarters, .agent),
.device-org-icon:is(.headquarters, .agent),
.inventory-org-icon:is(.headquarters, .agent) {
  width: 24px !important;
  height: 24px !important;
  align-self: flex-start !important;
  margin-top: -2px !important;
  background: transparent url("../assets/icons/organization-headquarters.svg?v=1") center/contain no-repeat !important;
  color: #2c2c2c !important;
  font-size: 0 !important;
  -webkit-mask: none !important;
  mask: none !important;
}
.organization-tree-page .org-node-icon:is(.headquarters, .agent):before,
.organization-tree-page .org-node-icon:is(.headquarters, .agent):after,
.customer-org-tree .org-node-icon:is(.headquarters, .agent):before,
.customer-org-tree .org-node-icon:is(.headquarters, .agent):after,
.history-store-org .history-org-icon.org-node-icon:is(.headquarters, .agent):before,
.history-store-org .history-org-icon.org-node-icon:is(.headquarters, .agent):after,
.store-org-tree .org-node-icon:is(.headquarters, .agent):before,
.store-org-tree .org-node-icon:is(.headquarters, .agent):after,
.device-org-icon:is(.headquarters, .agent):before,
.device-org-icon:is(.headquarters, .agent):after,
.inventory-org-icon:is(.headquarters, .agent):before,
.inventory-org-icon:is(.headquarters, .agent):after {
  content: none !important;
  display: none !important;
}