/* KI-Assistent – Template-Platzhalter #$KI_ASSISTENT#
   Farbe kommt aus der FHKI-Konfiguration des Marktes (--kia-c, gesetzt per JS); Fallback dunkelblau. */
.kiaPlaceholder, .kia_float { --kia-c: #2a5d84; --kia-ink: #1d1d1f; --kia-line: #e3e5ea; --kia-soft: #f5f6f8; --kia-radius: 16px; font-size: 15px; line-height: 1.45; color: var(--kia-ink); }

/* Fenster (gemeinsam für inline und floating) */
.kia_panel { background: #fff; border-radius: var(--kia-radius); display: none; flex-direction: column; overflow: hidden; box-sizing: border-box; }
.kia_panel.open { display: flex; }
.kia_head { background: var(--kia-c); color: #fff; padding: 10px 14px; display: flex; align-items: center; gap: 10px; flex: 0 0 auto; }
/* Titel einzeilig: ein langer Titel wird gekürzt statt die Kopfzeile auf zwei Zeilen zu ziehen (voller Text im Tooltip) */
.kia_head b { flex: 1; min-width: 0; font-size: 15px; font-weight: 600; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.kia_head button { background: transparent; border: 0; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; padding: 4px 6px; opacity: .9; margin: 0; width: auto; min-width: 0; }
.kia_msgs { flex: 1 1 auto; min-height: 150px; overflow-y: auto; padding: 14px; background: var(--kia-soft); display: flex; flex-direction: column; gap: 10px; }
.kia_m { max-width: 88%; padding: 10px 13px; border-radius: 14px; word-wrap: break-word; }
.kia_m p { margin: 0 0 6px; } .kia_m p:last-child { margin: 0; }
.kia_m ul { margin: 4px 0 6px 18px; padding: 0; list-style: disc; } .kia_m li { margin: 0; }
.kia_m a { color: var(--kia-c); text-decoration: underline; }
.kia_m.user { align-self: flex-end; background: var(--kia-c); color: #fff; border-bottom-right-radius: 4px; }
.kia_m.user a { color: #fff; }
.kia_m.bot { align-self: flex-start; background: #fff; border: 1px solid var(--kia-line); border-bottom-left-radius: 4px; }
.kia_m.err { align-self: flex-start; background: #fdecec; color: #8a1f1f; border: 1px solid #f3c2c2; }
.kia_typing span { display: inline-block; width: 7px; height: 7px; margin: 0 2px; background: #9aa0a6; border-radius: 50%; animation: kia-bounce 1.2s infinite; }
.kia_typing span:nth-child(2) { animation-delay: .2s; } .kia_typing span:nth-child(3) { animation-delay: .4s; }
@keyframes kia-bounce { 0%, 80%, 100% { transform: translateY(0); opacity: .5; } 40% { transform: translateY(-5px); opacity: 1; } }
/* Schaltflächen unter dem Verlauf: Fragen zuerst, die Aktionen (Termin, Bestellstatus, Beratung, Rückruf) in einer eigenen Zeile.
   Der Block nimmt höchstens ein gutes Drittel des Fensters ein und rollt dann selbst, damit der Verlauf lesbar bleibt. */
.kia_sugg { display: flex; flex-wrap: wrap; gap: 6px; padding: 2px 14px 10px; background: var(--kia-soft); flex: 0 0 auto; max-height: 38%; overflow-y: auto; }
.kia_sugg:empty { display: none; }
.kia_sugg::after { content: ''; flex-basis: 100%; height: 0; order: 1; }
.kia_sugg button { background: #fff; border: 1px solid var(--kia-c); color: var(--kia-c); border-radius: 999px; padding: 5px 10px; font-size: 12.5px; cursor: pointer; margin: 0; width: auto; min-width: 0; line-height: 1.3; text-align: left; }
.kia_sugg button.kia_booking { order: 2; flex: 1 1 auto; text-align: center; white-space: nowrap; background: var(--kia-soft); border-color: #c5ccd6; color: var(--kia-ink); }
.kia_sugg button.kia_booking:hover { border-color: var(--kia-c); }
.kia_sugg button:hover { background: var(--kia-c); color: #fff; }
.kia_sugg button.kia_follow { border-style: dashed; }
/* KI-Kennzeichnung: Abzeichen in der Kopfzeile und Hinweiszeile direkt darunter, immer sichtbar */
.kia_head .kia_ai_badge { flex: 0 0 auto; font-size: 11px; font-weight: 700; letter-spacing: .04em; line-height: 1; padding: 4px 6px; border: 1px solid rgba(255,255,255,.85); border-radius: 4px; color: #fff; }
.kia_ai { flex: 0 0 auto; font-size: 12px; line-height: 1.3; padding: 5px 14px; background: #f1f3f5; color: #333; border-bottom: 1px solid #e2e5e9; }
/* Terminvereinbarung: Auswahl-Chips, Datumsfeld und Zusammenfassung in Bot-Blasen */
.kia_opts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.kia_opts button { background: #fff; border: 1px solid var(--kia-c); color: var(--kia-c); border-radius: 999px; padding: 6px 11px; font-size: 13px; cursor: pointer; margin: 0; width: auto; min-width: 0; line-height: 1.3; }
.kia_opts button:hover, .kia_opts button.sel { background: var(--kia-c); color: #fff; }
.kia_opts button.kia_sec { border-color: #c5c9d0; color: #4b5563; } .kia_opts button.kia_sec:hover { background: #e5e7eb; color: #1d1d1f; }
.kia_opts button.kia_primary { background: var(--kia-c); color: #fff; font-weight: 600; }
.kia_opts button:disabled { opacity: .5; cursor: default; }
.kia_m input[type="date"] { font: inherit; font-size: 14px; border: 1px solid #cfd3da; border-radius: 8px; padding: 6px 9px; margin-top: 8px; width: auto; min-width: 0; height: auto; box-sizing: border-box; }
.kia_sum { margin: 6px 0 0; padding: 0; } .kia_sum div { display: flex; gap: 8px; padding: 2px 0; border-bottom: 1px dashed var(--kia-line); font-size: 14px; }
.kia_sum div:last-child { border-bottom: 0; } .kia_sum span:first-child { color: #6b7280; min-width: 92px; flex-shrink: 0; }
.kia_m small { display: block; color: #6b7280; font-size: 12px; margin-top: 6px; }
/* Produktkarten unter einer Antwort (Live-Treffer des Webshops) */
.kia_cards { display: flex; flex-direction: column; gap: 6px; margin-top: 8px; }
.kia_card { display: flex; gap: 10px; align-items: center; border: 1px solid var(--kia-line); border-radius: 10px; padding: 7px 9px; text-decoration: none !important; color: inherit !important; background: #fafafa; }
.kia_card:hover { border-color: var(--kia-c); background: #fff; }
.kia_card img { width: 56px; height: 56px; object-fit: contain; flex-shrink: 0; border-radius: 6px; background: #fff; }
.kia_card_b { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 13px; }
.kia_card_b b { font-size: 13px; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kia_card_m { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.kia_price { font-weight: 600; }
.kia_badge { font-size: 11px; border-radius: 999px; padding: 1px 7px; background: #e5e7eb; color: #374151; }
.kia_badge.kia_av_vorraetig { background: #dcfce7; color: #166534; }
.kia_badge.kia_av_lieferant { background: #fef3c7; color: #92400e; }
.kia_badge.kia_av_nicht_vorraetig { background: #fee2e2; color: #991b1b; }
.kia_card_go { color: var(--kia-c); font-size: 12px; }
/* Warenkorb aus der Produktkarte */
.kia_cart { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: -2px 0 4px 2px; font-size: 12px; }
.kia_cart select { font: inherit; font-size: 12px; border: 1px solid #cfd3da; border-radius: 8px; padding: 4px 6px; max-width: 100%; height: auto; margin: 0; }
.kia_cart button { background: var(--kia-c); color: #fff; border: 0; border-radius: 999px; padding: 5px 11px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; margin: 0; width: auto; min-width: 0; }
.kia_cart button:disabled { opacity: .5; cursor: default; }
.kia_cart_note { color: #166534; } .kia_cart_note a { color: var(--kia-c); text-decoration: underline; }
/* Bewertung einer Antwort */
.kia_rate { display: flex; align-items: center; gap: 4px; margin-top: 6px; }
.kia_rate button { background: transparent; border: 1px solid transparent; border-radius: 999px; padding: 1px 6px; font-size: 14px; line-height: 1.4; cursor: pointer; margin: 0; width: auto; min-width: 0; opacity: .55; filter: grayscale(1); }
.kia_rate button:hover { opacity: 1; filter: none; border-color: var(--kia-line); }
.kia_rate button.sel { opacity: 1; filter: none; border-color: var(--kia-c); background: #fff; }
.kia_rate.done button:not(.sel) { display: none; }
.kia_thanks { font-size: 11px; color: #6b7280; }
.kia_form { display: flex; gap: 8px; padding: 10px; border-top: 1px solid var(--kia-line); background: #fff; margin: 0; }
.kia_form textarea { flex: 1; resize: none; border: 1px solid #cfd3da; border-radius: 10px; padding: 9px 11px; font: inherit; max-height: 120px; outline: none; margin: 0; width: auto; min-height: 0; box-sizing: border-box; }
.kia_form textarea:focus { border-color: var(--kia-c); box-shadow: none; }
.kia_form button { background: var(--kia-c); color: #fff; border: 0; border-radius: 10px; padding: 0 16px; font: inherit; font-weight: 600; cursor: pointer; margin: 0; width: auto; min-width: 0; }
.kia_form button.kia_tool { background: #fff; border: 1px solid #cfd3da; color: #374151; padding: 0 9px; font-size: 16px; }
.kia_form button.kia_tool:hover { border-color: var(--kia-c); }
.kia_form button.kia_mic.on { border-color: #991b1b; background: #fee2e2; }
.kia_photo_chip { align-self: center; font-size: 12px; background: #eef4f9; border: 1px solid var(--kia-line); border-radius: 999px; padding: 3px 8px; cursor: pointer; white-space: nowrap; }
.kia_form button:disabled { opacity: .5; cursor: default; }
.kia_foot { flex: 0 0 auto; font-size: 11px; line-height: 1.3; color: #6b7280; padding: 4px 12px 8px; background: #fff; text-align: center; }
.kia_foot a { color: #6b7280; text-decoration: underline; }

/* Inline: Block im Seiteninhalt */
.kia-inline .kia_panel { height: 640px; max-height: 85vh; border: 1px solid var(--kia-line); box-shadow: 0 4px 18px rgba(0, 0, 0, .08); margin: 0 0 24px; }
.kia-inline .kia_head .kia_close { display: none; }

/* Unsichtbar, bis KiAssistent.ashx?p=health den KI-Server als erreichbar meldet (ki-assistent.js) */
.kia_hidden { display: none !important; }

/* Floating: Button unten rechts (oder links), Fenster darüber */
.kia_float { position: fixed; bottom: var(--kia-bottom, 20px); z-index: 99000; font-family: inherit; } /* unter dem Cookie-Panel (.cookieAcceptanceOverlay, z-index 99996), über dem Seiteninhalt */ /* --kia-bottom setzt ki-assistent.js, wenn in der Ecke ein Siegel liegt (Trusted Shops, Ekomi) */
.kia_float.kia_pos_right { right: 20px; } .kia_float.kia_pos_left { left: 20px; }
.kia_float .kia_btn { width: 60px; height: 60px; border-radius: 50%; border: 0; background: var(--kia-c); color: #fff; box-shadow: 0 6px 20px rgba(0, 0, 0, .25); cursor: pointer; display: flex; align-items: center; justify-content: center; transition: transform .15s; margin: 0; padding: 0; min-width: 0; }
.kia_float .kia_btn:hover { transform: scale(1.06); }
.kia_float .kia_btn svg { width: 28px; height: 28px; fill: #fff; }
.kia_float .kia_panel { position: absolute; bottom: 72px; width: 420px; max-width: calc(100vw - 40px); height: 680px; max-height: calc(100vh - 92px - var(--kia-bottom, 20px)); box-shadow: 0 12px 40px rgba(0, 0, 0, .28); }
.kia_float.kia_pos_right .kia_panel { right: 0; } .kia_float.kia_pos_left .kia_panel { left: 0; }
@media (max-width: 480px) {
	.kia_float .kia_panel { position: fixed; bottom: 0; left: 0; right: 0; width: 100vw; max-width: 100vw; height: 100vh; max-height: 100vh; border-radius: 0; }
	.kia_float .kia_panel.open ~ .kia_btn { display: none; }
	.kia-inline .kia_panel { height: 70vh; }
}