/* Arbre entreprise — connecteurs organigramme en pseudo-éléments.
   Aucune couleur en dur : tokens uniquement. */

#company-tree-overlay {
  position: fixed;
  inset: 0;
  z-index: 1100; /* au-dessus de fiche-modal (1000) */
  display: none;
  flex-direction: column;
  background: color-mix(in oklch, var(--ink, #1a1a1a) 45%, transparent);
}
#company-tree-overlay.open { display: flex; }

.tree-panel {
  margin: 2vh auto;
  width: 94%;
  height: 94vh;
  display: flex;
  flex-direction: column;
  background: var(--surface, #fff);
  border-radius: var(--radius-lg, 10px);
  box-shadow: var(--shadow-feuillet, 0 10px 40px rgba(0, 0, 0, .25));
  overflow: hidden;
}

.tree-toolbar {
  display: flex;
  align-items: center;
  gap: var(--sp-sm, .5rem);
  padding: var(--sp-sm, .5rem) var(--sp-md, 1rem);
  border-bottom: 1px solid var(--line, #ddd);
}
.tree-toolbar h3 {
  margin: 0;
  flex: 1;
  font-family: var(--font-display, serif);
}

.tree-viewport {
  flex: 1;
  overflow: auto; /* pan = scroll natif */
  padding: var(--sp-lg, 1.5rem);
}
.tree-scale {
  transform-origin: top left;
  width: max-content;
  margin: 0 auto;
}

/* Connecteurs généalogiques classiques (ul/li imbriqués). */
.tree ul {
  display: flex;
  justify-content: center;
  padding: 1.25rem 0 0;
  margin: 0;
  position: relative;
}
.tree li {
  list-style: none;
  text-align: center;
  position: relative;
  padding: 1.25rem .4rem 0;
}
.tree li::before,
.tree li::after {
  content: "";
  position: absolute;
  top: 0;
  right: 50%;
  width: 50%;
  height: 1.25rem;
  border-top: 1px solid var(--line, #ccc);
}
.tree li::after {
  right: auto;
  left: 50%;
  border-left: 1px solid var(--line, #ccc);
}
.tree li:only-child::before,
.tree li:only-child::after { display: none; }
.tree li:only-child { padding-top: 0; }
.tree li:first-child::before,
.tree li:last-child::after { border: 0 none; }
.tree li:last-child::before {
  border-right: 1px solid var(--line, #ccc);
  border-radius: 0 4px 0 0;
}
.tree li:first-child::after { border-radius: 4px 0 0 0; }
.tree ul ul::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 0;
  height: 1.25rem;
  border-left: 1px solid var(--line, #ccc);
}

.tree-node {
  display: inline-block;
  padding: .35rem .7rem;
  border: 1px solid var(--line, #ccc);
  border-radius: var(--radius-lg, 6px);
  background: var(--surface, #fff);
  font-size: .85em;
}
.tree-node--root {
  font-family: var(--font-display, serif);
  font-size: 1.05em;
  border-color: var(--gold-deep, #b8860b);
}
.tree-node--group {
  background: var(--card-hover, #f6f2ea);
  font-weight: 600;
}
.tree-card {
  cursor: pointer;
  text-align: left;
  max-width: 15rem;
}
.tree-card:hover { border-color: var(--gold-deep, #b8860b); }
.tree-card .tree-card-name { font-weight: 600; }
.tree-card .tree-card-poste {
  font-size: .8em;
  color: var(--ink-mute, #777);
}
.tree-badges { margin-top: .15rem; }

.tree-empty {
  padding: var(--sp-lg, 1.5rem);
  text-align: center;
  color: var(--ink-mute, #777);
}

/* Case vide : équipe du catalogue jamais scrapée (à couvrir). */
.tree-node--empty {
  border-style: dashed;
  color: var(--ink-mute, #777);
  background: transparent;
  cursor: pointer;
}
.tree-node--empty:hover,
.tree-team:hover { border-color: var(--gold-deep, #b8860b); }

/* Nœud équipe = bouton : neutraliser le style natif. */
.tree-team {
  font: inherit;
  font-size: .85em;
  cursor: pointer;
}

/* Popup nœud équipe (« Chercher ») et panneau « Regrouper ». */
.tree-modal {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: none;
  align-items: center;
  justify-content: center;
  background: color-mix(in oklch, var(--ink, #1a1a1a) 45%, transparent);
}
.tree-modal-box {
  background: var(--surface, #fff);
  border-radius: var(--radius-lg, 10px);
  padding: var(--sp-md, 1rem);
  width: 92%;
  max-width: 26rem;
  max-height: 80vh;
  overflow: auto;
}
.tree-modal-box label {
  display: block;
  margin: var(--sp-sm, .5rem) 0;
  font-size: .85em;
}
.tree-modal-box select,
.tree-modal-box input { width: 100%; }
.tree-modal-head { display: flex; align-items: center; gap: var(--sp-sm, .5rem); }
.tree-modal-head h3 { margin: 0; flex: 1; font-family: var(--font-display, serif); }
.tree-modal-x { border: none; background: none; font-size: 1.2em; cursor: pointer; }
.tree-modal-actions {
  display: flex;
  gap: var(--sp-sm, .5rem);
  margin-top: var(--sp-sm, .5rem);
  flex-wrap: wrap;
}
.tree-node--busy { border-color: var(--gold-deep, #b8860b); font-style: italic; }

/* Liste des variantes / candidats dans le panneau « Regrouper ». */
.tree-variants { list-style: none; padding: 0; margin: var(--sp-sm, .5rem) 0; }
.tree-variants li {
  display: flex;
  align-items: center;
  gap: var(--sp-sm, .5rem);
  justify-content: space-between;
  font-size: .85em;
  padding: .15rem 0;
}