/* Data-entry grid cells, including the read-only and unlinked-owner states. */

/* A layer cell a reader can't change: same value, none of the affordances. */
.pickerCellReadonly{ cursor:default; color:inherit; text-decoration:none; }
.pickerCellReadonly:hover{ background:transparent; }
/* Shown when a layer cell is empty, so the cell stays clickable. */
.pickerCellEmpty{ opacity:.5; font-style:italic; }

.choicePickerItem{ cursor:pointer; }
.choicePickerSub{ font-size:11px; color:var(--muted); }
/* Legacy free-text owner/steward that isn't linked to an employee yet. */
.pickerCellUnlinked{ font-style:italic; }
.pickerCellUnlinked::after{ content:" ⚠"; opacity:.7; }
/* Department filled in from the linked employee: read-only by definition. */
.derivedCell{ color:var(--muted); cursor:default; }
.choicePickerItemActive{
  background:var(--primary-soft);
  font-weight:600;
}
.choicePickerEmpty{
  padding:8px 6px;
  font-size:12.5px;
  color:var(--muted);
  font-style:italic;
}
#choicePickerAdd{
  margin:0 8px 8px;
  width:calc(100% - 16px);
}

.parentPicker{
  position:fixed;
  z-index:50;
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-lg);
  width:300px;
  max-height:320px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.parentPicker input[type="text"]{
  margin:8px;
  width:calc(100% - 16px);
  box-sizing:border-box;
  font-weight:400;
}
/* flex:1 + overflow:auto keeps the list scrolling inside the panel so anything
   below it (the create button) stays pinned and visible. */
.parentPickerList,
.choicePickerList{
  overflow:auto;
  padding:0 8px 8px;
  flex:1;
  min-height:0;
}
.parentPickerItem{
  display:flex;
  gap:6px;
  align-items:center;
  padding:6px;
  font-size:12.5px;
  font-weight:400;
  border-radius:6px;
}
.parentPickerItem:hover{ background:var(--primary-soft); }

.nodeCard{
  rx:14;
  ry:14;
  /* Without an explicit fill the SVG default (black) applies — this is what
     rendered every node as a black box after the merge. */
  fill:var(--surface);
  stroke:var(--border);
  stroke-width:1.2;
}
/* stands in for the old drop-shadow filter, which was costly to pan and zoom */
.lnode rect.nodeShadow{ rx:14; ry:14; fill:rgba(17,75,95,0.07); stroke:none; }
.nodeAccent{ rx:2.5; ry:2.5; stroke:none; }
.nodeActive rect.nodeCard{ stroke:var(--primary); stroke-width:2.6; }
.nodeSelected rect.nodeCard{ stroke:var(--teal); stroke-width:2.6; }

.labelMain{ font-weight:700; font-size:13px; }
.labelSub{ font-size:11px; fill:var(--muted); }
.badge{ font-size:10px; font-weight:800; fill:var(--text); }

.edge{
  stroke:#94a3b8;
  stroke-width:1.5;
  fill:none;
  opacity:0.9;
}