/* KI-Chat der Vorführung (Prompt 149). Farben nur aus dem Siegel (Variablen aus site.css). */
.chat-seite{padding-block:48px 72px}
.chat-titel{font-size:clamp(34px,5vw,56px);margin:6px 0 14px}
.chat-branchen{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0 18px}
.chat-branche{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:2px solid var(--line);text-decoration:none;font-weight:600;background:var(--surface)}
.chat-branche[aria-current="page"]{background:var(--ink);color:var(--ink-fg);border-color:var(--ink)}

.chat-fenster{max-width:760px;background:var(--surface);border:2px solid var(--ink);border-radius:20px;overflow:hidden;box-shadow:0 10px 30px rgba(15,51,36,.12)}
.chat-kopf{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 18px;background:var(--ink);color:var(--ink-fg)}
.chat-kopf h2{font-size:24px;color:inherit}
.chat-ki-marke{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--gold);color:var(--logo-gruen)}

.chat-verlauf{display:flex;flex-direction:column;gap:12px;height:min(52vh,460px);min-height:260px;overflow-y:auto;padding:18px;background:var(--paper);scroll-behavior:smooth}
.chat-blase{max-width:88%;padding:10px 14px;border-radius:16px;line-height:1.5;overflow-wrap:anywhere}
.chat-bot{align-self:flex-start;background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.chat-ich{align-self:flex-end;background:var(--gruen);color:#fff;border-bottom-right-radius:4px}
.chat-hinweis{align-self:center;max-width:96%;font-size:14px;color:var(--muted);text-align:center}

.chat-tippt{display:flex;gap:5px;padding:0 18px 10px;background:var(--paper)}
.chat-tippt[hidden]{display:none}
.chat-tippt i{width:9px;height:9px;border-radius:50%;background:var(--brass);animation:chat-punkt 1.2s infinite ease-in-out}
.chat-tippt i:nth-of-type(2){animation-delay:.2s}
.chat-tippt i:nth-of-type(3){animation-delay:.4s}
@keyframes chat-punkt{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-4px)}}

.chat-fragen{list-style:none;margin:0;padding:12px 18px;display:flex;flex-wrap:wrap;gap:8px;border-top:1px solid var(--line)}
.chat-frage{min-height:44px;padding:6px 14px;border-radius:999px;border:2px solid var(--brass);background:var(--surface);color:var(--fg);font-weight:600;font-size:15px;cursor:pointer}
.chat-frage:hover{background:var(--brass-soft)}
.chat-frage-bestellen{border-color:var(--gurke)}
.chat-frage[disabled]{opacity:.55;cursor:wait}

.chat-form{display:flex;gap:10px;padding:12px 18px 14px;border-top:1px solid var(--line);position:relative}
.chat-form input[type=text]{flex:1;min-width:0;min-height:48px;padding:0 14px;border-radius:12px;border:2px solid var(--line);background:var(--surface);color:var(--fg);font:inherit;font-size:16px}
.chat-senden{flex:none}
.chat-falle{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.chat-datenschutz{padding:0 18px 16px;font-size:13px;color:var(--muted);line-height:1.5}
.chat-fuss{max-width:760px;margin-top:16px;font-size:14px;color:var(--muted)}

.chat-vorschlag{align-self:stretch;border:2px solid var(--gurke);border-radius:16px;background:var(--surface);padding:14px 16px}
.chat-vorschlag h3{font-size:22px;margin-bottom:8px}
.chat-vorschlag ul{list-style:none;margin:0 0 8px;padding:0}
.chat-vorschlag li{display:flex;justify-content:space-between;gap:12px;padding:4px 0;border-bottom:1px dashed var(--line)}
.chat-vorschlag .summe{display:flex;justify-content:space-between;font-weight:700;margin:8px 0}
.chat-vorschlag .klein{font-size:14px;color:var(--muted);margin-bottom:10px}

.visuell-versteckt{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (max-width:560px){
  .chat-seite{padding-block:28px 56px}
  .chat-verlauf{height:min(58vh,440px)}
  .chat-blase{max-width:94%}
  .chat-form{flex-direction:column}
  .chat-senden{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .chat-verlauf{scroll-behavior:auto}
  .chat-tippt i{animation:none;opacity:.7}
}