/*
 * InnoSewa AI Knowledge ChatBot Pro — Frontend Widget
 * Premium floating chat widget · www.innosewa.com
 * v1.0.4
 */

/* ══════════════════════════════════════════════════════════
   CSS Custom Properties
   ══════════════════════════════════════════════════════════ */
:root {
	--is-primary:        #4338ca;
	--is-primary-dk:     #1e1b4b;
	--is-purple:         #7c3aed;
	--is-green:          #10b981;
	--is-danger:         #ef4444;

	--is-grad:           linear-gradient(140deg, #1e1b4b 0%, #3730a3 40%, #6d28d9 75%, #a855f7 100%);
	--is-grad-btn:       linear-gradient(135deg, #4338ca 0%, #7c3aed 100%);

	--is-bg:             #ffffff;
	--is-bg-msg:         #f0f4ff;
	--is-border:         rgba(0,0,0,.08);
	--is-text:           #1e293b;
	--is-muted:          #64748b;

	--is-w:              390px;   /* panel width */
	--is-h:              580px;   /* panel height */
	--is-r:              20px;    /* radius */

	--is-shadow:
		0 32px 80px rgba(0,0,0,.20),
		0 8px 24px rgba(26,86,219,.14),
		0 2px 6px rgba(0,0,0,.06);

	--is-ease:           cubic-bezier(0.4, 0, 0.2, 1);
	--is-spring:         cubic-bezier(0.34, 1.56, 0.64, 1);

	/* Spacing — density-adjustable (see .aikcp-density-* overrides below) */
	--is-pad-header:      16px 20px 15px;
	--is-pad-messages:    20px 22px 16px;
	--is-pad-bubble:      14px 18px;
	--is-pad-input-wrap:  14px 16px 6px;
	--is-pad-form:        6px 6px 6px 18px;
	--is-pad-input:       8px 10px 8px 2px;
}

/* Density presets — set via admin "Widget Spacing" setting, applied as a
   class on #aikcp-widget by chatbot.js (defaults to "comfortable" above). */
.aikcp-widget.aikcp-density-compact {
	--is-pad-header:      12px 16px 10px;
	--is-pad-messages:    14px 16px 10px;
	--is-pad-bubble:      10px 14px;
	--is-pad-input-wrap:  8px 10px 4px;
	--is-pad-form:        6px 6px 6px 12px;
	--is-pad-input:       6px 8px 6px 0;
}

.aikcp-widget.aikcp-density-spacious {
	--is-pad-header:      20px 24px 18px;
	--is-pad-messages:    24px 26px 20px;
	--is-pad-bubble:      16px 22px;
	--is-pad-input-wrap:  18px 20px 8px;
	--is-pad-form:        6px 6px 6px 22px;
	--is-pad-input:       10px 12px 10px 4px;
}

/* Dark mode overrides */
.aikcp-widget.aikcp-dark {
	--is-bg:        #0f172a;
	--is-bg-msg:    #1e293b;
	--is-border:    rgba(255,255,255,.10);
	--is-text:      #e2e8f0;
	--is-muted:     #94a3b8;
}

/* ══════════════════════════════════════════════════════════
   Widget root — isolate from theme CSS
   ══════════════════════════════════════════════════════════ */
#aikcp-widget,
#aikcp-widget *,
#aikcp-widget *::before,
#aikcp-widget *::after {
	box-sizing: border-box;
	margin:  0;
	padding: 0;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
	-webkit-font-smoothing: antialiased;
}

#aikcp-widget {
	position: fixed;
	z-index: 9999999;
	font-size: 14px;
	line-height: 1.55;
}

/* Positions */
.aikcp-pos-bottom-right { bottom: 24px; right: 24px; }
.aikcp-pos-bottom-left  { bottom: 24px; left:  24px; }

/* ══════════════════════════════════════════════════════════
   Launcher — pure circle (theme-proof)
   ══════════════════════════════════════════════════════════ */

/* Use #aikcp-widget prefix + !important on shape props to beat any theme CSS */
#aikcp-widget .aikcp-launcher {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 64px !important;
	height: 64px !important;
	min-width: 64px !important;
	border-radius: 50% !important;
	padding: 0 !important;
	background: var(--is-grad);
	border: none !important;
	cursor: pointer;
	color: #fff;
	box-shadow:
		0 10px 36px rgba(67,56,202,.55),
		0 3px 12px rgba(124,58,237,.35),
		inset 0 1px 0 rgba(255,255,255,.18);
	transition: transform 0.30s var(--is-spring), box-shadow 0.25s ease;
	animation: is-float 4s ease-in-out infinite;
	position: relative;
	outline: none;
	overflow: hidden;
}

/* Hover: scale up + stronger glow */
#aikcp-widget .aikcp-launcher:hover {
	transform: scale(1.12) translateY(-3px);
	box-shadow:
		0 18px 52px rgba(67,56,202,.65),
		0 5px 18px rgba(168,85,247,.45),
		inset 0 1px 0 rgba(255,255,255,.22);
}

/* Widget open: lock circle, show X, pause animation */
#aikcp-widget.aikcp-widget-open .aikcp-launcher,
#aikcp-widget.aikcp-widget-open .aikcp-launcher:hover {
	transform: none !important;
	animation-play-state: paused;
	box-shadow:
		0 8px 28px rgba(67,56,202,.45),
		0 2px 8px rgba(124,58,237,.25);
}

#aikcp-widget .aikcp-launcher:active  { transform: scale(0.93) !important; }
#aikcp-widget .aikcp-launcher:focus-visible {
	outline: 3px solid #a78bfa !important;
	outline-offset: 3px;
}

/* Sheen overlay */
#aikcp-widget .aikcp-launcher::before {
	content: '';
	position: absolute;
	inset: 0;
	background: linear-gradient(145deg, rgba(255,255,255,.26) 0%, transparent 55%);
	border-radius: 50%;
	pointer-events: none;
}

/* Shimmer sweep */
#aikcp-widget .aikcp-launcher::after {
	content: '';
	position: absolute;
	top: 0; left: -80%;
	width: 50%; height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,.32), transparent);
	transform: skewX(-18deg);
	pointer-events: none;
	animation: is-shimmer-sweep 5.5s ease-in-out infinite 2.5s;
}

#aikcp-widget.aikcp-widget-open .aikcp-launcher::after { display: none; }

/* ─── Icon ────────────────────────────────────────────── */
#aikcp-widget .aikcp-launcher-icon {
	width: 64px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	transition: transform 0.32s var(--is-spring);
}

#aikcp-widget .aikcp-launcher:hover .aikcp-launcher-icon { transform: scale(1.08) rotate(8deg); }
#aikcp-widget.aikcp-widget-open .aikcp-launcher .aikcp-launcher-icon { transform: none; }

#aikcp-widget .aikcp-launcher-icon svg {
	width: 28px;
	height: 28px;
	flex-shrink: 0;
}

/* Animated typing dots */
#aikcp-widget .aikcp-icon-chat circle { animation: is-dot-pulse 1.8s ease-in-out infinite; }
#aikcp-widget .aikcp-icon-chat circle + circle { animation-delay: .28s; }
#aikcp-widget .aikcp-icon-chat circle + circle + circle { animation-delay: .56s; }

@keyframes is-dot-pulse {
	0%, 60%, 100% { opacity: .5; }
	30%            { opacity: 1; }
}

#aikcp-widget.aikcp-widget-open .aikcp-icon-chat circle { animation: none; }

/* ─── Show/hide icons ───────────────────────────────── */
.aikcp-icon-close  { display: none; }
.aikcp-icon-chat   { display: block; }

.aikcp-widget-open .aikcp-icon-chat  { display: none; }
.aikcp-widget-open .aikcp-icon-close { display: block; }

/* ─── Launcher text — hidden inside button (circle is text-free) ─ */
#aikcp-widget .aikcp-launcher-text { display: none !important; }
.aikcp-launcher-label, .aikcp-launcher-sub { display: none; }

/* ─── "Chat with us" hint callout — appears above circle, auto-fades ─ */
#aikcp-widget .aikcp-launcher-wrap::after {
	content: 'Chat with us';
	position: absolute;
	bottom: calc(100% + 14px);
	right: -2px;
	background: #ffffff;
	color: #1e1b4b;
	font-size: 13px;
	font-weight: 700;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	padding: 10px 18px;
	border-radius: 999px;
	box-shadow:
		0 8px 28px rgba(67,56,202,.18),
		0 2px 8px rgba(0,0,0,.08),
		0 0 0 1px rgba(67,56,202,.08);
	white-space: nowrap;
	pointer-events: none;
	z-index: 10;
	animation:
		is-hint-in  0.5s cubic-bezier(0.34,1.56,0.64,1) 2s both,
		is-hint-out 0.45s ease 9s both;
}

/* Triangle tail pointing down-right toward the circle */
#aikcp-widget .aikcp-launcher-wrap::before {
	content: '';
	position: absolute;
	bottom: calc(100% + 7px);
	right: 24px;
	width: 12px;
	height: 12px;
	background: #ffffff;
	transform: rotate(45deg);
	border-radius: 2px;
	pointer-events: none;
	z-index: 11;
	animation:
		is-hint-in  0.5s cubic-bezier(0.34,1.56,0.64,1) 2s both,
		is-hint-out 0.45s ease 9s both;
}

#aikcp-widget.aikcp-widget-open .aikcp-launcher-wrap::before,
#aikcp-widget.aikcp-widget-open .aikcp-launcher-wrap::after {
	display: none;
}

@keyframes is-hint-in {
	from { opacity: 0; transform: translateY(8px) scale(0.9); }
	to   { opacity: 1; transform: translateY(0)   scale(1); }
}

@keyframes is-hint-out {
	to { opacity: 0; visibility: hidden; }
}

/* ─── Unread badge dot ──────────────────────────────── */
.aikcp-badge-dot {
	position: absolute;
	top: 4px;
	right: 4px;
	width: 16px;
	height: 16px;
	background: #f43f5e;
	border-radius: 50% !important;
	border: 2.5px solid #fff;
	animation: is-pop 0.4s var(--is-spring);
	box-shadow: 0 0 10px rgba(244,63,94,.65);
	z-index: 3;
}

@keyframes is-pop {
	from { transform: scale(0); }
	to   { transform: scale(1); }
}

/* ══════════════════════════════════════════════════════════
   Chat panel
   ══════════════════════════════════════════════════════════ */
.aikcp-panel {
	position: absolute;
	width: var(--is-w);
	height: var(--is-h);
	bottom: calc(100% + 14px);
	background: var(--is-bg);
	border-radius: var(--is-r);
	box-shadow: var(--is-shadow);
	border: 1px solid var(--is-border);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	opacity: 0;
	transform: translateY(20px) scale(0.94);
	transform-origin: bottom center;
	pointer-events: none;
	transition:
		opacity  0.28s var(--is-ease),
		transform 0.34s var(--is-spring);
	will-change: transform, opacity;
}

.aikcp-pos-bottom-right .aikcp-panel { right: 0; transform-origin: bottom right; }
.aikcp-pos-bottom-left  .aikcp-panel { left:  0; transform-origin: bottom left; }

.aikcp-panel:not([hidden]) {
	opacity: 1;
	transform: translateY(0) scale(1);
	pointer-events: all;
}

/* ══════════════════════════════════════════════════════════
   Header
   ══════════════════════════════════════════════════════════ */
.aikcp-header {
	background: var(--is-grad);
	padding: var(--is-pad-header);
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-shrink: 0;
	position: relative;
	overflow: hidden;
}

/* Decorative blurred orbs */
.aikcp-hdr-orb {
	position: absolute;
	border-radius: 50%;
	pointer-events: none;
	filter: blur(24px);
}

.aikcp-hdr-orb1 {
	width: 100px; height: 100px;
	background: rgba(124,58,237,.45);
	top: -40px; left: -20px;
}

.aikcp-hdr-orb2 {
	width: 80px; height: 80px;
	background: rgba(255,255,255,.12);
	bottom: -20px; right: 30px;
}

.aikcp-hdr-left {
	display: flex;
	align-items: center;
	gap: 11px;
	position: relative;
	z-index: 1;
}

/* Avatar */
.aikcp-avatar {
	width: 42px;
	height: 42px;
	border-radius: 50%;
	border: 2px solid rgba(255,255,255,.35);
	object-fit: cover;
	flex-shrink: 0;
	box-shadow: 0 2px 8px rgba(0,0,0,.22);
}

.aikcp-avatar-ai {
	background: rgba(255,255,255,.15);
	backdrop-filter: blur(8px);
	display: flex;
	align-items: center;
	justify-content: center;
}

.aikcp-avatar-ai svg { width: 24px; height: 24px; }

.aikcp-hdr-name {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	letter-spacing: -.01em;
	line-height: 1.2;
}

.aikcp-hdr-status {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	color: rgba(255,255,255,.75);
	margin-top: 3px;
}

.aikcp-status-ring {
	width: 8px;
	height: 8px;
	background: #4ade80;
	border-radius: 50%;
	flex-shrink: 0;
	box-shadow: 0 0 0 0 rgba(74,222,128,.5);
	animation: is-pulse 2.4s ease-in-out infinite;
}

@keyframes is-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(74,222,128,.4); }
	50%       { box-shadow: 0 0 0 5px rgba(74,222,128,0); }
}

/* Header action buttons */
.aikcp-hdr-actions {
	display: flex;
	gap: 4px;
	position: relative;
	z-index: 1;
}

.aikcp-hdr-btn {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	border: 1px solid rgba(255,255,255,.18);
	background: rgba(255,255,255,.10);
	color: rgba(255,255,255,.85);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background 0.18s, border-color 0.18s;
	backdrop-filter: blur(6px);
	outline: none;
}

.aikcp-hdr-btn:hover  { background: rgba(255,255,255,.22); border-color: rgba(255,255,255,.3); color: #fff; }
.aikcp-hdr-btn:focus-visible { outline: 2px solid rgba(255,255,255,.6); outline-offset: 2px; }
.aikcp-hdr-btn svg    { width: 14px; height: 14px; flex-shrink: 0; }

#aikcp-close:hover { background: rgba(239,68,68,.35); border-color: rgba(239,68,68,.5); }

/* ══════════════════════════════════════════════════════════
   Messages area
   ══════════════════════════════════════════════════════════ */
.aikcp-messages {
	flex: 1;
	overflow-y: auto;
	overflow-x: hidden;
	padding: var(--is-pad-messages);
	display: flex;
	flex-direction: column;
	gap: 14px;
	scroll-behavior: smooth;
	background: var(--is-bg);
	scrollbar-width: thin;
	scrollbar-color: rgba(26,86,219,.18) transparent;
}

.aikcp-messages::-webkit-scrollbar { width: 4px; }
.aikcp-messages::-webkit-scrollbar-track { background: transparent; }
.aikcp-messages::-webkit-scrollbar-thumb { background: rgba(26,86,219,.2); border-radius: 99px; }

/* ── Message rows ─────────────────────────────────────── */
.aikcp-row {
	display: flex;
	align-items: flex-end;
	gap: 8px;
	animation: is-row-in 0.3s var(--is-spring);
}

@keyframes is-row-in {
	from { opacity: 0; transform: translateY(14px); }
	to   { opacity: 1; transform: translateY(0); }
}

.aikcp-row-user  { justify-content: flex-end; }
.aikcp-row-bot   { justify-content: flex-start; }

/* Small bot avatar beside each message */
.aikcp-row-avatar {
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--is-grad);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	align-self: flex-end;
	margin-bottom: 2px;
	box-shadow: 0 2px 8px rgba(26,86,219,.30);
}

.aikcp-row-avatar svg { width: 15px; height: 15px; }

.aikcp-bubble-group {
	display: flex;
	flex-direction: column;
	max-width: 78%;
}

.aikcp-row-user .aikcp-bubble-group  { margin-right: 2px; }
.aikcp-row-bot  .aikcp-bubble-group  { margin-left:  2px; }

/* Sender label */
.aikcp-sender {
	font-size: 11px;
	font-weight: 600;
	color: var(--is-muted);
	margin-bottom: 4px;
	letter-spacing: .04em;
	text-transform: uppercase;
}

.aikcp-row-user .aikcp-sender { text-align: right; }

/* ── Bubble ───────────────────────────────────────────── */
.aikcp-bubble-text {
	padding: var(--is-pad-bubble);
	border-radius: 18px;
	font-size: 14px;
	line-height: 1.65;
	color: var(--is-text);
	word-break: break-word;
}

/* Bot bubble — HTML content from markdown renderer, no pre-wrap */
.aikcp-row-bot .aikcp-bubble-text {
	background: var(--is-bg-msg);
	border: 1px solid rgba(67,56,202,.10);
	border-bottom-left-radius: 5px;
	box-shadow: 0 3px 12px rgba(0,0,0,.06), 0 1px 3px rgba(67,56,202,.06);
	color: var(--is-text);
	white-space: normal;
}

/* User bubble — plain text with explicit <br>, keep pre-wrap for newlines */
.aikcp-row-user .aikcp-bubble-text {
	background: var(--is-grad-btn);
	color: #fff;
	border-bottom-right-radius: 5px;
	box-shadow: 0 5px 18px rgba(67,56,202,.35), 0 2px 6px rgba(109,40,217,.20);
	white-space: pre-wrap;
}

/* Timestamp */
.aikcp-timestamp {
	font-size: 11px;
	color: var(--is-muted);
	opacity: .7;
	margin-top: 5px;
}

.aikcp-row-user .aikcp-timestamp { text-align: right; }

/* ── Markdown inside bubble ──────────────────────────── */
.aikcp-bubble-text p            { margin: 0 0 9px; }
.aikcp-bubble-text p:last-child { margin-bottom: 0; }
.aikcp-bubble-text ul,
.aikcp-bubble-text ol           { padding-left: 18px; margin: 6px 0 9px; }
.aikcp-bubble-text li           { margin-bottom: 5px; line-height: 1.55; }
.aikcp-bubble-text li:last-child { margin-bottom: 0; }
.aikcp-bubble-text strong       { font-weight: 700; color: inherit; }
.aikcp-bubble-text em           { font-style: italic; }
.aikcp-bubble-text a            { color: var(--is-primary); text-underline-offset: 3px; font-weight: 500; }
.aikcp-row-user .aikcp-bubble-text a { color: rgba(255,255,255,.92); }

.aikcp-bubble-text code {
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	font-size: 12.5px;
	background: rgba(0,0,0,.07);
	padding: 2px 6px;
	border-radius: 5px;
}

.aikcp-row-user .aikcp-bubble-text code { background: rgba(255,255,255,.2); }

.aikcp-bubble-text pre {
	background: #1e293b;
	color: #e2e8f0;
	border-radius: 10px;
	padding: 12px 14px;
	overflow-x: auto;
	font-size: 12.5px;
	font-family: ui-monospace, 'SF Mono', Menlo, monospace;
	line-height: 1.55;
	margin: 8px 0;
}

/* ── Sources ──────────────────────────────────────────── */
.aikcp-sources {
	margin-top: 12px;
	padding-top: 12px;
	border-top: 1px solid rgba(67,56,202,.10);
}

.aikcp-sources-lbl {
	font-size: 10px;
	font-weight: 700;
	color: var(--is-muted);
	text-transform: uppercase;
	letter-spacing: .08em;
	margin-bottom: 8px;
}

.aikcp-sources-list {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.aikcp-sources-more {
	background: none;
	border: 1px solid rgba(67,56,202,.18);
	border-radius: 8px;
	font-size: 11px;
	font-family: inherit;
	color: var(--is-muted);
	cursor: pointer;
	padding: 3px 10px;
	align-self: flex-start;
	transition: border-color 0.2s, color 0.2s;
}

.aikcp-sources-more:hover {
	color: var(--is-primary);
	border-color: var(--is-primary);
}

/* ── Article source chip ─────────────────────────────── */
.aikcp-source-chip {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	color: var(--is-primary);
	text-decoration: none;
	padding: 5px 12px;
	border-radius: 8px;
	background: rgba(67,56,202,.05);
	border: 1px solid rgba(67,56,202,.14);
	font-weight: 500;
	transition: background .18s, border-color .18s, transform .18s;
	align-self: flex-start;
}

.aikcp-source-chip:hover {
	background: rgba(67,56,202,.11);
	border-color: rgba(67,56,202,.28);
	text-decoration: none;
	transform: translateY(-1px);
}

/* ── Inline product results block ───────────────────────
   Rendered inside .aikcp-bubble-text, after the answer text
   ──────────────────────────────────────────────────────── */
.aikcp-product-results {
	margin-top: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* ── Individual product card ─────────────────────────── */
.aikcp-product-card {
	display: flex;
	align-items: center;
	gap: 12px;
	text-decoration: none;
	background: #ffffff;
	border: 1.5px solid rgba(109,40,217,.22);
	border-radius: 14px;
	padding: 12px 14px;
	transition: background .2s, border-color .2s, transform .22s var(--is-spring), box-shadow .2s;
	box-shadow: 0 2px 10px rgba(109,40,217,.10), 0 1px 3px rgba(0,0,0,.05);
}

.aikcp-product-card:hover {
	background: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
	border-color: rgba(109,40,217,.48);
	transform: translateY(-2px);
	box-shadow: 0 6px 20px rgba(109,40,217,.22), 0 2px 6px rgba(0,0,0,.06);
	text-decoration: none;
}

.aikcp-product-card-icon {
	width: 40px;
	height: 40px;
	border-radius: 10px;
	background: var(--is-grad-btn);
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	flex-shrink: 0;
	box-shadow: 0 3px 10px rgba(109,40,217,.40);
}

.aikcp-product-card-body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.aikcp-product-card-name {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--is-text);
	line-height: 1.3;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.aikcp-product-card-meta {
	font-size: 11.5px;
	color: var(--is-muted);
	font-weight: 400;
}

.aikcp-product-card-cta {
	font-size: 12px;
	font-weight: 700;
	color: var(--is-purple);
	white-space: nowrap;
	letter-spacing: -.01em;
	flex-shrink: 0;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(109,40,217,.08);
	border: 1px solid rgba(109,40,217,.20);
	transition: background .18s, border-color .18s;
}

.aikcp-product-card:hover .aikcp-product-card-cta {
	background: rgba(109,40,217,.15);
	border-color: rgba(109,40,217,.35);
}

/* ── Feedback ─────────────────────────────────────────── */
.aikcp-feedback {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px solid rgba(0,0,0,.06);
	flex-wrap: wrap;
}

.aikcp-feedback-lbl {
	font-size: 11.5px;
	color: var(--is-muted);
	font-weight: 500;
	flex: 1;
	min-width: 100px;
}

.aikcp-fb-btn {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-size: 12px;
	font-weight: 600;
	padding: 5px 14px;
	border-radius: 999px;
	border: 1.5px solid rgba(0,0,0,.10);
	background: #f8fafc;
	color: var(--is-muted);
	cursor: pointer;
	transition: all .18s;
	letter-spacing: -.01em;
}

.aikcp-fb-btn:hover        { border-color: var(--is-primary); color: var(--is-primary); background: rgba(67,56,202,.06); transform: translateY(-1px); }
.aikcp-fb-btn.is-yes       { background: rgba(16,185,129,.10); border-color: rgba(16,185,129,.5); color: #059669; transform: none; }
.aikcp-fb-btn.is-no        { background: rgba(239,68,68,.10);  border-color: rgba(239,68,68,.5);  color: #dc2626; transform: none; }

/* ══════════════════════════════════════════════════════════
   Typing indicator
   ══════════════════════════════════════════════════════════ */
.aikcp-typing {
	padding: 0 16px 10px;
	display: flex;
	align-items: center;
	gap: 8px;
	flex-shrink: 0;
}

.aikcp-typing-avatar {
	width: 28px; height: 28px;
	border-radius: 50%;
	background: var(--is-grad);
	color: #fff;
	display: flex; align-items: center; justify-content: center;
	flex-shrink: 0;
	box-shadow: 0 2px 8px rgba(26,86,219,.28);
}

.aikcp-typing-avatar svg { width: 15px; height: 15px; }

.aikcp-typing-bubble {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: var(--is-bg-msg);
	border: 1px solid rgba(26,86,219,.10);
	border-radius: 18px;
	border-bottom-left-radius: 5px;
	padding: 11px 16px;
	box-shadow: 0 2px 8px rgba(0,0,0,.04);
}

.aikcp-typing-bubble span {
	width: 7px; height: 7px;
	background: var(--is-primary);
	border-radius: 50%;
	opacity: .4;
	animation: is-bounce 1.4s ease-in-out infinite;
}

.aikcp-typing-bubble span:nth-child(2) { animation-delay: .18s; }
.aikcp-typing-bubble span:nth-child(3) { animation-delay: .36s; }

@keyframes is-bounce {
	0%, 60%, 100% { transform: translateY(0);   opacity: .4; }
	30%            { transform: translateY(-6px); opacity: 1; }
}

/* ══════════════════════════════════════════════════════════
   Suggested replies
   ══════════════════════════════════════════════════════════ */
.aikcp-suggestions {
	padding: 4px 14px 10px;
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	flex-shrink: 0;
}

.aikcp-sug-btn {
	font-size: 12.5px;
	padding: 6px 14px;
	border-radius: 999px;
	border: 1px solid rgba(26,86,219,.22);
	background: rgba(26,86,219,.04);
	color: var(--is-primary);
	cursor: pointer;
	transition: all .18s;
	white-space: nowrap;
	max-width: 220px;
	overflow: hidden;
	text-overflow: ellipsis;
	font-weight: 500;
}

.aikcp-sug-btn:hover {
	background: rgba(26,86,219,.10);
	border-color: rgba(26,86,219,.35);
	transform: translateY(-1px);
	box-shadow: 0 2px 8px rgba(26,86,219,.14);
}

/* ══════════════════════════════════════════════════════════
   Input area — luxury edition
   ══════════════════════════════════════════════════════════ */
.aikcp-input-wrap {
	flex-shrink: 0;
	background: var(--is-bg);
	border-top: 1px solid rgba(0,0,0,.06);
	padding: var(--is-pad-input-wrap);
}

.aikcp-form {
	display: flex;
	align-items: flex-end;
	gap: 0;
	background: rgba(67,56,202,.04);
	border: 1.5px solid rgba(67,56,202,.18);
	border-radius: 18px;
	padding: var(--is-pad-form);
	transition: border-color .22s, box-shadow .22s, background .22s;
	position: relative;
}

.aikcp-form:focus-within {
	border-color: #6d28d9;
	box-shadow:
		0 0 0 3px rgba(109,40,217,.12),
		0 4px 18px rgba(109,40,217,.10);
	background: rgba(67,56,202,.03);
}

.aikcp-input {
	flex: 1;
	min-height: 38px;
	max-height: 120px;
	resize: none;
	border: none;
	border-radius: 0;
	padding: var(--is-pad-input);
	font-size: 14px;
	color: var(--is-text);
	background: transparent;
	outline: none;
	line-height: 1.55;
	overflow-y: auto;
	font-family: inherit;
}

.aikcp-input::placeholder { color: var(--is-muted); opacity: .8; }

/* Send button — circle with gradient */
.aikcp-send {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: none;
	background: var(--is-grad-btn);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	flex-shrink: 0;
	align-self: flex-end;
	transition: transform .24s var(--is-spring), box-shadow .22s, opacity .15s;
	box-shadow:
		0 4px 16px rgba(109,40,217,.45),
		0 2px 6px rgba(67,56,202,.30);
	outline: none;
}

.aikcp-send:hover {
	transform: translateY(-2px) scale(1.08);
	box-shadow:
		0 8px 24px rgba(109,40,217,.55),
		0 2px 8px rgba(67,56,202,.35);
}

.aikcp-send:active  { transform: scale(0.92); }
.aikcp-send:focus-visible { outline: 3px solid #a78bfa; outline-offset: 2px; }
.aikcp-send svg { width: 16px; height: 16px; flex-shrink: 0; }

.aikcp-send:disabled { opacity: .4; cursor: not-allowed; transform: none !important; box-shadow: none; }

/* Keyboard hint */
.aikcp-input-hint {
	padding: 6px 16px 10px;
	font-size: 10.5px;
	color: var(--is-muted);
	opacity: .55;
	display: flex;
	align-items: center;
	gap: 5px;
}

/* ══════════════════════════════════════════════════════════
   GDPR notice
   ══════════════════════════════════════════════════════════ */
.aikcp-gdpr {
	font-size: 11.5px;
	color: var(--is-muted);
	padding: 8px 16px;
	border-top: 1px solid rgba(0,0,0,.06);
	background: rgba(26,86,219,.03);
	text-align: center;
	flex-shrink: 0;
}

.aikcp-gdpr a { color: var(--is-primary); }

/* ══════════════════════════════════════════════════════════
   Footer
   ══════════════════════════════════════════════════════════ */
.aikcp-footer {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	padding: 8px 16px 10px;
	font-size: 11.5px;
	color: var(--is-muted);
	background: rgba(248,250,252,.9);
	border-top: 1px solid rgba(0,0,0,.05);
	flex-shrink: 0;
}

.aikcp-footer-lock { display: flex; align-items: center; }
.aikcp-footer-lock svg { width: 14px; height: 14px; opacity: .5; }

.aikcp-footer-brand {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--is-primary);
	text-decoration: none;
	font-weight: 600;
	transition: opacity .18s;
}

.aikcp-footer-brand:hover { opacity: .75; text-decoration: none; }
.aikcp-footer-brand svg { width: 14px; height: 14px; }
.aikcp-footer-brand strong { font-size: 11.5px; }

.aikcp-footer-dot { opacity: .4; }

/* ══════════════════════════════════════════════════════════
   Inline panel ([aikcp_chat] shortcode)
   ══════════════════════════════════════════════════════════ */
.aikcp-inline-wrapper {
	display: flex;
	max-width: 100%;
}

.aikcp-inline-panel {
	display: flex;
	flex-direction: column;
	flex: 1;
	min-width: 0;
	border: 1px solid var(--is-border);
	border-radius: var(--is-r);
	overflow: hidden;
	box-shadow: 0 4px 24px rgba(0,0,0,.08);
	background: var(--is-bg);
}

.aikcp-inline-panel .aikcp-messages { flex: 1; min-height: 0; }

/* ══════════════════════════════════════════════════════════
   Inline search box ([aikcp_search] shortcode)
   ══════════════════════════════════════════════════════════ */
.aikcp-search-widget {
	max-width: 100%;
}

.aikcp-search-form {
	display: flex;
	gap: 8px;
}

.aikcp-search-input {
	flex: 1;
	min-width: 0;
	padding: 10px 14px;
	border-radius: 10px;
	border: 1.5px solid rgba(67,56,202,.18);
	font-size: 14px;
	color: var(--is-text);
	background: var(--is-bg);
	outline: none;
	transition: border-color .2s, box-shadow .2s;
}

.aikcp-search-input:focus {
	border-color: #6d28d9;
	box-shadow: 0 0 0 3px rgba(109,40,217,.10);
}

.aikcp-search-btn {
	padding: 10px 20px;
	border-radius: 10px;
	border: none;
	background: var(--is-grad-btn);
	color: #fff;
	font-weight: 600;
	font-size: 14px;
	cursor: pointer;
	transition: opacity .18s, transform .18s;
}

.aikcp-search-btn:hover { opacity: .9; transform: translateY(-1px); }

.aikcp-search-results {
	margin-top: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.aikcp-search-result {
	display: block;
	padding: 12px 14px;
	border-radius: 10px;
	border: 1px solid rgba(67,56,202,.14);
	background: rgba(67,56,202,.03);
	text-decoration: none;
	transition: background .18s, border-color .18s, transform .18s;
}

.aikcp-search-result:hover {
	background: rgba(67,56,202,.08);
	border-color: rgba(67,56,202,.3);
	transform: translateY(-1px);
}

.aikcp-search-result-title {
	font-size: 14px;
	font-weight: 600;
	color: var(--is-text);
}

.aikcp-search-loading,
.aikcp-search-empty {
	padding: 14px;
	font-size: 13.5px;
	color: var(--is-muted);
	text-align: center;
}

.aikcp-search-answer {
	padding: 14px 16px;
	border-radius: 10px;
	background: var(--is-bg-msg);
	font-size: 14px;
	line-height: 1.6;
	color: var(--is-text);
}

/* ══════════════════════════════════════════════════════════
   Launcher wrapper & attention animations
   ══════════════════════════════════════════════════════════ */

/* Wrapper that holds the pulse rings + the button */
.aikcp-launcher-wrap {
	position: relative;
	display: inline-flex;
	align-items: center;
}

/* Expanding pulse rings — orbit around the 64px circle */
.aikcp-pulse-ring {
	position: absolute;
	inset: -4px;
	border-radius: 50% !important;
	border: 2px solid rgba(109, 40, 217, .65);
	opacity: 0;
	pointer-events: none;
	animation: is-ring 3s ease-out infinite;
}

.aikcp-pulse-ring:last-of-type { animation-delay: 1.5s; }

.aikcp-widget-open .aikcp-pulse-ring,
.aikcp-launcher-wrap:hover .aikcp-pulse-ring {
	animation-play-state: paused;
	opacity: 0;
	transition: opacity 0.15s;
}

/* Gentle floating bob */
@keyframes is-float {
	0%, 100% { transform: translateY(0);   }
	50%       { transform: translateY(-6px); }
}

/* Expanding ring burst */
@keyframes is-ring {
	0%   { transform: scale(1);    opacity: .7; }
	70%  { transform: scale(1.28); opacity: 0;  }
	100% { transform: scale(1.28); opacity: 0;  }
}

/* Shimmer sweep across the button face */
@keyframes is-shimmer-sweep {
	0%, 100%  { left: -80%;  opacity: 0; }
	8%         { opacity: 1; }
	48%        { left: 140%; opacity: 1; }
	56%        { opacity: 0; }
}

/* ══════════════════════════════════════════════════════════
   Responsive
   ══════════════════════════════════════════════════════════ */
@media (max-width: 480px) {
	:root {
		--is-w: 100vw;
		--is-h: 100dvh;
		--is-r: 0px;
	}

	.aikcp-pos-bottom-right,
	.aikcp-pos-bottom-left {
		bottom: 0 !important;
		right:  0 !important;
		left:   0 !important;
	}

	.aikcp-panel {
		bottom: 0;
		border-radius: 0;
		height: 100dvh;
		width: 100vw;
	}

	#aikcp-widget .aikcp-launcher,
	#aikcp-widget .aikcp-launcher:hover {
		width: 56px !important;
		height: 56px !important;
		min-width: 56px !important;
		border-radius: 50% !important;
		animation: none;
		transform: none !important;
	}

	#aikcp-widget .aikcp-launcher-icon { width: 56px; height: 56px; }
	#aikcp-widget .aikcp-launcher::after { display: none; }
	.aikcp-pulse-ring { display: none; }
	#aikcp-widget .aikcp-launcher-wrap::before,
	#aikcp-widget .aikcp-launcher-wrap::after { display: none; }
}

/* ══════════════════════════════════════════════════════════
   Source chip overflow fix
   ══════════════════════════════════════════════════════════ */
.aikcp-source-chip {
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: inline-flex;
}

/* Suggestion buttons — stay inside panel on all screen sizes */
.aikcp-sug-btn {
	max-width: calc(100% - 8px);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

/* Bot bubble text — guard against long unbreakable strings */
.aikcp-row-bot .aikcp-bubble-text {
	overflow-wrap: anywhere;
	word-break: break-word;
}

/* ══════════════════════════════════════════════════════════
   Lead capture form
   ══════════════════════════════════════════════════════════ */
.aikcp-lead-form {
	background: linear-gradient(140deg, rgba(67,56,202,.06) 0%, rgba(109,40,217,.07) 100%);
	border: 1.5px solid rgba(109,40,217,.20);
	border-radius: 18px;
	padding: 22px 18px 18px;
	transition: opacity 0.30s ease, transform 0.30s ease;
	box-shadow: 0 2px 14px rgba(67,56,202,.08);
}

.aikcp-lead-form.is-hiding {
	opacity: 0;
	transform: translateY(-8px) scale(0.97);
	pointer-events: none;
}

.aikcp-lead-header {
	text-align: center;
	margin-bottom: 18px;
}

.aikcp-lead-icon {
	width: 52px;
	height: 52px;
	background: var(--is-grad);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 12px;
	box-shadow: 0 6px 18px rgba(67,56,202,.30);
}

.aikcp-lead-icon svg {
	width: 24px;
	height: 24px;
	color: #fff;
}

.aikcp-lead-header h3 {
	font-size: 15px;
	font-weight: 700;
	color: var(--is-text);
	margin: 0 0 5px;
	letter-spacing: -.02em;
}

.aikcp-lead-header p {
	font-size: 12.5px;
	color: var(--is-muted);
	margin: 0;
	line-height: 1.5;
}

.aikcp-lead-fields {
	display: flex;
	flex-direction: column;
	gap: 9px;
}

.aikcp-lead-input {
	width: 100%;
	padding: 10px 13px;
	border-radius: 10px;
	border: 1.5px solid rgba(67,56,202,.18);
	background: var(--is-bg);
	font-size: 13px;
	font-family: inherit;
	color: var(--is-text);
	outline: none;
	transition: border-color 0.2s, box-shadow 0.2s;
}

.aikcp-lead-input:focus {
	border-color: #6d28d9;
	box-shadow: 0 0 0 3px rgba(109,40,217,.10);
}

.aikcp-lead-input::placeholder {
	color: var(--is-muted);
	opacity: 0.75;
}

.aikcp-lead-submit {
	width: 100%;
	padding: 12px;
	border-radius: 10px;
	border: none;
	background: var(--is-grad-btn);
	color: #fff;
	font-size: 13.5px;
	font-weight: 700;
	font-family: inherit;
	cursor: pointer;
	margin-top: 4px;
	letter-spacing: -.01em;
	transition: opacity 0.18s, transform 0.18s;
	box-shadow: 0 4px 14px rgba(109,40,217,.35);
}

.aikcp-lead-submit:hover   { opacity: 0.88; transform: translateY(-1px); }
.aikcp-lead-submit:active  { transform: scale(0.97); }
.aikcp-lead-submit:disabled {
	opacity: 0.55;
	cursor: not-allowed;
	transform: none;
}

.aikcp-lead-error {
	font-size: 12px;
	color: #ef4444;
	text-align: center;
	min-height: 16px;
	margin-top: 2px;
}

.aikcp-lead-skip {
	text-align: center;
	margin-top: 10px;
}

.aikcp-lead-skip-btn {
	background: none;
	border: none;
	font-size: 12px;
	font-family: inherit;
	color: var(--is-muted);
	cursor: pointer;
	opacity: 0.7;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.aikcp-lead-skip-btn:hover { opacity: 1; }

/* ══════════════════════════════════════════════════════════
   Welcome card (first message)
   ══════════════════════════════════════════════════════════ */
.aikcp-welcome-card {
	background: linear-gradient(140deg, rgba(67,56,202,.07) 0%, rgba(109,40,217,.07) 60%, rgba(168,85,247,.05) 100%);
	border: 1px solid rgba(109,40,217,.14);
	border-radius: 16px;
	padding: 22px 18px;
	text-align: center;
	margin-bottom: 4px;
	box-shadow: 0 2px 12px rgba(67,56,202,.08);
}

.aikcp-welcome-card-icon {
	width: 56px; height: 56px;
	background: var(--is-grad);
	border-radius: 50%;
	display: flex; align-items: center; justify-content: center;
	margin: 0 auto 14px;
	box-shadow:
		0 6px 20px rgba(67,56,202,.35),
		0 2px 6px rgba(109,40,217,.25),
		inset 0 1px 0 rgba(255,255,255,.2);
}

.aikcp-welcome-card-icon svg { width: 28px; height: 28px; color: #fff; }

.aikcp-welcome-card h3 {
	font-size: 16px; font-weight: 700;
	color: var(--is-text); margin: 0 0 7px;
	letter-spacing: -.02em;
}

.aikcp-welcome-card p {
	font-size: 13.5px; color: var(--is-muted);
	margin: 0; line-height: 1.55;
}
