/* Griff zum Ziehen der Spaltenbreite (gehoert zu /shared/cse-spalten.js).
   Muss AUFFINDBAR sein: ein dauerhaft sichtbarer, dezenter Trenner zeigt, dass
   sich die Spalte ziehen laesst. Faehrt man mit der Maus in die Kopfzeile,
   treten alle Trenner deutlicher hervor; direkt am Griff wird er kraeftig und
   der Zeiger wechselt auf den Doppelpfeil. (Vorher war er unsichtbar -> niemand
   fand ihn, Nutzerhinweis 24.07.2026.) */

.cse-spaltengriff {
  position: absolute;
  top: 0;
  right: -3px;               /* etwas ueber die Kante hinaus -> leichter zu treffen */
  width: 11px;
  height: 100%;
  cursor: col-resize;
  user-select: none;
  touch-action: none;        /* sonst scrollt das Handy statt zu ziehen */
  z-index: 2;
}

.cse-spaltengriff::after {
  content: "";
  position: absolute;
  top: 15%;
  right: 4px;
  width: 2px;
  height: 70%;
  border-radius: 1px;
  background: currentColor;
  opacity: .22;              /* immer leicht sichtbar = "hier kann man fassen" */
  transition: opacity .12s;
}

/* Maus irgendwo in der Kopfzeile -> alle Trenner der Zeile deutlicher.
   Die Griffe sitzen in den Kopfzellen (th), darum genuegt der Zeilen-Hover. */
tr:hover .cse-spaltengriff::after { opacity: .45; }

/* Direkt ueber dem Griff: kraeftig, damit klar ist, wo man zieht. */
.cse-spaltengriff:hover::after { opacity: .9; width: 3px; }

/* Waehrend des Ziehens: Cursor ueberall gleich, nichts markiert sich versehentlich. */
body.cse-spalten-zieht,
body.cse-spalten-zieht * { cursor: col-resize !important; user-select: none !important; }

/* Beim Drucken stoert der Griff nur. */
@media print { .cse-spaltengriff { display: none; } }