/* ===========================================================================
   Protokollseite (Stufe 2b, zehnte Lieferung — 05.08.2026)

   Ergaenzt `sitzung.css`, ersetzt es nicht: Kopfzeile, Knoepfe, Karten, Felder,
   Statuspillen und Hinweise sind dort schon definiert und tragen den Praefix
   `sz-`. Diese Datei bringt nur, was die Protokollseite zusaetzlich braucht —
   Praefix `pr-`.

   NAMENSFALLE `pr-`: `styles.css` bringt DREI `pr-`-Klassen der alten
   Oberflaeche mit (`pr-dringend`, `pr-mittel`, `pr-niedrig` — die
   Prioritaetspillen) und wird auf dieser Seite ebenfalls geladen. Werden sie
   hier wiederverwendet, zieht sich die neue Seite stillschweigend fremde
   Farben an. Genau dieser Fehler drohte schon beim Meeting-Modus mit `mt-`.
   Die drei Namen sind gemieden, ein Test wacht darueber.

   HARTE AUFLAGE (Entscheidungskatalog 01.08.2026, Frage 9/10):
   Theme ausschliesslich ueber CSS-Variablen. Kein Hexwert in diesen Regeln.

   Farbrollen, die hier gelten:
     --accent            (#8764B8) nur Flaeche
     --accent-strong     (#6B4A9E) jeder Text, jeder Knopf
     --accent-soft       (#F1ECFA) zarte Flaeche
     --status-erledigt   freigegebene Fassung — immer zusaetzlich als Wort
     --status-geschlossen Entwurf des Altbestands — ebenfalls als Wort
   =========================================================================== */

/* ---------- Filterleiste ---------- */
.pr-filter{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:flex-end;
  background:var(--bg-elevated);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4);margin-bottom:var(--sp-4)}
.pr-filter .sz-feld{flex:1 1 220px;max-width:340px}
.pr-treffer-zeile{font-size:.8125rem;color:var(--text-muted);margin-bottom:var(--sp-3)}

/* ---------- Eine Besprechungsreihe als Gruppe ---------- */
.pr-gruppe{margin-bottom:var(--sp-5)}
.pr-gruppe-kopf{display:flex;align-items:baseline;gap:var(--sp-3);flex-wrap:wrap;
  margin-bottom:var(--sp-2)}
.pr-gruppe-kopf h2{margin:0;flex:0 1 auto}
.pr-gruppe-kopf a.sz-btn{text-decoration:none;margin-left:auto}
.pr-treffer{font-size:.75rem;color:var(--text-muted);font-weight:700}

/* ---------- Die Fassungen einer Reihe ---------- */
.pr-liste{list-style:none;margin:0;padding:0;background:var(--bg-elevated);
  border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.pr-liste li+li{border-top:1px solid var(--border)}
.pr-zeile{display:flex;gap:var(--sp-3);flex-wrap:wrap;align-items:center;
  padding:var(--sp-3) var(--sp-4);text-decoration:none;color:var(--text)}
.pr-zeile:hover{background:var(--accent-soft)}
.pr-zeile:focus-visible{outline:2px solid var(--focus);outline-offset:-2px}
.pr-z-datum{font-weight:700;display:inline-flex;align-items:center;gap:6px;
  flex:0 0 190px}
.pr-z-version{font-size:.75rem;font-weight:700;color:var(--accent-strong);
  background:var(--accent-soft);padding:3px 9px;border-radius:var(--radius-full)}
.pr-z-meta{font-size:.8125rem;color:var(--text-muted)}

/* Zustand einer Fassung. Die Flaeche ist Beiwerk — das Wort steht immer daneben
   (Graustufendruck, Farbsehschwaeche). Die drei Namen liegen bewusst NICHT auf
   `pr-dringend`/`pr-mittel`/`pr-niedrig` aus styles.css. */
.pr-s-entwurf{background:var(--status-geschlossen-bg);color:var(--status-geschlossen)}
.pr-s-freigegeben{background:var(--status-erledigt-bg);color:var(--status-erledigt)}
.pr-s-versendet{background:var(--accent-soft);color:var(--accent-strong)}

/* ---------- Einzelansicht ---------- */
.pr-kopfleiste{display:flex;gap:var(--sp-3);align-items:center;flex-wrap:wrap;
  margin-bottom:var(--sp-3)}
.pr-kopfleiste a.sz-btn{text-decoration:none}
.pr-angaben{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:var(--sp-3);margin:0}
.pr-angabe dt{font-size:.6875rem;text-transform:uppercase;letter-spacing:.05em;
  color:var(--text-muted);font-weight:800;margin-bottom:2px}
.pr-angabe dd{margin:0;font-size:.9375rem}
.pr-angabe dd a{color:var(--accent-strong)}
.pr-dok-kopf{background:var(--bg-elevated);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:var(--sp-3) var(--sp-4);
  margin:var(--sp-4) 0 var(--sp-3)}
.pr-dok-kopf p{margin:0 0 var(--sp-2)}
.pr-dok-kopf p:last-child{margin-bottom:0}

/* Das Dokument in einem abgeschotteten Rahmen. Feste Hoehe mit eigener
   Bildlaufleiste: ohne `allow-scripts` kann das Dokument seine Hoehe nicht
   melden, und Skripte bekommt es bewusst nicht. Gedruckt wird ohnehin in einem
   eigenen Fenster. */
.pr-dokument{display:block;width:100%;height:72vh;min-height:420px;
  border:1px solid var(--border-strong);border-radius:var(--radius-lg);
  background:var(--bg-elevated)}

@media (max-width:600px){
  .pr-z-datum{flex:1 1 100%}
  .pr-dokument{height:60vh}
}