/* ════════════════════════════════════════════════════════════════════════════
   OBJEKTWECHSLER (Hybridnavigation) — Command-Palette + Vollbaum-Overlay
   ────────────────────────────────────────────────────────────────────────────
   Namespace .onv-*  ·  ausschließlich Design-Tokens (Victor CI / design-system)
   Verhalten: public/object-navigator.js  ·  Doku: docs/OBJECT_NAVIGATOR.md
   Lädt VOR css/design-system.css (Kaskadenregel der Victor-CI-Schicht).

   GRUNDREGEL: KEIN Element dieser Datei beeinflusst den Fluss des Arbeitsbereichs.
   Alles Überlagernde ist position:fixed → beim Öffnen entsteht KEIN Layout-Sprung.
   z-index-Lage: unter den App-Dialogen (.modal-overlay 100 / .ds-modal 1001 /
   viConfirm 12000), über Topbar (60) und Sidebar.
   ════════════════════════════════════════════════════════════════════════════ */

/* ── Objektwechsler (Popover / zentriertes Overlay) ───────────────────────── */
#onv-switcher-host { display: none; }
body.onv-sw-open #onv-switcher-host { display: block; }

.onv-sw-backdrop {
  position: fixed;
  inset: 0;
  z-index: 70;
  background: rgba(26, 32, 28, 0.28);   /* dezenter Backdrop — Arbeitsbereich bleibt sichtbar */
}
/* Drawer: von links, über dem Arbeitsbereich. Verschiebt NICHTS (position:fixed). */
.onv-sw {
  position: fixed;
  z-index: 71;
  left: 0; top: 0; bottom: 0;
  width: min(460px, calc(100vw - 24px));
  display: flex;
  flex-direction: column;
  background: var(--color-surface, var(--white));
  border-right: 1px solid var(--gray-300, var(--border));
  box-shadow: var(--shadow-md);
  overflow: hidden;
  transform: none;                 /* Basiszustand — Drawer sitzt exakt an der linken Kante */
  animation: onvSwIn 140ms ease-out;
}
@keyframes onvSwIn { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .onv-sw { animation: none; } }

/* Tablet: breiter Drawer (70–85 %) */
@media (max-width: 1023px) { .onv-sw { width: min(78vw, 520px); } }

/* Titelzeile: nur Titel + Weitere Aktionen + Schließen */
.onv-sw-title-row {
  display: flex;
  align-items: center;
  gap: var(--space-1, 4px);
  padding: var(--space-3, 12px) var(--space-3, 12px) var(--space-2, 8px);
}
.onv-sw-title {
  flex: 1;
  font-size: var(--text-base, 16px);
  font-weight: var(--fw-semibold, 600);
  color: var(--color-forest, var(--gray-900));
}
.onv-iconbtn {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 30px; height: 30px;
  border: none; border-radius: var(--radius-sm, 6px);
  background: transparent;
  color: var(--gray-700);
  cursor: pointer;
  flex-shrink: 0;
}
.onv-iconbtn:hover { background: var(--gray-100); color: var(--color-forest); }
.onv-iconbtn:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.onv-sw-busy {
  display: inline-block; width: 10px; height: 10px; margin-left: 6px;
  border: 2px solid var(--gray-300); border-top-color: var(--color-sage);
  border-radius: 50%; animation: onvSpin .7s linear infinite; vertical-align: -1px;
}
@keyframes onvSpin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .onv-sw-busy { animation: none; } }
.onv-sw-cur { color: var(--color-sage); font-size: 10px; flex-shrink: 0; }
.onv-sw-row.is-current .onv-sw-name { font-weight: var(--fw-semibold, 600); }
.onv-sw-hint-fav { text-align: left; padding-top: 2px; font-size: var(--text-xs, 12px); }

/* Kopf mit Suchfeld */
.onv-sw-head {
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  padding: var(--space-3, 12px);
  border-bottom: 1px solid var(--gray-100);
}
.onv-sw-searchic { display: inline-flex; color: var(--gray-500); flex-shrink: 0; }
.onv-sw-input {
  flex: 1;
  min-width: 0;
  border: none;
  outline: none;
  background: transparent;
  font-family: var(--font-body);
  font-size: var(--text-base, 16px);
  color: var(--gray-900);
}
.onv-sw-input::placeholder { color: var(--gray-500); }
.onv-sw-kbd, .onv-sw-foot kbd, .onv-sb-kbd {
  display: inline-flex;
  align-items: center;
  padding: 1px 5px;
  border: 1px solid var(--gray-300);
  border-radius: var(--radius-sm, 6px);
  background: var(--color-cream, var(--gray-100));
  color: var(--gray-700);
  font-family: var(--font-body);
  font-size: var(--text-xxs);
  line-height: 1.5;
}

/* Trefferliste */
.onv-sw-list { flex: 1; overflow-y: auto; padding: var(--space-1, 4px) 0 var(--space-2, 8px); }
.onv-sw-group {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: var(--space-2, 8px) var(--space-3, 12px) 3px;
  font-size: var(--text-xs, 12px);
  font-weight: var(--fw-semibold, 600);
  color: var(--gray-500);
  letter-spacing: .02em;
}
/* Ein-/ausklappbarer Abschnittskopf (Favoriten): sieht aus wie ein Gruppenkopf,
   verhält sich wie eine Schaltfläche — der Baum darunter bleibt der Hauptweg. */
.onv-sw-fold {
  width: 100%;
  border: none;
  background: transparent;
  font-family: var(--font-body);
  /* Schaltflächen zentrieren ihren Inhalt von sich aus — der Abschnittskopf muss
     zeichengleich zu den übrigen Gruppenköpfen links stehen. */
  justify-content: flex-start;
  text-align: left;
  cursor: pointer;
}
.onv-sw-fold:hover { color: var(--gray-900); }
.onv-sw-fold:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: var(--radius-sm, 6px); }
.onv-fold-caret { display: inline-flex; color: var(--gray-500); }
.onv-fold-caret svg { display: block; transition: transform var(--transition, 150ms ease); }
.onv-fold-caret.is-open svg { transform: rotate(90deg); }
.onv-fold-l { flex: 0 0 auto; }
.onv-fold-n { font-weight: var(--fw-medium, 500); color: var(--gray-400, var(--gray-500)); }
@media (prefers-reduced-motion: reduce) { .onv-fold-caret svg { transition: none; } }

.onv-sw-row {
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  min-height: 40px;
  padding: 4px var(--space-3, 12px);
  cursor: pointer;
  color: var(--gray-900);
}
.onv-sw-row.is-active { background: var(--color-sage-soft); box-shadow: inset 2px 0 0 var(--brand-secondary, var(--color-sage)); }
.onv-sw-row:hover { background: var(--gray-100); }
.onv-sw-row.is-active:hover { background: var(--color-sage-soft); }
.onv-sw-ic { display: inline-flex; flex-shrink: 0; color: var(--gray-700); }
.onv-sw-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.onv-sw-name {
  font-size: var(--text-sm, 14px);
  font-weight: var(--fw-medium, 500);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.onv-sw-sub {
  font-size: var(--text-xs, 12px);
  color: var(--gray-500);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.onv-sw-action .onv-sw-name { font-weight: var(--fw-normal, 400); color: var(--color-sage); }
.onv-sw-fav {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 26px; height: 26px;
  border: none; border-radius: var(--radius-sm, 6px);
  background: transparent;
  color: var(--gray-300);
  cursor: pointer;
  flex-shrink: 0;
}
.onv-sw-row:hover .onv-sw-fav { color: var(--gray-500); }
.onv-sw-fav:hover { background: var(--gray-300); color: var(--color-gold-ink, var(--color-gold)); }
.onv-sw-fav.is-on { color: var(--color-gold, #C8A96E); }
.onv-sw-fav.is-on svg { fill: currentColor; }

.onv-sw-empty, .onv-sw-hint {
  padding: var(--space-4, 16px) var(--space-3, 12px);
  font-size: var(--text-sm, 14px);
  color: var(--gray-700);
  text-align: center;
}
.onv-sw-hint { color: var(--gray-500); }
.onv-sw-empty-actions { display: flex; gap: var(--space-2, 8px); justify-content: center; margin-top: var(--space-2, 8px); }

/* Skeleton (kein springendes Layout beim Suchen) */
.onv-sw-skel { padding: var(--space-2, 8px) var(--space-3, 12px); display: flex; flex-direction: column; gap: 10px; }
.onv-sw-skel span {
  display: block; height: 30px;
  border-radius: var(--radius-sm, 6px);
  background: linear-gradient(90deg, var(--gray-100) 25%, var(--color-cream, #F4F6F5) 50%, var(--gray-100) 75%);
  background-size: 200% 100%;
  animation: onvSkel 1.1s infinite linear;
}
@keyframes onvSkel { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .onv-sw-skel span { animation: none; } }

.onv-sw-foot {
  display: flex;
  gap: var(--space-3, 12px);
  padding: 6px var(--space-3, 12px);
  border-top: 1px solid var(--gray-100);
  background: var(--color-cream, var(--gray-100));
  font-size: var(--text-xs, 12px);
  color: var(--gray-500);
}
.onv-sw-foot span { display: inline-flex; align-items: center; gap: 3px; }

/* ── Umfangs-Auswahl (Popover am Header-Chip) ─────────────────────────────── */
.onv-scope-pop {
  position: fixed;
  z-index: 72;
  min-width: 240px;
  padding: var(--space-1, 4px);
  background: var(--color-surface, var(--white));
  border: 1px solid var(--gray-300, var(--border));
  border-radius: var(--radius-md, 10px);
  box-shadow: var(--shadow-md);
}
.onv-scope-opt {
  /* justify-content ausdrücklich: design-system.css zentriert Buttons global. */
  display: flex; align-items: center; justify-content: flex-start; gap: var(--space-2, 8px);
  width: 100%;
  padding: 8px var(--space-2, 8px);
  border: none; border-radius: var(--radius-sm, 6px);
  background: transparent;
  font-family: var(--font-body);
  font-size: var(--text-sm, 14px);
  color: var(--gray-900);
  text-align: left;
  cursor: pointer;
}
.onv-scope-ic {
  flex: 0 0 15px; width: 15px; height: 15px;
  display: inline-flex; align-items: center; justify-content: center; color: var(--gray-500);
}
.onv-scope-ic svg { display: block; }
.onv-scope-opt.is-on .onv-scope-ic, .onv-scope-opt:hover .onv-scope-ic { color: var(--color-sage-hover, var(--gray-700)); }
.onv-scope-l { flex: 1 1 auto; min-width: 0; text-align: left; }
.onv-scope-opt:hover { background: var(--gray-100); }
.onv-scope-opt.is-on { background: var(--color-sage-soft); font-weight: var(--fw-semibold, 600); }
.onv-scope-opt:focus-visible { outline: none; box-shadow: var(--focus-ring); }


/* ── Eingebetteter Objektbaum (im SELBEN Drawer, kein zweites Fenster) ────── */
.onv-tree { padding: 0 var(--space-2, 8px) var(--space-2, 8px); }
.onv-row {
  display: flex;
  align-items: center;
  gap: 6px;
  min-height: 32px;
  padding: 2px var(--space-2, 8px) 2px calc(6px + var(--onv-indent, 0) * 14px);
  border-radius: var(--radius-sm, 6px);
  cursor: pointer;
  color: var(--gray-900);
  font-size: var(--text-sm, 14px);
}
.onv-row:hover { background: var(--gray-100); }
.onv-row:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.onv-row.is-selected { background: var(--color-sage-soft); box-shadow: inset 2px 0 0 var(--brand-secondary, var(--color-sage)); }
.onv-row.is-selected .onv-name { font-weight: var(--fw-semibold, 600); }
.onv-row.is-pathonly { cursor: default; }
.onv-row.is-pathonly .onv-name { color: var(--gray-500); font-style: italic; }
.onv-caret {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 22px; height: 22px;
  border: none; border-radius: var(--radius-sm, 6px);
  background: transparent;
  color: var(--gray-500);
  cursor: pointer; flex-shrink: 0; padding: 0;
}
.onv-caret:hover { background: var(--gray-300); color: var(--gray-900); }
.onv-caret svg { transition: transform var(--transition, 150ms ease); }
.onv-caret.is-open svg { transform: rotate(90deg); }
.onv-caret.is-leaf { visibility: hidden; }
.onv-row .obj-node-icon { flex-shrink: 0; }
.onv-name { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.onv-name mark { background: var(--color-gold-soft, var(--gray-100)); color: inherit; border-radius: 2px; padding: 0 1px; }
.onv-path { display: block; font-size: var(--text-xs, 12px); color: var(--gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.onv-empty { padding: var(--space-3, 12px); font-size: var(--text-sm, 14px); color: var(--gray-700); text-align: center; }

/* ── Objektkontext-Karte (EINZIGE dauerhafte Kontextanzeige, in der Sidebar) ── */
.onv-sb-wrap { padding: var(--space-2, 8px) var(--space-2, 8px) var(--space-1, 4px); }
.onv-card-row { display: flex; align-items: stretch; gap: 4px; }
.onv-card-row .onv-card { flex: 1; min-width: 0; }
/* Objektfilter direkt zurücksetzen (nur sichtbar, wenn ein Objektbereich gewählt ist) */
.onv-card-clear {
  display: inline-flex;
  align-items: center; justify-content: center;
  width: 30px;
  flex-shrink: 0;
  border: 1px solid var(--sb-border, rgba(255, 255, 255, 0.12));
  border-radius: var(--radius-md, 10px);
  background: var(--sb-hover, rgba(255, 255, 255, 0.06));
  color: var(--sb-muted, rgba(255, 255, 255, 0.7));
  cursor: pointer;
}
.onv-card-clear:hover { background: var(--color-danger, #C0392C); border-color: transparent; color: var(--white, #fff); }
.onv-card-clear:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.onv-card-clear[hidden] { display: none; }
.onv-card {
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  width: 100%;
  padding: 8px var(--space-2, 8px);
  border: 1px solid var(--sb-border, rgba(255, 255, 255, 0.12));
  border-radius: var(--radius-md, 10px);
  background: var(--sb-hover, rgba(255, 255, 255, 0.06));
  color: var(--sb-text, var(--gray-100));
  font-family: var(--font-body);
  cursor: pointer;
  text-align: left;
}
.onv-card:hover { background: var(--sb-active-bg, var(--color-sage)); border-color: transparent; color: var(--sb-active-text, var(--white)); }
.onv-card:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.onv-card.is-open { background: var(--sb-active-bg, var(--color-sage)); border-color: transparent; color: var(--sb-active-text, var(--white)); }
.onv-card-ic { display: inline-flex; flex-shrink: 0; opacity: .9; }
.onv-card-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.onv-card-over {
  font-size: var(--text-xs, 12px);
  line-height: 1.25;
  color: var(--sb-muted, rgba(255, 255, 255, 0.6));
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.onv-card-main {
  font-size: var(--text-sm, 14px);
  font-weight: var(--fw-semibold, 600);
  line-height: 1.3;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.onv-card-scope {
  font-size: var(--text-xs, 12px);
  line-height: 1.25;
  color: var(--sb-muted, rgba(255, 255, 255, 0.6));
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.onv-card-scope.is-na { font-style: italic; }
.onv-card:hover .onv-card-over, .onv-card:hover .onv-card-scope,
.onv-card.is-open .onv-card-over, .onv-card.is-open .onv-card-scope { color: inherit; opacity: .85; }
.onv-card-chev { display: inline-flex; flex-shrink: 0; opacity: .6; }

/* Icon-Rail (manuell reduzierte Hauptnavigation): nur Icon + Tooltip.
   Gleiche Bedingung wie die Sidebar-Regeln der App (style.css: nur Desktop ≥1024 px). */
@media (min-width: 1024px) {
  .sidebar.is-collapsed .onv-sb-wrap { padding-left: 0; padding-right: 0; display: flex; justify-content: center; }
  .sidebar.is-collapsed .onv-card { width: 48px; justify-content: center; padding: 8px 6px; }
  .sidebar.is-collapsed .onv-card-body,
  .sidebar.is-collapsed .onv-card-chev,
  .sidebar.is-collapsed .onv-card-clear { display: none; }
}

/* ── Umfangs-Auswahl im Drawer (nur bei echter Alternative) ───────────────── */
.onv-scope-box { display: flex; flex-direction: column; gap: 2px; padding: 0 var(--space-2, 8px) var(--space-1, 4px); }
.onv-scope-choice {
  display: flex;
  align-items: center;
  gap: var(--space-2, 8px);
  width: 100%;
  min-height: 34px;
  padding: 4px var(--space-2, 8px);
  border: none; border-radius: var(--radius-sm, 6px);
  background: transparent;
  font-family: var(--font-body);
  font-size: var(--text-sm, 14px);
  color: var(--gray-900);
  text-align: left;
  cursor: pointer;
}
.onv-scope-choice:hover { background: var(--gray-100); }
.onv-scope-choice:focus-visible { outline: none; box-shadow: var(--focus-ring); }
.onv-scope-dot {
  width: 14px; height: 14px;
  border: 2px solid var(--gray-300);
  border-radius: var(--radius-full, 999px);
  flex-shrink: 0;
  position: relative;
}
.onv-scope-choice.is-on { font-weight: var(--fw-medium, 500); }
.onv-scope-choice.is-on .onv-scope-dot { border-color: var(--brand-secondary, var(--color-sage)); }
.onv-scope-choice.is-on .onv-scope-dot::after {
  content: ''; position: absolute; inset: 2px;
  border-radius: var(--radius-full, 999px);
  background: var(--brand-secondary, var(--color-sage));
}


/* ══ Feedback #3 §5.5 — Treffergruppen ═════════════════════════════════════
   Der Gruppenkopf ordnet ein und ist bewusst KEINE Auswahlzeile: leiser als ein
   Treffer, kompakt, ohne Symbol. „Was wurde gefunden" steht in der Zeile, „wo es
   hingehört" darüber. */
.onv-sw-subgroup {
  display: flex; align-items: baseline; gap: var(--space-2);
  padding: var(--space-2) var(--space-3) 2px;
  font-size: var(--text-xs); font-weight: 600; color: var(--gray-500);
}
.onv-sw-subgroup-n { font-weight: 500; color: var(--gray-400, var(--gray-500)); }
.onv-sw-subgroup + .onv-sw-row { border-top: none; }