/* ==========================================================================
   profil.css — nur die Klassen der neuen Profil-Anordnung (GF31 Subsystem 2)
   ==========================================================================
   Alle Namen mit dem Praefix `pa-` (Profil-Ansicht). Kein bestehender Selektor
   wird ueberschrieben: die neue Ansicht nutzt fuer alles, was es schon gibt
   (block, kv, pill, pilltag, fold, timeline, btn, dim, mono, ...), das
   vorhandene Design-System und definiert hier nur das Neue.
   Farben ausschliesslich ueber die Variablen aus cockpit.html -- damit gilt
   Hell und Dunkel automatisch mit, ohne zweite Farbliste.
   ========================================================================== */

/* Kopf: Rolle in der Gruppe + Registerbeleg direkt unter dem Namen. */
.pa-kopfzeile{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px}
.pa-rolle{display:inline-flex;align-items:center;gap:4px;font-size:11.5px;font-weight:650;
  letter-spacing:.02em;text-transform:uppercase;color:var(--accent-soft-ink);
  background:var(--accent-soft);border-radius:var(--r-pill);padding:2px 9px}
.pa-reg{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:var(--ink-2);
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:2px 7px}
.pa-reg svg{width:13px;height:13px}
.pa-reg.leer{color:var(--ink-3);background:transparent;border-style:dashed}

/* Entscheidungslage */
.pa-pills{gap:6px;flex-wrap:wrap;align-items:center}
.pa-aizeile{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:10px}
.pa-btns{display:flex;gap:6px;flex-wrap:wrap;margin-left:auto}
.pa-warn{display:flex;gap:8px;align-items:flex-start;margin-top:10px;padding:9px 11px;
  background:var(--warn-bg);color:var(--warn-ink);border:1px solid var(--warn);
  border-radius:var(--r-md);font-size:13px;line-height:1.45}
.pa-warn svg{width:15px;height:15px;flex:0 0 auto;margin-top:1px}
.pa-warn .btn{margin-top:7px}

/* Gruppe */
.pa-gkopf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 10px;
  background:var(--surface-2);border:1px solid var(--line);border-radius:var(--r-md)}
.pa-gkopf-l{font-size:11px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-3)}
.pa-glink{font-weight:650;color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line-2)}
.pa-glink:hover{color:var(--accent)}
.pa-gliste{margin-top:8px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.pa-quelle{margin-top:8px;font-size:11px}

/* Eine Firma der Gruppe: Zeile zu, Profil auf. */
.pa-m{border-bottom:1px solid var(--line)}
.pa-m:last-child{border-bottom:0}
.pa-m>summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;cursor:pointer;
  padding:8px 10px;font-size:13px;list-style:none}
.pa-m>summary::-webkit-details-marker{display:none}
.pa-m>summary:hover{background:var(--surface-2)}
.pa-m[open]>summary{background:var(--surface-2);border-bottom:1px solid var(--line)}
.pa-m[open]>summary .chev{transform:rotate(90deg)}
.pa-m>summary .chev{display:inline-flex;transition:transform var(--t) var(--ease)}
.pa-m-n{font-weight:600}
.pa-m-r{font-size:11.5px;color:var(--ink-2)}
.pa-m-warn{font-size:11px;color:var(--bad-ink);background:var(--bad-bg);
  border-radius:var(--r-pill);padding:1px 8px}
.pa-m-body{padding:10px}
.pa-m-prof{display:flex;flex-direction:column;gap:8px}
.pa-m-h{font-size:11px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-3);margin-top:2px}
.pa-m-akt{gap:6px;flex-wrap:wrap}

/* Personenzeilen (Gruppen-Aufklappung) */
.pa-plist{display:flex;flex-direction:column;gap:4px}
.pa-p{display:flex;align-items:center;gap:7px;flex-wrap:wrap;font-size:12.5px;
  padding:4px 0;border-bottom:1px dashed var(--line)}
.pa-p:last-child{border-bottom:0}
.pa-p-n{font-weight:600}
.pa-p-r{color:var(--ink-2)}

/* Kontakt & Senden ────────────────────────────────────────────────────────
   Der Empfaenger steht als eigene Zeile UEBER den Kanaelen: wer schreibt, muss
   zuerst wissen, an wen. Vorher war das eine Zeile im Dispositions-Kasten. */
.pa-ziel{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;font-size:13px;
  padding:8px 10px;background:var(--surface-2);border:1px solid var(--line);
  border-radius:var(--r-md);margin-bottom:10px}
.pa-ziel.leer{border-style:dashed;background:transparent}
.pa-ziel-l{font-size:11px;font-weight:650;letter-spacing:.04em;text-transform:uppercase;
  color:var(--ink-3)}
.pa-ziel a{display:inline-flex;align-items:center;gap:4px;color:var(--ink-2);
  text-decoration:none;border-bottom:1px solid var(--line-2)}
.pa-ziel a:hover{color:var(--accent)}
.pa-ziel svg{width:13px;height:13px}

/* EIN Sendebereich statt vier Einstiegen. */
.pa-senden{margin-top:12px;padding:10px 11px;border:1px solid var(--line);
  border-radius:var(--r-md);background:var(--surface-2)}
.pa-senden-h{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:8px}
.pa-senden-n{font-size:11px;line-height:1.45;margin-top:8px}
.pa-kanal{display:flex;gap:6px;flex-wrap:wrap;align-items:center}

/* Ergebnis festhalten -- eine Zeile, kein Assistent. */
.pa-erg{margin-top:14px;padding-top:12px;border-top:1px solid var(--line)}
.pa-erg-h{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:8px}
.pa-erg .row{gap:6px}
.pa-kanalw{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;
  color:var(--ink-3);margin-right:4px}
.pa-kanalw select{font:inherit;font-size:12.5px;color:var(--ink);padding:5px 8px;
  background:var(--surface);border:1px solid var(--line);border-radius:var(--r-sm)}

/* Hintere Sektion */
.pa-mehr{margin-top:22px;padding-top:14px;border-top:1px solid var(--line-2)}
.pa-mehr-h{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:8px}
.pa-adcheck{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;
  padding:8px 10px;font-size:12.5px;color:var(--ink-2);background:var(--surface-2);
  border:1px solid var(--line);border-radius:var(--r-md)}
.pa-adcheck svg{width:14px;height:14px}
.pa-adcheck .btn{margin-left:auto}

/* Hilfsmasse -- ersetzt die vorher inline gesetzten style="margin-top:..." */
.pa-abstand{margin-top:12px}
.pa-wrap{flex-wrap:wrap}
.pa-rechts{margin-left:auto}