/* PROJECT LEGEND V0.52.0 - S2-3: sortierbare Kopfzellen.

   Nur Marken, keine Literale: ab v0533 prueft stil-wache.pl dieses Blatt hart.

   Der Knopf traegt die ganze Kopfzelle. Ein kleiner Knopf mitten in der Zelle
   waere ein Zielproblem - die Kopfzeile ist die Flaeche, die man trifft. */

#pl420Root .pl536-kopf{
  display:flex;
  align-items:center;
  gap:var(--pl42-s1);
  width:100%;
  padding:0;
  border:0;
  background:none;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  text-align:inherit;
  cursor:pointer;
}
/* Zahlenspalten sind rechtsbuendig; der Knopf muss das uebernehmen, sonst
   springt die Beschriftung beim Sortierbarmachen nach links. */
#pl420Root th.pl42-num .pl536-kopf{
  justify-content:flex-end;
}
#pl420Root .pl536-kopf:hover{
  color:var(--pl42-gold-bright);
}
#pl420Root .pl536-kopf:focus-visible{
  outline:2px solid var(--pl42-gold);
  outline-offset:2px;
}
/* Die gewaehlte Spalte bleibt erkennbar, auch wenn der Pfeil im schmalen
   Kopf einmal umbricht. */
#pl420Root th[aria-sort="ascending"] .pl536-kopf,
#pl420Root th[aria-sort="descending"] .pl536-kopf{
  color:var(--pl42-gold-bright);
}

/* --- Spaltenwahl (S2-10) ------------------------------------------------
   Kein Deckel auf die Zahl der gewaehlten Spalten: eine kuenstliche
   Obergrenze ist der Fehler, den FM26 mit sechs von 24 Lesezeichen gemacht
   hat. Verborgen wird ueber ein <colgroup>, damit keine Zeile angefasst
   werden muss. */
#pl420Root .pl536-spaltenbox{
  position:relative;
  display:inline-flex;
  flex-direction:column;
  align-items:flex-start;
  gap:var(--pl42-s1);
}
#pl420Root .pl536-spaltenknopf{
  min-height:var(--pl42-touch);
  padding:0 var(--pl42-s3);
  border:1px solid var(--pl42-line-strong);
  border-radius:var(--pl42-r-sm);
  background:var(--pl42-panel);
  color:var(--pl42-ink-3);
  font-size:var(--pl42-small);
  cursor:pointer;
}
#pl420Root .pl536-spaltenknopf:hover{
  color:var(--pl42-gold-bright);
  border-color:var(--pl42-gold-deep);
}
#pl420Root .pl536-spaltenliste{
  display:flex;
  flex-wrap:wrap;
  gap:var(--pl42-s1);
  padding:var(--pl42-s2);
  border:1px solid var(--pl42-line);
  border-radius:var(--pl42-r-sm);
  background:var(--pl42-panel-2);
}
#pl420Root .pl536-spalte{
  min-height:var(--pl42-touch);
  padding:0 var(--pl42-s2);
  border:1px solid var(--pl42-line-strong);
  border-radius:var(--pl42-r-pill);
  background:none;
  color:var(--pl42-ink-4);
  font-size:var(--pl42-label);
  text-transform:uppercase;
  letter-spacing:var(--pl42-track-label);
  cursor:pointer;
}
#pl420Root .pl536-spalte.is-an{
  color:var(--pl42-gold-bright);
  border-color:var(--pl42-gold-deep);
  background:var(--pl42-gold-wash);
}

/* Die Leiste ueber der Tabelle traegt die Spaltenwahl. Sie sitzt im
   Panelinnenraum, damit sie mit dem Panelkopf fluchtet. */
#pl420Root .pl536-leiste{
  padding:0 var(--pl42-s5) var(--pl42-s2);
}