/* ===========================================================================
   PB.spaltenteiler: ziehbarer Griff zwischen linker Spalte und rechtem
   Inhaltsbereich (public/js/kern/spaltenteiler.js). Farben über die
   Design-Tokens aus app.css (Hell/Dunkel automatisch).
   =========================================================================== */

.pb-spaltenteiler {
  flex: none;
  width: 6px;
  /* Negative Außenränder statt echtem Abstand: der Griff legt sich damit
     GENAU auf die schon vorhandene Trennlinie (border-right von `links`,
     z. B. .wiki__side/.nt-seite), statt eine zweite Linie danaben zu ziehen
     und die Spalten sichtbar auseinanderzuschieben. */
  margin: 0 -3px;
  cursor: col-resize;
  position: relative;
  z-index: 1;
  /* Pointer-Events selbst auswerten -- kein Browser-Scroll/Zoom beim Ziehen
     auf Touch-Geräten. */
  touch-action: none;
}
/* Eigene Linie NUR bei Hover/Fokus als Rückmeldung -- im Ruhezustand
   übernimmt die schon vorhandene border-right von `links` die Optik, der
   Griff liegt (siehe margin oben) genau darüber. */
.pb-spaltenteiler::after {
  content: '';
  position: absolute;
  top: 0; bottom: 0; left: 50%; width: 2px;
  transform: translateX(-50%);
  background: transparent;
}
.pb-spaltenteiler:hover::after,
.pb-spaltenteiler:focus-visible::after {
  background: var(--accent);
}

/* Handy-Layout (< 640px): Ordnerbaum und Inhalt stapeln sich untereinander
   (siehe wiki.css/sop.css und die jeweilige Modul-CSS) -- ein Griff, der
   "nach links/rechts" ziehen soll, zeigt dort ins Leere. */
@media (max-width: 640px) {
  .pb-spaltenteiler { display: none; }
}