/* marke-ui-chat.css — KI-Bausteine im Workspace-Chat (Stil-Basis, Ralph 17.10.2026).
   Kurzbeschreibung: Plan/Arbeitsschritte als zugeklappte Box oder Werkzeug-Zeile,
   Quellen als Plaketten, leise Aktionen unter der Antwort. Die Bausteine baut
   workspace-haupt.js („KI-Bausteine der Stil-Basis“) aus der fertigen Antwort;
   ohne <html class="marke-ui"> bleibt alles wie vorher. Vorbild: Abschnitt
   „Arbeitsplatz“ in marke/ui-referenz.html, Grundstile in marke-ui.css. */

/* Umschalten alt ↔ neu: neue Bausteine nur mit Klasse, alte Blöcke nur ohne */
:root:not(.marke-ui) .a4h-ki-neu { display: none !important; }
:root.marke-ui .msg-bubble .a4h-ki-alt { display: none; }

/* Abstand der Bausteine zum Antworttext */
:root.marke-ui .msg-bubble .a4h-ki-denken,
:root.marke-ui .msg-bubble .a4h-ki-werkzeug { margin: 2px 0 10px; max-width: 560px; }
:root.marke-ui .msg-bubble .a4h-ki-fuss { margin: 10px 0 2px; }

/* Denkschritte: Titel einzeilig, Pfeil rechts dreht beim Aufklappen */
:root.marke-ui .msg-bubble .a4h-ki-denken > summary { font-size: 13px; line-height: 1.4; }
:root.marke-ui .msg-bubble .a4h-ki-denken-titel { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:root.marke-ui .msg-bubble .a4h-ki-pfeil { margin-left: auto; transition: transform .15s; }
:root.marke-ui .msg-bubble .a4h-ki-denken[open] .a4h-ki-pfeil { transform: rotate(180deg); }
:root.marke-ui .msg-bubble .a4h-ki-denken > div { font-size: 13px; line-height: 1.5; }
:root.marke-ui .msg-bubble .a4h-ki-abschnitt { margin: 0 0 4px; color: var(--marke-text-3); font-size: 11px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; }
:root.marke-ui .msg-bubble .a4h-ki-abschnitt:not(:first-child) { margin-top: 10px; }
:root.marke-ui .msg-bubble .a4h-ki-denken ol,
:root.marke-ui .msg-bubble .a4h-ki-plan { margin: 0; padding-left: 0; }
:root.marke-ui .msg-bubble .a4h-ki-denken ol { padding-left: 1.3em; }
:root.marke-ui .msg-bubble .a4h-ki-plan { list-style: none; }
:root.marke-ui .msg-bubble .a4h-ki-plan li { position: relative; margin: 2px 0; padding-left: 1.6em; }
:root.marke-ui .msg-bubble .a4h-ki-status { position: absolute; left: 0; width: 1em; text-align: center; font-weight: 700; color: var(--marke-text-3); }
:root.marke-ui .msg-bubble .a4h-ki-status.is-ok { color: var(--marke-ok); }
:root.marke-ui .msg-bubble .a4h-ki-status.is-teil { color: var(--marke-warn); }
:root.marke-ui .msg-bubble .a4h-ki-status.is-offen { color: var(--marke-gefahr); }

/* Werkzeug-Zeile: Text in normaler Schrift (es ist Klartext, kein Befehl) */
:root.marke-ui .msg-bubble .a4h-ki-werkzeug { font-family: var(--marke-schrift); color: var(--marke-text-2); }
:root.marke-ui .msg-bubble .a4h-ki-werkzeug-text { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Quellen-Plaketten: Link ohne Unterstrich, Kurzname gekürzt */
:root.marke-ui .msg-bubble a.a4h-quelle { color: var(--marke-text-2); text-decoration: none; max-width: 240px; }
:root.marke-ui .msg-bubble a.a4h-quelle:hover { color: var(--marke-text); background: var(--marke-linie); }
:root.marke-ui .msg-bubble a.a4h-quelle span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Leise Aktionen (Kopieren, ggf. „Fall freigeben“): unter der Antwort statt
   schwebend oben rechts — wie a4h-iconbar / a4h-icon-btn */
:root.marke-ui .msg.agent { flex-wrap: wrap; }
:root.marke-ui .msg.agent .msg-actions {
  position: static;
  flex: 0 0 100%;
  order: 3;
  margin-top: -6px;
  padding-left: calc(32px + 0.75rem);
  display: flex;
  align-items: center;
  gap: 2px;
  opacity: 0;
}
:root.marke-ui .msg.agent:hover .msg-actions,
:root.marke-ui .msg.agent:last-child .msg-actions,
:root.marke-ui .msg.agent .msg-actions:focus-within { opacity: 1; }
:root.marke-ui .msg.agent .msg-actions .msg-copy-btn {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: var(--marke-r-m);
  background: transparent;
  backdrop-filter: none;
  color: var(--marke-text-2);
}
:root.marke-ui .msg.agent .msg-actions .msg-copy-btn svg { width: 16px; height: 16px; }
:root.marke-ui .msg.agent .msg-actions .msg-copy-btn:hover { background: var(--marke-flaeche-2); color: var(--marke-text); }
:root.marke-ui .msg.agent .msg-actions .msg-copy-btn.copied { color: var(--marke-ok); }