/* Bausteine G3–G9 des PBX Manager (Vorgang 246, ADR 008 W1). Nur Klassen und Tokens aus app/tokens.css, kein Inline-Stil
   (CSP style-src 'self'). Geladen nach pbx.css und partner.css: .pb-main button.pb-knopf-haupt und
   .pb-main button:not(.pb-navknopf) sind gleich stark, die Reihenfolge der Stylesheets entscheidet (Teil des Vertrags).
   Media-Abfragen tragen feste Breiten, weil var() dort nicht wirkt: Fußleiste 620/621, Raster 720/721 und 1179/1180,
   Liste 1179/1180 (Karten bis 1179 px, auch auf dem Tablet; die Tabelle erst ab der Breite, ab der sie passt). */

/* G3 Reiterleiste: eine Zeile, bei Überlauf scrollt nur die Leiste */
.pb-reiterleiste { display: flex; flex-wrap: nowrap; gap: var(--pb-a-2xs); overflow-x: auto; margin: 0 0 var(--pb-a-l); border-bottom: 1px solid var(--pb-line); }
.pb-main .pb-reiterleiste button { flex: 0 0 auto; min-height: var(--pb-feldhoehe); padding: 0 var(--pb-a-m); border: 0; border-bottom: 2px solid transparent; border-radius: 0; background: transparent; color: var(--pb-muted); font-size: var(--pb-schrift-m); white-space: nowrap; }
.pb-main .pb-reiterleiste button[aria-selected=true] { border-bottom-color: var(--pb-accent); color: var(--pb-accent); font-weight: 600; }

/* G4 Liste: Trefferzahl, Filterleiste (Bestand .pb-filter), Tabelle; bis 1179 px wird jede Zeile zur Karte, die Aktion
   steht unten in der Karte (Leitstand 29.09.: die Liste ist in jeder Breite bedienbar, auch zwischen 621 und 1179 px) */
.pb-liste { margin: 0 0 var(--pb-a-l); border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-panel); min-width: 0; }
.pb-liste > .pb-treffer { padding-top: var(--pb-a-m); }
.pb-listenrahmen { min-width: 0; }
table.pb-karten { width: 100%; border-collapse: collapse; font-size: var(--pb-schrift-m); }
table.pb-karten th, table.pb-karten td { padding: var(--pb-a-s) var(--pb-a-m); border-bottom: 1px solid var(--pb-line); text-align: left; overflow-wrap: break-word; }
table.pb-karten th { color: var(--pb-muted); font-size: var(--pb-schrift-s); font-weight: 600; overflow-wrap: normal; white-space: nowrap; }
table.pb-karten td.pb-aktion { width: 1%; text-align: right; white-space: nowrap; }
table.pb-karten tr[hidden] { display: none; }

/* G5 Abschnitt: fieldset > legend bzw. section > h3; min-width: 0, sonst drückt min-content Auswahlfelder aus dem Panel */
.pb-abschnitt { min-width: 0; margin: 0 0 var(--pb-a-l); padding: var(--pb-a-l); border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-panel); }
.pb-abschnitt > .pb-abschnitt-titel { float: left; width: 100%; margin: 0 0 var(--pb-a-m); padding: 0; color: var(--pb-muted); font-size: var(--pb-schrift-s); font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
.pb-abschnitt > .pb-abschnitt-titel + * { clear: both; }

/* G6 Feldraster: 12 Spalten, Spannen S 3, M 6, L 12, höchstens --pb-formbreite; Beschriftung über dem Feld */
.pb-raster { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--pb-a-m) var(--pb-a-l); max-width: var(--pb-formbreite); }
.pb-feld { display: grid; grid-column: span 12; gap: var(--pb-a-xs); align-content: start; min-width: 0; }
.pb-feld-s { grid-column: span 3; }
.pb-feld-m { grid-column: span 6; }
.pb-feld-l { grid-column: span 12; }
.pb-feld > label { display: block; color: var(--pb-muted); font-size: var(--pb-schrift-s); }
.pb-feld input, .pb-feld select, .pb-feld textarea { width: 100%; min-width: 0; min-height: var(--pb-feldhoehe); padding: var(--pb-a-s) var(--pb-a-m); border: 1px solid var(--pb-line); border-radius: var(--pb-radius-klein); background: var(--pb-bg); color: var(--pb-ink); font: inherit; font-size: var(--pb-schrift-m); }
.pb-feld-hinweis, .pb-feld-fehler, .pb-feld-auswahltext { margin: 0; font-size: var(--pb-schrift-s); }
.pb-feld-hinweis, .pb-feld-fehler, .pb-detail .pb-feld-hinweis, .pb-detail .pb-feld-fehler { overflow-wrap: break-word; }
.pb-feld-haken > label.pb-haken { display: flex; align-items: center; gap: var(--pb-a-s); min-height: var(--pb-feldhoehe); color: var(--pb-ink); font-size: var(--pb-schrift-m); }
.pb-feld-haken input[type=checkbox] { width: auto; min-width: 0; min-height: 0; }
.pb-feld-hinweis { color: var(--pb-muted); }
.pb-feld-fehler { color: var(--pb-error); }
.pb-pflicht { margin-left: var(--pb-a-2xs); color: var(--pb-error); }
.pb-feld-auswahltext { display: block; color: var(--pb-ink); overflow-wrap: break-word; }
@media (max-width: 1179px) { .pb-feld-s { grid-column: span 6; } }
/* iPad (V2, Messung 29.09.): ein halbes M-Feld ist zwischen 721 und 1023 px zu schmal für die typische Länge (40 Zeichen) */
@media (max-width: 1023px) { .pb-feld-m { grid-column: span 12; } }
@media (max-width: 720px) { .pb-feld-s, .pb-feld-m, .pb-feld-l { grid-column: span 12; } }

/* G7 Knöpfe: genau eine Art je Knopf, auch auf der Anmeldekarte (W2); :is(.pb-main, .karte) behält die Stärke (0,2,1) */
:is(.pb-main, .karte) button.pb-knopf { min-height: var(--pb-feldhoehe); padding: 0 var(--pb-a-l); border-radius: var(--pb-radius-klein); font-size: var(--pb-schrift-m); font-weight: 600; }
:is(.pb-main, .karte) button.pb-knopf-haupt { border: 0; padding: var(--pb-a-m); font-weight: 400; background: var(--pb-accent); color: var(--pb-auf-akzent); }
:is(.pb-main, .karte) button.pb-knopf-haupt:hover { border-color: var(--pb-ink); color: var(--pb-auf-akzent); }
/* W2c: vorhandener Nebenstil der Anmeldekarte, damit produktive Nebenaktionen keinen zusätzlichen Stil erzeugen. */
:is(.pb-main, .karte) button.pb-knopf-neben { border: 1px solid var(--pb-line); padding: var(--pb-a-m); font-weight: 400; background: transparent; color: var(--pb-accent); }
:is(.pb-main, .karte) button.pb-knopf-gefahr { border: 1px solid var(--pb-error); background: var(--pb-panel); color: var(--pb-error); }
:is(.pb-main, .karte) button.pb-knopf-gefahr:hover { border-color: var(--pb-error); background: var(--pb-errorbg); color: var(--pb-error); }
:is(.pb-main, .karte) button.pb-knopf:disabled { opacity: .45; cursor: not-allowed; }

/* G8 Fußleiste: rechts zuerst die Nebenaktionen, dann die Hauptaktion; ab 621 px am unteren Rand stehend, bis 620 px im Fluss */
.pb-fussleiste { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--pb-a-s) var(--pb-a-m); margin: var(--pb-a-l) 0 0; padding: var(--pb-a-m) var(--pb-a-l); border-top: 1px solid var(--pb-line); background: var(--pb-panel); }
.pb-fuss-links, .pb-fuss-rechts { display: flex; flex-wrap: wrap; align-items: center; gap: var(--pb-a-s); min-width: 0; }
.pb-fuss-rechts { margin-left: auto; justify-content: flex-end; }
.pb-fuss-riegel { margin: 0; color: var(--pb-warn); font-size: var(--pb-schrift-s); }
@media (min-width: 621px) { .pb-fussleiste { position: sticky; bottom: 0; z-index: 1; } }
@media (max-width: 620px) {
  .pb-fussleiste { display: grid; grid-template-columns: minmax(0, 1fr); }
  .pb-fuss-links, .pb-fuss-rechts { display: grid; grid-template-columns: minmax(0, 1fr); margin-left: 0; }
  .pb-fuss-links:empty { display: none; }
  .pb-fussleiste .pb-knopf { justify-self: stretch; width: 100%; }
}

/* G9 Leerzustand: eine Form für leer, laden, Fehler und Platzhalter */
.pb-leer { display: grid; gap: var(--pb-a-xs); justify-items: start; margin: 0 0 var(--pb-a-l); padding: var(--pb-a-xl) var(--pb-a-l); border: 1px solid var(--pb-line); border-radius: var(--pb-radius); background: var(--pb-panel); }
.pb-leer > .pb-leer-titel { margin: 0; color: var(--pb-ink); font-size: var(--pb-schrift-l); font-weight: 600; }
.pb-leer > .pb-leer-satz { margin: 0 0 var(--pb-a-s); color: var(--pb-muted); font-size: var(--pb-schrift-m); }
.pb-leer-fehler { border-color: var(--pb-error); }
.pb-leer-fehler > .pb-leer-titel { color: var(--pb-error); }

/* G4 Kartenzeilen bis 1179 px */
@media (max-width: 1179px) {
  table.pb-karten thead { display: none; }
  table.pb-karten, table.pb-karten tbody, table.pb-karten tr, table.pb-karten td { display: block; width: 100%; }
  table.pb-karten tr { margin: 0 0 var(--pb-a-s); padding: var(--pb-a-s) var(--pb-a-m); border: 1px solid var(--pb-line); border-radius: var(--pb-radius-klein); }
  table.pb-karten td { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); gap: var(--pb-a-s); padding: var(--pb-a-2xs) 0; border: 0; }
  table.pb-karten td::before { content: attr(data-label); color: var(--pb-muted); font-size: var(--pb-schrift-s); }
  table.pb-karten td.pb-aktion { display: block; width: 100%; padding-top: var(--pb-a-s); text-align: left; white-space: normal; }
  table.pb-karten td.pb-aktion::before { content: none; }
  .pb-liste > .pb-listenrahmen { padding: 0 var(--pb-a-m) var(--pb-a-m); }
}

/* 215: kompakte, lesbare Standardbausteine; bestehende Semantik und Bedienflächen bleiben erhalten. */
.pb-liste { box-shadow: var(--pb-panel-schatten); margin-bottom: var(--pb-a-xl); overflow: hidden; }
.pb-abschnitt { padding: var(--pb-a-xl); margin-bottom: var(--pb-a-xl); box-shadow: var(--pb-panel-schatten); }
.pb-abschnitt > .pb-abschnitt-titel { color: var(--pb-ink); font-size: var(--pb-schrift-m); font-weight: 650; letter-spacing: 0; text-transform: none; }
.pb-raster { gap: var(--pb-a-l) var(--pb-a-xl); }
.pb-feld > label { font-weight: 550; }
.pb-feld input, .pb-feld select, .pb-feld textarea { background: var(--pb-panel); }
.pb-feld :is(input,select,textarea):disabled { background: var(--pb-soft); color: var(--pb-muted); opacity: 1; }
:is(.pb-main, .karte) button.pb-knopf { font-weight: 550; line-height: 1.35; }
:is(.pb-main, .karte) button.pb-knopf-haupt { padding: var(--pb-a-s) var(--pb-a-l); font-weight: 600; }
:is(.pb-main, .karte) button.pb-knopf-neben { padding: var(--pb-a-s) var(--pb-a-l); background: var(--pb-panel); font-weight: 550; }
:is(.pb-main, .karte) button.pb-knopf-neben:hover:not(:disabled) { background: var(--pb-tint); border-color: var(--pb-accent); color: var(--pb-accent); }
:is(.pb-main, .karte) button.pb-knopf:disabled { opacity: .55; cursor: not-allowed; }
.pb-fussleiste { padding: var(--pb-a-l); gap: var(--pb-a-m); }
.pb-fuss-riegel { line-height: 1.5; }
.pb-reiterleiste { gap: var(--pb-a-s); }
.pb-leer { padding: var(--pb-a-2xl) var(--pb-a-xl); background: var(--pb-panel); }
.pb-leer > .pb-leer-titel { font-weight: 650; }
.pb-leer > .pb-leer-satz { max-width: var(--pb-formbreite); }
table.pb-table { width: 100%; border-collapse: collapse; font-size: var(--pb-schrift-s); line-height: 1.5; }
table.pb-table th, table.pb-table td { text-align: left; vertical-align: middle; padding: var(--pb-a-m) var(--pb-a-l); border-bottom: 1px solid var(--pb-line); overflow-wrap: anywhere; }
table.pb-table th { color: var(--pb-muted); background: var(--pb-soft); font-size: var(--pb-schrift-xs); font-weight: 600; white-space: nowrap; }
table.pb-table tbody tr:last-child td { border-bottom: 0; }
table.pb-table tbody tr:hover { background: var(--pb-soft); }
table.pb-table td:last-child .aktionen { margin: 0; }
table.pb-table td :is(p,h3,h4) { margin-block: var(--pb-a-xs); }
table.pb-karten th { background: var(--pb-soft); }
table.pb-karten td { vertical-align: middle; }
@media (min-width: 1180px) { table.pb-karten th, table.pb-karten td { padding: var(--pb-a-m) var(--pb-a-l); } }
@media (max-width: 620px) {
 .pb-abschnitt { padding: var(--pb-a-l); margin-bottom: var(--pb-a-l); }
 .pb-leer { padding: var(--pb-a-xl) var(--pb-a-l); }
 .pb-fussleiste { position: static; padding: var(--pb-a-m); }
 .pb-tablewrap table.pb-table { min-width: 630px; }
 table.pb-table th, table.pb-table td { padding: var(--pb-a-s) var(--pb-a-m); }
 table.pb-karten tr { background: var(--pb-panel); padding: var(--pb-a-m); }
 table.pb-karten td { padding-block: var(--pb-a-xs); }
 .pb-liste { margin-bottom: var(--pb-a-l); }
}