/* Glasshop KI-Copilot – Chat-Widget im „Glas“-Look (Schwarz + Marken-Cyan wie Header/Navigation der Seite).
 * Farben: Einstellungen → sonst Markenfarbe des Themes (Elementor-Variablen).
 * Alle Selektoren beginnen mit `.gkc-root`; Buttons/Textarea werden zurückgesetzt,
 * weil das Theme (Hello Elementor + Custom CSS) globale button-Stile setzt.
 */
.gkc-root {
	--gkc-accent: var(--gkc-color-primary, var(--e-global-color-9b41c7c, var(--e-global-color-primary, #40d3e0)));
	--gkc-on-accent: var(--gkc-color-text, #000);
	--gkc-accent-deep: color-mix(in srgb, var(--gkc-accent) 70%, #00424a);
	--gkc-accent-soft: color-mix(in srgb, var(--gkc-accent) 14%, #fff);
	--gkc-link: color-mix(in srgb, var(--gkc-accent) 45%, #003a40);
	--gkc-ink: #0b1417;
	--gkc-ink-2: #14272d;
	--gkc-text: #16212a;
	--gkc-muted: #60707b;
	--gkc-border: rgba(15, 35, 45, .10);
	--gkc-glass: rgba(255, 255, 255, .82);
	--gkc-radius: 22px;
	--gkc-ease: cubic-bezier(.2, .9, .25, 1.15);
	--gkc-shadow: 0 24px 60px -12px rgba(8, 28, 36, .38), 0 8px 20px -8px rgba(8, 28, 36, .22);
	font-family: var(--e-global-typography-text-font-family, "Titillium Web"), system-ui, sans-serif;
	font-size: 15px;
	line-height: 1.55;
	color: var(--gkc-text);
	-webkit-font-smoothing: antialiased;
}
.gkc-root *, .gkc-root *::before, .gkc-root *::after { box-sizing: border-box; }
.gkc-root button, .gkc-root textarea {
	all: unset; box-sizing: border-box; font-family: inherit; font-size: inherit; line-height: inherit; color: inherit;
}
.gkc-root button { cursor: pointer; -webkit-tap-highlight-color: transparent; }
.gkc-root [hidden], .gkc-root button[hidden] { display: none !important; }
.gkc-root svg { display: block; }

/* ================= Launcher ================= */
.gkc-root button.gkc-launcher {
	position: fixed; right: 24px; bottom: 24px; z-index: 2147483000;
	display: inline-flex; align-items: center; gap: 12px; max-width: calc(100vw - 24px);
	padding: 9px 22px 9px 9px; border-radius: 999px; overflow: visible;
	background: linear-gradient(135deg, var(--gkc-ink-2), var(--gkc-ink) 60%);
	color: #fff; text-align: left;
	box-shadow: var(--gkc-shadow), inset 0 1px 0 rgba(255, 255, 255, .12), 0 0 0 1px rgba(64, 211, 224, .35);
	transition: transform .35s var(--gkc-ease), box-shadow .35s ease;
	animation: gkc-launcher-in .7s var(--gkc-ease) .4s both;
}
.gkc-root button.gkc-launcher:hover {
	transform: translateY(-3px) scale(1.02);
	box-shadow: var(--gkc-shadow), inset 0 1px 0 rgba(255, 255, 255, .16), 0 0 0 1px var(--gkc-accent), 0 10px 40px -6px color-mix(in srgb, var(--gkc-accent) 60%, transparent);
}
.gkc-root button.gkc-launcher:active { transform: translateY(-1px) scale(.98); }
.gkc-root button.gkc-launcher:focus-visible { outline: 3px solid var(--gkc-accent); outline-offset: 4px; }
@keyframes gkc-launcher-in { from { opacity: 0; transform: translateY(24px) scale(.85); } }

/* Glanz, der regelmäßig über das „Glas“ läuft */
.gkc-root .gkc-launcher-shine { position: absolute; inset: 0; border-radius: inherit; overflow: hidden; pointer-events: none; }
.gkc-root .gkc-launcher-shine::before {
	content: ""; position: absolute; top: -50%; bottom: -50%; left: -40%; width: 30%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .28), transparent);
	transform: skewX(-20deg); animation: gkc-shine 5.5s ease-in-out 1.5s infinite;
}
@keyframes gkc-shine { 0%, 70% { left: -40%; } 100% { left: 130%; } }

.gkc-root .gkc-launcher-icon {
	position: relative; flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	background: radial-gradient(circle at 30% 25%, #fff 0, color-mix(in srgb, var(--gkc-accent) 85%, #fff) 35%, var(--gkc-accent-deep) 100%);
	color: var(--gkc-ink); box-shadow: 0 0 22px -2px color-mix(in srgb, var(--gkc-accent) 80%, transparent);
}
.gkc-root .gkc-launcher-icon svg { width: 24px; height: 24px; animation: gkc-sparkle 3.2s ease-in-out infinite; }
@keyframes gkc-sparkle { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(12deg) scale(1.08); } }
/* pulsierender Halo */
.gkc-root .gkc-launcher-icon::before, .gkc-root .gkc-launcher-icon::after {
	content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--gkc-accent);
	animation: gkc-halo 2.8s ease-out infinite; pointer-events: none;
}
.gkc-root .gkc-launcher-icon::after { animation-delay: 1.4s; }
@keyframes gkc-halo { from { opacity: .7; transform: scale(1); } to { opacity: 0; transform: scale(1.9); } }

.gkc-root .gkc-launcher-text { display: flex; flex-direction: column; line-height: 1.2; }
.gkc-root .gkc-launcher-main { font-weight: 700; font-size: 15px; letter-spacing: .01em; }
.gkc-root .gkc-launcher-sub { display: flex; align-items: center; gap: 6px; margin-top: 3px; font-size: 12px; color: rgba(255, 255, 255, .7); }
.gkc-root .gkc-launcher-short { display: none; font-weight: 700; }
.gkc-root .gkc-dot { width: 7px; height: 7px; border-radius: 50%; background: #3ddc84; box-shadow: 0 0 0 0 rgba(61, 220, 132, .6); animation: gkc-live 2s infinite; }
@keyframes gkc-live { 70% { box-shadow: 0 0 0 7px rgba(61, 220, 132, 0); } 100% { box-shadow: 0 0 0 0 rgba(61, 220, 132, 0); } }

/* Teaser-Sprechblase */
.gkc-root .gkc-teaser {
	position: fixed; right: 24px; bottom: 92px; z-index: 2147483000; width: min(290px, calc(100vw - 48px));
	padding: 14px 38px 14px 16px; border-radius: 18px 18px 6px 18px;
	background: var(--gkc-glass); -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6);
	border: 1px solid rgba(255, 255, 255, .7); box-shadow: var(--gkc-shadow);
	font-size: 14px; color: var(--gkc-text); cursor: pointer;
	animation: gkc-pop .55s var(--gkc-ease) both;
}
.gkc-root .gkc-teaser[hidden] { display: none; }
.gkc-root .gkc-teaser strong { display: block; margin-bottom: 2px; }
.gkc-root button.gkc-teaser-close {
	position: absolute; top: 8px; right: 8px; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%;
	color: var(--gkc-muted); font-size: 16px; line-height: 1;
}
.gkc-root button.gkc-teaser-close:hover { background: rgba(0, 0, 0, .06); color: var(--gkc-text); }
@keyframes gkc-pop { from { opacity: 0; transform: translateY(14px) scale(.9); } }

.gkc-root.is-open button.gkc-launcher, .gkc-root.is-open .gkc-teaser { display: none; }
/* Cookie-Banner (Complianz) offen: Launcher ausblenden, damit dessen Buttons frei bleiben. */
body:has(.cmplz-cookiebanner.cmplz-show) .gkc-root:not(.is-open) button.gkc-launcher,
body:has(.cmplz-cookiebanner.cmplz-show) .gkc-root .gkc-teaser { display: none; }
/* Konfigurator (Modal, z-index 10000) offen: Preis & Warenkorb stehen unten rechts → nach links. */
body.configurator_is_opened .gkc-root button.gkc-launcher,
body.configurator_is_opened .gkc-root .gkc-panel { right: auto; left: 24px; }
body.configurator_is_opened .gkc-root .gkc-panel { transform-origin: bottom left; }
body.configurator_is_opened .gkc-root .gkc-teaser { display: none; }

/* Proaktive Hilfe im Konfigurator (links über dem Button, über dem Konfigurator-Modal) */
.gkc-root .gkc-nudge {
	position: fixed; left: 24px; bottom: 96px; z-index: 2147483000; display: flex; gap: 12px; width: min(340px, calc(100vw - 48px));
	padding: 16px; border-radius: 18px 18px 18px 6px;
	background: var(--gkc-glass); -webkit-backdrop-filter: blur(16px) saturate(1.6); backdrop-filter: blur(16px) saturate(1.6);
	border: 1px solid rgba(255, 255, 255, .7); box-shadow: var(--gkc-shadow), 0 0 0 1px rgba(64, 211, 224, .35);
	animation: gkc-pop .55s var(--gkc-ease) both;
}
.gkc-root .gkc-nudge[hidden] { display: none; }
.gkc-root .gkc-nudge-icon {
	flex: none; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px;
	background: linear-gradient(135deg, var(--gkc-ink-2), var(--gkc-ink)); color: var(--gkc-accent);
}
.gkc-root .gkc-nudge-icon svg { width: 20px; height: 20px; animation: gkc-sparkle 3.2s ease-in-out infinite; }
.gkc-root .gkc-nudge p { margin: 0 0 10px; font-size: 14.5px; font-weight: 600; color: var(--gkc-text); line-height: 1.4; }
.gkc-root .gkc-nudge-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.gkc-root button.gkc-nudge-yes {
	padding: 8px 14px; border-radius: 999px; font-weight: 700; font-size: 13.5px;
	background: linear-gradient(135deg, color-mix(in srgb, var(--gkc-accent) 75%, #fff), var(--gkc-accent)); color: var(--gkc-on-accent);
}
.gkc-root button.gkc-nudge-no { padding: 8px 10px; border-radius: 999px; font-size: 13px; color: var(--gkc-muted); }
.gkc-root button.gkc-nudge-no:hover { color: var(--gkc-text); background: rgba(0, 0, 0, .05); }
@media (max-width: 600px) { .gkc-root .gkc-nudge { left: 14px; bottom: 76px; } }

/* ================= Panel ================= */
.gkc-root .gkc-panel {
	position: fixed; right: 24px; bottom: 24px; z-index: 2147483001;
	width: min(410px, calc(100vw - 48px)); height: min(680px, calc(100vh - 48px));
	display: none; flex-direction: column; overflow: hidden; transform-origin: bottom right;
	background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(246, 250, 251, .9));
	-webkit-backdrop-filter: blur(24px) saturate(1.5); backdrop-filter: blur(24px) saturate(1.5);
	border: 1px solid rgba(255, 255, 255, .6); border-radius: var(--gkc-radius);
	box-shadow: var(--gkc-shadow), 0 0 0 1px var(--gkc-border);
}
.gkc-root.is-open .gkc-panel { display: flex; animation: gkc-open .5s var(--gkc-ease) both; }
.gkc-root.is-closing .gkc-panel { animation: gkc-close .22s ease-in both; }
@keyframes gkc-open { from { opacity: 0; transform: translateY(20px) scale(.88); filter: blur(4px); } }
@keyframes gkc-close { to { opacity: 0; transform: translateY(14px) scale(.94); } }

/* Header */
.gkc-root .gkc-header {
	position: relative; display: flex; align-items: center; gap: 12px; padding: 16px 14px 16px 16px; overflow: hidden;
	background:
		radial-gradient(120% 140% at 100% 0%, color-mix(in srgb, var(--gkc-accent) 35%, transparent) 0, transparent 55%),
		linear-gradient(135deg, var(--gkc-ink-2), var(--gkc-ink));
	color: #fff;
}
.gkc-root .gkc-header::before { /* Glasreflex */
	content: ""; position: absolute; top: -60%; left: -30%; width: 40%; height: 220%;
	background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .10), transparent);
	transform: rotate(18deg); animation: gkc-reflex 7s ease-in-out infinite;
}
.gkc-root .gkc-header::after { /* Cyan-Linie wie im Seiten-Header */
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: linear-gradient(90deg, transparent, var(--gkc-accent), transparent);
	background-size: 200% 100%; animation: gkc-line 4s linear infinite;
}
@keyframes gkc-reflex { 0%, 60% { left: -40%; } 100% { left: 120%; } }
@keyframes gkc-line { from { background-position: 100% 0; } to { background-position: -100% 0; } }

.gkc-root .gkc-avatar {
	position: relative; flex: none; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 14px;
	background: radial-gradient(circle at 30% 25%, #fff 0, color-mix(in srgb, var(--gkc-accent) 85%, #fff) 35%, var(--gkc-accent-deep) 100%);
	color: var(--gkc-ink); box-shadow: 0 0 24px -4px var(--gkc-accent);
}
.gkc-root .gkc-avatar svg { width: 24px; height: 24px; }
.gkc-root .gkc-avatar .gkc-dot { position: absolute; right: -2px; bottom: -2px; width: 11px; height: 11px; border: 2px solid var(--gkc-ink); }
.gkc-root .gkc-header-title { position: relative; flex: 1; min-width: 0; }
.gkc-root .gkc-header-title strong { display: block; font-size: 16.5px; font-weight: 700; letter-spacing: .01em; }
.gkc-root .gkc-header-meta { display: flex; align-items: center; gap: 8px; margin-top: 2px; font-size: 12px; color: rgba(255, 255, 255, .72); }
.gkc-root .gkc-badge {
	padding: 1px 8px; border-radius: 999px; font-size: 10.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase;
	color: var(--gkc-ink); background: var(--gkc-accent);
}
.gkc-root .gkc-header-actions { position: relative; display: flex; gap: 4px; }
.gkc-root button.gkc-icon-btn {
	display: grid; place-items: center; width: 36px; height: 36px; border-radius: 12px; color: rgba(255, 255, 255, .85);
	transition: background .2s ease, transform .2s ease, color .2s ease;
}
.gkc-root button.gkc-icon-btn:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.gkc-root button.gkc-icon-btn:focus-visible { outline: 2px solid var(--gkc-accent); outline-offset: 1px; }
.gkc-root button.gkc-icon-btn svg { width: 19px; height: 19px; }
.gkc-root button.gkc-reset:hover svg { transform: rotate(-180deg); transition: transform .5s var(--gkc-ease); }
.gkc-root button.gkc-close:hover svg { transform: rotate(90deg); transition: transform .3s var(--gkc-ease); }

/* Nachrichten */
.gkc-root .gkc-messages {
	flex: 1; overflow-y: auto; padding: 18px 16px 10px; display: flex; flex-direction: column; gap: 12px;
	overscroll-behavior: contain;
	background:
		radial-gradient(90% 60% at 100% 0%, color-mix(in srgb, var(--gkc-accent) 9%, transparent), transparent 70%),
		radial-gradient(70% 50% at 0% 100%, color-mix(in srgb, var(--gkc-accent) 7%, transparent), transparent 70%);
	scrollbar-width: thin; scrollbar-color: rgba(0, 0, 0, .15) transparent;
}
.gkc-root .gkc-row { display: flex; align-items: flex-end; gap: 8px; animation: gkc-msg-in .45s var(--gkc-ease) both; }
.gkc-root .gkc-row.is-user { justify-content: flex-end; }
@keyframes gkc-msg-in { from { opacity: 0; transform: translateY(12px) scale(.97); } }
.gkc-root .gkc-mini-avatar {
	flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 10px;
	background: linear-gradient(135deg, var(--gkc-ink-2), var(--gkc-ink)); color: var(--gkc-accent);
}
.gkc-root .gkc-mini-avatar svg { width: 16px; height: 16px; }
.gkc-root .gkc-msg { max-width: 84%; padding: 11px 14px; border-radius: 18px; overflow-wrap: anywhere; font-size: 14.5px; }
.gkc-root .gkc-msg p { margin: 0 0 .6em; }
.gkc-root .gkc-msg p:last-child, .gkc-root .gkc-msg ul:last-child { margin-bottom: 0; }
.gkc-root .gkc-msg ul { margin: .1em 0 .6em; padding-left: 0; list-style: none; }
.gkc-root .gkc-msg li { position: relative; padding-left: 16px; margin: 3px 0; }
.gkc-root .gkc-msg li::before { content: ""; position: absolute; left: 2px; top: .62em; width: 6px; height: 6px; border-radius: 2px; background: var(--gkc-accent); transform: rotate(45deg); }
.gkc-root .gkc-msg strong { font-weight: 700; }
.gkc-root .gkc-msg a { color: var(--gkc-link); font-weight: 600; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--gkc-accent) 60%, transparent); text-underline-offset: 2px; }
.gkc-root .gkc-msg a:hover { text-decoration-color: currentColor; }
.gkc-root .gkc-msg.is-bot {
	background: #fff; border: 1px solid var(--gkc-border); border-bottom-left-radius: 6px;
	box-shadow: 0 6px 18px -10px rgba(8, 28, 36, .25);
}
.gkc-root .gkc-msg.is-user {
	background: linear-gradient(135deg, color-mix(in srgb, var(--gkc-accent) 80%, #fff), var(--gkc-accent));
	color: var(--gkc-on-accent); border-bottom-right-radius: 6px;
	box-shadow: 0 8px 20px -10px color-mix(in srgb, var(--gkc-accent) 90%, transparent);
}
.gkc-root .gkc-msg.is-user a { color: inherit; }
.gkc-root .gkc-msg.is-error { border-color: #f0c2c2; background: #fff7f7; }
.gkc-root .gkc-sources { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; padding-top: 9px; border-top: 1px dashed var(--gkc-border); }
.gkc-root .gkc-sources-label { width: 100%; font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gkc-muted); }
.gkc-root .gkc-msg a.gkc-source {
	display: inline-flex; align-items: center; gap: 5px; max-width: 100%; padding: 4px 10px; border-radius: 999px;
	background: var(--gkc-accent-soft); color: var(--gkc-link); font-size: 12px; font-weight: 600; text-decoration: none;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: background .2s ease, transform .2s ease;
	animation: gkc-msg-in .4s var(--gkc-ease) both;
}
.gkc-root .gkc-msg a.gkc-source:hover { background: color-mix(in srgb, var(--gkc-accent) 28%, #fff); transform: translateY(-1px); }
.gkc-root .gkc-source svg { width: 12px; height: 12px; flex: none; }

/* Schreib-Indikator & Cursor */
.gkc-root .gkc-typing { display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 2px; }
.gkc-root .gkc-typing span {
	width: 8px; height: 8px; border-radius: 50%;
	background: linear-gradient(135deg, var(--gkc-accent), var(--gkc-accent-deep)); animation: gkc-bounce 1.2s infinite ease-in-out;
}
.gkc-root .gkc-typing span:nth-child(2) { animation-delay: .15s; }
.gkc-root .gkc-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes gkc-bounce { 0%, 60%, 100% { transform: translateY(0); opacity: .45; } 30% { transform: translateY(-6px); opacity: 1; } }
.gkc-root .gkc-caret > :last-child::after {
	content: ""; display: inline-block; width: 7px; height: 1.05em; margin-left: 2px; vertical-align: -2px; border-radius: 2px;
	background: var(--gkc-accent); animation: gkc-blink .9s steps(1) infinite;
}
@keyframes gkc-blink { 50% { opacity: 0; } }

/* Kontext (Konfigurator-Auswahl) */
.gkc-root .gkc-context {
	display: flex; align-items: center; gap: 8px; align-self: center; max-width: 100%; margin: 2px 0;
	padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--gkc-border);
	font-size: 12px; color: var(--gkc-muted); animation: gkc-pop .45s var(--gkc-ease) both;
}
.gkc-root .gkc-context[hidden] { display: none; }
.gkc-root .gkc-context svg { width: 14px; height: 14px; flex: none; color: var(--gkc-accent-deep); }
.gkc-root .gkc-context b { color: var(--gkc-text); font-weight: 600; }

/* Vorschläge */
.gkc-root .gkc-suggestions { display: flex; flex-direction: column; gap: 8px; margin-top: 2px; }
.gkc-root .gkc-suggestions-label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gkc-muted); padding-left: 2px; }
.gkc-root button.gkc-chip {
	position: relative; display: flex; align-items: center; gap: 10px; padding: 11px 14px; border-radius: 14px;
	background: rgba(255, 255, 255, .9); border: 1px solid var(--gkc-border); color: var(--gkc-text);
	font-size: 14px; font-weight: 600; text-align: left; overflow: hidden;
	box-shadow: 0 4px 14px -10px rgba(8, 28, 36, .35);
	transition: transform .3s var(--gkc-ease), border-color .2s ease, box-shadow .3s ease, color .2s ease;
	animation: gkc-msg-in .5s var(--gkc-ease) both; animation-delay: calc(var(--i, 0) * 90ms + 150ms);
}
.gkc-root button.gkc-chip::before { /* Farbverlauf beim Hover */
	content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity .3s ease;
	background: linear-gradient(90deg, var(--gkc-accent-soft), transparent 80%);
}
.gkc-root button.gkc-chip > * { position: relative; }
.gkc-root button.gkc-chip:hover, .gkc-root button.gkc-chip:focus-visible {
	transform: translateX(4px); border-color: color-mix(in srgb, var(--gkc-accent) 70%, transparent); color: var(--gkc-ink);
	box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--gkc-accent) 90%, transparent); background: #fff;
}
.gkc-root button.gkc-chip:hover::before, .gkc-root button.gkc-chip:focus-visible::before { opacity: 1; }
.gkc-root .gkc-chip-icon { flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 9px; background: var(--gkc-accent-soft); color: var(--gkc-accent-deep); }
.gkc-root .gkc-chip-icon svg { width: 15px; height: 15px; }
.gkc-root .gkc-chip-text { flex: 1; }
.gkc-root .gkc-chip-arrow { flex: none; color: var(--gkc-muted); transition: transform .3s var(--gkc-ease), color .2s ease; }
.gkc-root .gkc-chip-arrow svg { width: 16px; height: 16px; }
.gkc-root button.gkc-chip:hover .gkc-chip-arrow { transform: translateX(3px); color: var(--gkc-accent-deep); }

/* Hinweis vor dem ersten Chat */
.gkc-root .gkc-consent {
	position: relative; padding: 18px; border-radius: 18px; background: #fff; border: 1px solid var(--gkc-border);
	box-shadow: 0 10px 30px -18px rgba(8, 28, 36, .4); font-size: 13.5px; animation: gkc-msg-in .5s var(--gkc-ease) .1s both;
}
.gkc-root .gkc-consent-icon {
	display: grid; place-items: center; width: 40px; height: 40px; margin-bottom: 10px; border-radius: 13px;
	background: var(--gkc-accent-soft); color: var(--gkc-accent-deep);
}
.gkc-root .gkc-consent-icon svg { width: 22px; height: 22px; }
.gkc-root .gkc-consent h3 { margin: 0 0 6px; font-size: 16px; font-weight: 700; color: var(--gkc-text); line-height: 1.3; }
.gkc-root .gkc-consent p { margin: 0 0 10px; color: #3b4953; }
.gkc-root .gkc-consent a { color: var(--gkc-link); font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.gkc-root button.gkc-btn {
	position: relative; display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; padding: 11px 20px; border-radius: 999px; overflow: hidden;
	background: linear-gradient(135deg, color-mix(in srgb, var(--gkc-accent) 75%, #fff), var(--gkc-accent));
	color: var(--gkc-on-accent); font-weight: 700;
	box-shadow: 0 10px 24px -10px color-mix(in srgb, var(--gkc-accent) 90%, transparent);
	transition: transform .3s var(--gkc-ease), box-shadow .3s ease;
}
.gkc-root button.gkc-btn:hover { transform: translateY(-2px); box-shadow: 0 14px 28px -10px color-mix(in srgb, var(--gkc-accent) 100%, transparent); }
.gkc-root button.gkc-btn:focus-visible { outline: 2px solid var(--gkc-accent-deep); outline-offset: 3px; }
.gkc-root button.gkc-btn svg { width: 16px; height: 16px; transition: transform .3s var(--gkc-ease); }
.gkc-root button.gkc-btn:hover svg { transform: translateX(3px); }

/* Eingabe */
.gkc-root .gkc-form { padding: 10px 14px 6px; background: transparent; }
.gkc-root .gkc-form[hidden] { display: none; }
.gkc-root .gkc-inputbar {
	display: flex; align-items: flex-end; gap: 8px; padding: 6px 6px 6px 16px; border-radius: 26px;
	background: #fff; border: 1px solid var(--gkc-border); box-shadow: 0 6px 20px -14px rgba(8, 28, 36, .45);
	transition: border-color .2s ease, box-shadow .3s ease;
}
.gkc-root .gkc-inputbar:focus-within {
	border-color: color-mix(in srgb, var(--gkc-accent) 80%, transparent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--gkc-accent) 20%, transparent), 0 10px 26px -14px color-mix(in srgb, var(--gkc-accent) 90%, transparent);
}
.gkc-root textarea.gkc-input {
	flex: 1; min-height: 38px; max-height: 120px; padding: 8px 0; white-space: pre-wrap; overflow-y: auto; color: var(--gkc-text);
}
.gkc-root textarea.gkc-input::placeholder { color: #8a98a2; }
.gkc-root button.gkc-send {
	display: grid; place-items: center; width: 40px; height: 40px; flex: none; border-radius: 50%;
	background: linear-gradient(135deg, var(--gkc-ink-2), var(--gkc-ink)); color: var(--gkc-accent);
	transition: transform .3s var(--gkc-ease), opacity .2s ease, box-shadow .3s ease;
}
.gkc-root button.gkc-send:not(:disabled):hover { transform: scale(1.08) rotate(-8deg); box-shadow: 0 0 0 4px color-mix(in srgb, var(--gkc-accent) 25%, transparent); }
.gkc-root button.gkc-send:disabled { background: #e6ecee; color: #9eacb4; cursor: default; }
.gkc-root button.gkc-send:focus-visible { outline: 3px solid var(--gkc-accent); outline-offset: 2px; }
.gkc-root .gkc-send svg { width: 18px; height: 18px; }
.gkc-root .gkc-send.is-sending svg { animation: gkc-fly .6s ease-in both; }
@keyframes gkc-fly { 50% { transform: translate(14px, -14px); opacity: 0; } 51% { transform: translate(-14px, 14px); opacity: 0; } }

.gkc-root .gkc-footer { display: flex; align-items: center; justify-content: center; gap: 6px; flex-wrap: wrap; padding: 4px 14px 12px; font-size: 11px; line-height: 1.4; color: var(--gkc-muted); text-align: center; }
.gkc-root .gkc-footer a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }
.gkc-root .gkc-footer svg { width: 12px; height: 12px; color: var(--gkc-accent-deep); }

/* ================= Mobil ================= */
@media (max-width: 600px) {
	.gkc-root button.gkc-launcher { right: 14px; bottom: 14px; padding: 7px 18px 7px 7px; gap: 10px; }
	.gkc-root .gkc-launcher-icon { width: 40px; height: 40px; }
	.gkc-root .gkc-launcher-main, .gkc-root .gkc-launcher-sub { display: none; }
	.gkc-root .gkc-launcher-short { display: inline; }
	.gkc-root .gkc-teaser { right: 14px; bottom: 76px; }
	.gkc-root .gkc-panel { inset: 0; width: 100%; height: 100%; height: 100dvh; border: 0; border-radius: 0; transform-origin: bottom center; }
	.gkc-root .gkc-header { padding-top: max(16px, env(safe-area-inset-top)); }
	.gkc-root .gkc-footer { padding-bottom: max(12px, env(safe-area-inset-bottom)); }
	.gkc-root .gkc-msg { max-width: 88%; }
	.gkc-root textarea.gkc-input { font-size: 16px; } /* verhindert Zoom auf iOS */
}
@media (prefers-reduced-motion: reduce) {
	.gkc-root *, .gkc-root *::before, .gkc-root *::after { animation: none !important; transition: none !important; }
}
