/*
  workspace-bento-chat-ansicht.css — KI-Chat im neuen Menü: Begrüßung wie im Firmen-AIOS, Liste rechts, unter 1000 px hinter einem Knopf.
  Kurzbeschreibung (für Laien): Ralph, 07.11.2026. Greift nur im neuen Menü (html.wb-menue-modus) auf der Chat-Seite (html.ws-bento-chat).
  Farben und Schrift nur aus den Bento-/Marken-Variablen (hell und dunkel), keine farbigen Seitenstreifen. Skript: workspace-bento-chat-ansicht.js.
*/
/* ── Begrüßung: groß, mittig, Unterzeile leise (Maße wie im Firmen-AIOS: 40 px Luft oben, Überschrift 24 px) ── */
.wbc-begr { display: none; }
:root.wb-menue-modus.ws-bento-chat #chatMessages.wbc-leer > .wbc-begr { display: block; text-align: center; padding: 40px 10px 10px; }
:root.wb-menue-modus.ws-bento-chat #chatMessages.wbc-leer > .msg:has(#welcomeBubble) { display: none; }
.wbc-begr h2 { margin: 0 0 8px; font: 600 24px/1.25 var(--marke-schrift); color: var(--wb-text); letter-spacing: 0; }
.wbc-begr p { margin: 0 0 20px; font: 400 15px/1.55 var(--marke-schrift); color: var(--wb-leise); }

/* ── „+ Neue Unterhaltung“ oben in der Liste: Plus-Zeichen vor der Beschriftung ── */
:root.wb-menue-modus.ws-bento-chat #convList > .conv-item:not([data-conv-id]) .conv-item-name::before {
  content: "+"; display: inline-block; margin-right: 8px; font-weight: 700; color: var(--wbm-f, var(--wb-text)); }

/* ── Knopf für die Liste: nur unter 1000 px sichtbar ── */
.wbc-liste-knopf { display: none; }
@media (max-width: 999px) {
  :root.wb-menue-modus.ws-bento-chat:not(.n1):not(.n2) .app-shell { grid-template-columns: minmax(0, 1fr); grid-template-rows: 0 minmax(0, 1fr); padding-left: 12px; padding-right: 12px; position: relative; }
  :root.wb-menue-modus.ws-bento-chat:not(.n1):not(.n2) .app-shell > .app-main { grid-column: 1; grid-row: 2; position: relative; }
  :root.wb-menue-modus.ws-bento-chat:not(.n1):not(.n2) .app-shell > #convSidebar { display: none !important; grid-column: 1; grid-row: 2; position: absolute; z-index: 6; left: 12px; right: 12px; top: 44px; bottom: 0;
    margin: 0; padding: 8px 4px 40px; border: 0; background: var(--wb-karte, var(--marke-flaeche)); overflow: auto; }
  :root.wbc-liste-offen.wb-menue-modus.ws-bento-chat:not(.n1):not(.n2) .app-shell > #convSidebar { display: flex !important; }
  :root.wb-menue-modus.ws-bento-chat .wbc-liste-knopf { display: inline-flex; align-items: center; gap: 6px; align-self: flex-end; flex: none; margin: 0 0 8px; height: 34px; padding: 0 14px 0 10px;
    border: 0; border-radius: var(--marke-r-pill); background: var(--wb-weich); color: var(--wb-text); font: 600 13px var(--marke-schrift); cursor: pointer; }
  :root.wb-menue-modus.ws-bento-chat .wbc-liste-knopf svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
  :root.wb-menue-modus.ws-bento-chat .wbc-liste-knopf:hover { background: color-mix(in srgb, var(--wb-text) 10%, var(--wb-weich)); }
  :root.wb-menue-modus.ws-bento-chat #chatMain { padding-top: 0; }
  .wbc-begr h2 { font-size: 19px; }
  :root.wb-menue-modus.ws-bento-chat #chatMessages.wbc-leer > .wbc-begr { padding: 18px 4px 6px; }
  :root.wb-menue-modus.ws-bento-chat #wbcNeu.wbc-plus { left: 8px; bottom: 6px; }   /* „+“ unten links in der Liste, nicht angeschnitten */
}

/* ── Vorschläge und Gedächtnis-Knopf unter der Begrüßung (Bausteine .wbck-chips aus workspace-bento-chat.css) ── */
.wbc-begr .wbck-chips { margin: 0 auto 8px; max-width: 640px; }
.wbc-begr .wbc-gd button { border-color: transparent; background: transparent; color: var(--wb-leise); font-size: 12px; }
.wbc-begr .wbc-gd button:hover { background: var(--wb-weich); color: var(--wb-text); }