/* ============================================================
   Kundenportal — Add-on CSS
   Alles, was der Handoff (portal-customer.css) nicht mitbringt.
   Wird NACH portal-customer.css geladen; Regeln hier gewinnen.
   ============================================================ */

/* System-/Ereigniszeile im Thread — dezent, nicht als Bubble */
.msg-event{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  font-size:12px;
  color:var(--text-muted);
  padding:2px 0;
  opacity:.85;
}
.msg-event .icon{flex-shrink:0}

/* Aufgaben-Kachel als klickbarer Link (Handoff-Makro rendert div ohne href) */
a.task,a.task:hover,a.task:visited{color:inherit;text-decoration:none}
a.task{cursor:pointer}
a.task:hover{background:rgba(0,0,0,.02)}

/* Signatur-Toggle (ABWEICHUNG VOM HANDOFF, analog portal-addon.css) */
.msg__sig-wrap{margin-top:8px}
.msg__sig-btn{background:none;border:none;padding:0;font-size:11.5px;color:var(--text-muted);cursor:pointer;opacity:.65;line-height:1.4}
.msg__sig-btn:hover{opacity:1;text-decoration:underline}

/* Nachrichten-Anhänge (ABWEICHUNG VOM HANDOFF, analog portal-addon.css) */
.msg__attachments{margin-top:8px;padding-top:8px;border-top:1px solid var(--portal-border);display:flex;flex-direction:column;gap:3px}
.msg--team .msg__attachments{border-top-color:var(--assignee-team-bd)}
.msg--cust .msg__attachments{border-top-color:var(--assignee-cust-bd)}
.msg-att{display:flex;align-items:center;gap:6px;font-size:13px;line-height:1.3}
.msg-att__icon{color:var(--text-muted);flex:none;opacity:.65}
.msg-att__name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600;color:var(--text-strong)}
.msg-att__size{font-size:11.5px;color:var(--text-muted);flex:none}
.msg-att__act{flex:none;width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--portal-radius-sm);border:none;background:none;cursor:pointer;color:var(--text-muted);text-decoration:none;padding:0}
.msg-att__act:hover{background:rgba(0,0,0,.07);color:var(--text-body)}

/* Composer-Anhang-Widget (ABWEICHUNG VOM HANDOFF) — Chips innerhalb des Composers.
   Uploads laufen über die bestehenden Kunden-presign/finalize-Endpunkte der Task. */
.composer-attach{margin-top:6px;display:flex;flex-direction:column;gap:4px}
.composer-attach:empty{display:none}
.composer-attach__chips{display:flex;flex-wrap:wrap;gap:6px}
.composer-attach__chips:empty{display:none}
.composer-attach__list{margin:0}
.composer-attach__chip{display:inline-flex;align-items:center;gap:6px;padding:3px 6px 3px 8px;background:var(--portal-bg-muted,#f2f2f4);border:1px solid var(--portal-border,#e3e3e6);border-radius:12px;font-size:12.5px;color:var(--text-body,#333);max-width:100%}
.composer-attach__chip-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.composer-attach__chip-rm{background:none;border:none;padding:0;width:18px;height:18px;line-height:1;font-size:16px;color:var(--text-muted,#888);cursor:pointer;border-radius:50%}
.composer-attach__chip-rm:hover{background:rgba(0,0,0,.08);color:var(--text-body,#333)}
button.thread__attach{background:none;border:none;padding:0;font:inherit;cursor:pointer;color:inherit;display:inline-flex;align-items:center;gap:6px}
button.thread__attach:hover{color:var(--text-strong,#111)}

/* Offcanvas + Modal Basis-Regeln liegen in portal-dialog.css
   (gemeinsam mit dem Admin-Portal, unscoped). Kundenspezifische Overrides
   würden hier stehen. */

/* Flash-Alert-Varianten (Ergänzung zu .alert--brand/--success/--info) */
.alert--warning{background:var(--color-warning-soft);border-color:#f4d179}
.alert--warning .alert__ic{color:#8a5a08}
.alert--danger{background:var(--color-danger-soft);border-color:#f5b3b3}
.alert--danger .alert__ic{color:#a52222}
.flash-stack{margin-bottom:16px}

/* Checkliste an der Aufgabe — hier nur lesend, kein .check aus dem Admin-Handoff verfügbar */
.thread-side{display:flex;flex-direction:column;gap:20px}
.check{display:inline-flex;align-items:center;gap:10px;font-size:14.5px;font-weight:600;color:var(--text-strong)}
.check input{width:18px;height:18px;accent-color:var(--color-primary)}
.checklist__row{display:flex;align-items:flex-start;gap:8px;padding:11px 16px}
.checklist__row+.checklist__row{border-top:1px solid var(--portal-border)}
.checklist__row .check{flex:1;min-width:0;align-items:flex-start}
.checklist__row .check span{overflow-wrap:anywhere;white-space:pre-wrap}
.checklist__row--done .check span{color:var(--text-muted);text-decoration:line-through}