.alynivo {
	--alynivo-color: #7257ff;
	--alynivo-ink: #17151f;
	--alynivo-muted: #716d7d;
	--alynivo-line: #e9e6ef;
	--alynivo-soft: #f7f6fa;
	position: fixed;
	bottom: 22px;
	z-index: 999998;
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	font-size: 14px;
	line-height: 1.45;
	letter-spacing: 0;
}

.alynivo--right { right: 22px; }
.alynivo--left { left: 22px; }
.alynivo *, .alynivo *::before, .alynivo *::after { box-sizing: border-box; }
.alynivo button, .alynivo input, .alynivo a { font: inherit; letter-spacing: 0; }

.alynivo__launcher {
	position: relative;
	display: grid;
	width: 60px;
	height: 60px;
	margin-left: auto;
	padding: 0;
	border: 0;
	border-radius: 15px;
	place-items: center;
	background: #fff;
	box-shadow: 0 15px 38px rgba(61, 44, 148, .3);
	color: #fff;
	cursor: pointer;
	transition: transform .2s ease, box-shadow .2s ease;
}

.alynivo__launcher:hover { transform: translateY(-2px); box-shadow: 0 18px 42px rgba(61, 44, 148, .36); }
.alynivo__launcher.is-open { transform: scale(.94); }
.alynivo__launcher-mark { display: block; width: 66%; height: 66%; overflow: hidden; border-radius: 10px; }
.alynivo__brand-mark { display: block; width: 100%; height: 100%; object-fit: contain; }

.alynivo__launcher--generic { background: var(--alynivo-color); }
.alynivo__launcher-mark--generic { display: grid; width: 100%; height: 100%; place-items: center; }

.alynivo__launcher:focus-visible,
.alynivo button:focus-visible,
.alynivo input:focus-visible,
.alynivo a:focus-visible { outline: 3px solid rgba(114, 87, 255, .3); outline-offset: 2px; }

.alynivo__teaser {
	position: absolute;
	bottom: 70px;
	display: flex;
	align-items: center;
	gap: 8px;
	max-width: min(240px, calc(100vw - 48px));
	padding: 10px 10px 10px 14px;
	border-radius: 14px;
	background: #fff;
	color: var(--alynivo-ink);
	font-size: 13px;
	line-height: 1.35;
	box-shadow: 0 14px 32px rgba(23, 21, 31, .18);
	animation: alynivo-teaser-in .25s ease;
}

.alynivo--right .alynivo__teaser { right: 0; }
.alynivo--left .alynivo__teaser { left: 0; }

.alynivo__teaser span { cursor: pointer; }

.alynivo__teaser-close {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	border: 0;
	border-radius: 50%;
	background: var(--alynivo-soft);
	color: var(--alynivo-muted);
	font-size: 13px;
	line-height: 1;
	cursor: pointer;
	display: grid;
	place-items: center;
}

@keyframes alynivo-teaser-in {
	from { opacity: 0; transform: translateY(6px); }
	to { opacity: 1; transform: translateY(0); }
}

.alynivo__panel {
	position: absolute;
	right: 0;
	bottom: 72px;
	display: grid;
	width: min(410px, calc(100vw - 32px));
	height: min(720px, calc(100dvh - 96px));
	min-height: 470px;
	grid-template-rows: auto minmax(0, 1fr) auto auto;
	overflow: hidden;
	border: 1px solid rgba(34, 28, 48, .1);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 28px 80px rgba(25, 19, 43, .24);
	color: var(--alynivo-ink);
}

.alynivo--left .alynivo__panel { right: auto; left: 0; }
.alynivo__panel[hidden] { display: none; }

.alynivo__header {
	display: flex;
	min-height: 74px;
	align-items: center;
	justify-content: space-between;
	padding: 13px 14px 13px 16px;
	border-bottom: 1px solid var(--alynivo-line);
	background: rgba(255, 255, 255, .97);
}

.alynivo__identity { display: flex; min-width: 0; align-items: center; gap: 11px; }
.alynivo__identity > div { display: flex; min-width: 0; flex-direction: column; }
.alynivo__identity strong { overflow: hidden; color: var(--alynivo-ink); font-size: 15px; font-weight: 720; text-overflow: ellipsis; white-space: nowrap; }
.alynivo__identity > div > span { display: flex; align-items: center; gap: 5px; color: var(--alynivo-muted); font-size: 11px; }
.alynivo__identity > div > span i { width: 7px; height: 7px; border-radius: 50%; background: #20b778; }
.alynivo--live .alynivo__identity > div > span i { background: #9b96a3; }
.alynivo--live.is-live-connected .alynivo__identity > div > span i { background: #20b778; }

.alynivo__avatar,
.alynivo__mini-avatar {
	position: relative;
	display: grid;
	flex: 0 0 auto;
	place-items: center;
	background: transparent;
}

.alynivo__avatar { width: 42px; height: 42px; border-radius: 10px; box-shadow: 0 7px 18px rgba(114, 87, 255, .22); }
.alynivo__mini-avatar { width: 27px; height: 27px; border-radius: 7px; }

.alynivo__close {
	display: grid;
	width: 36px;
	height: 36px;
	border: 0;
	border-radius: 50%;
	place-items: center;
	background: #f4f2f7;
	color: #5c5767;
	cursor: pointer;
	font-size: 22px;
	line-height: 1;
}

.alynivo__close:hover { background: #ece9f1; color: var(--alynivo-ink); }

.alynivo__messages {
	overflow-x: hidden;
	overflow-y: auto;
	padding: 20px 16px 18px;
	background: var(--alynivo-soft);
	overscroll-behavior: contain;
	scroll-behavior: smooth;
}

.alynivo__message-row { display: flex; max-width: 90%; align-items: flex-end; gap: 8px; margin-bottom: 10px; }
.alynivo__message-row--user { margin-left: auto; justify-content: flex-end; }
.alynivo__bubble { padding: 10px 12px; border: 1px solid var(--alynivo-line); border-radius: 8px 8px 8px 2px; background: #fff; box-shadow: 0 3px 12px rgba(28, 23, 40, .04); color: var(--alynivo-ink); }
.alynivo__message-row--user .alynivo__bubble { border-color: var(--alynivo-color); border-radius: 8px 8px 2px 8px; background: var(--alynivo-color); box-shadow: 0 5px 15px rgba(114, 87, 255, .17); color: #fff; }

.alynivo__quick-replies { display: flex; align-items: stretch; flex-wrap: wrap; gap: 7px; margin: 4px 0 16px 35px; }
.alynivo__quick-replies--grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.alynivo__quick-reply { display: flex; min-height: 38px; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 11px; border: 1px solid rgba(114, 87, 255, .27); border-radius: 7px; background: #fff; color: var(--alynivo-color); cursor: pointer; font-size: 12px; font-weight: 670; text-align: left; transition: border-color .18s ease, background .18s ease, transform .18s ease; }
.alynivo__quick-reply:hover { border-color: var(--alynivo-color); background: #f2efff; transform: translateY(-1px); }
.alynivo__quick-reply small { display: grid; min-width: 23px; height: 23px; border-radius: 50%; place-items: center; background: #f1eefe; color: #7160d5; font-size: 10px; }
.alynivo__quick-replies.is-previous { margin-bottom: 8px; opacity: .48; }
.alynivo__quick-replies.is-previous button { cursor: default; transform: none; }

.alynivo__typing { display: flex; min-height: 38px; align-items: center; gap: 4px; }
.alynivo__typing i { width: 6px; height: 6px; border-radius: 50%; background: #a7a2ae; animation: alynivo-typing 1.1s infinite ease-in-out; }
.alynivo__typing i:nth-child(2) { animation-delay: .14s; }
.alynivo__typing i:nth-child(3) { animation-delay: .28s; }
.alynivo__typing span { margin-left: 6px; color: var(--alynivo-muted); font-size: 11px; }

.alynivo__product-list { display: grid; gap: 9px; margin: 3px 0 14px 35px; }
.alynivo__product { display: grid; grid-template-columns: 62px minmax(0, 1fr); gap: 11px; padding: 10px; border: 1px solid var(--alynivo-line); border-radius: 8px; background: #fff; box-shadow: 0 4px 15px rgba(28, 23, 40, .04); }
.alynivo__product img { width: 62px; height: 62px; border-radius: 6px; background: #f0eef4; object-fit: cover; }
.alynivo__product-copy { min-width: 0; }
.alynivo__product h3 { margin: 0 0 3px; overflow-wrap: anywhere; color: var(--alynivo-ink); font-size: 13px; font-weight: 700; line-height: 1.3; }
.alynivo__price { margin-bottom: 7px; color: #383440; font-size: 12px; font-weight: 720; }
.alynivo__actions { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }
.alynivo__actions a,
.alynivo__actions button { min-height: 30px; padding: 5px 8px; border: 1px solid rgba(114, 87, 255, .35); border-radius: 5px; background: #fff; color: var(--alynivo-color); cursor: pointer; font-size: 11px; font-weight: 680; text-decoration: none; }
.alynivo__actions button { border-color: var(--alynivo-color); background: var(--alynivo-color); color: #fff; }
.alynivo__actions button.is-added { border-color: #16845c; background: #16845c; }
.alynivo__actions button:disabled { cursor: wait; opacity: .7; }
.alynivo__cart-link { border: 0 !important; padding-inline: 2px !important; }

.alynivo__plan-list { display: grid; gap: 10px; margin: 3px 0 14px 35px; }
.alynivo__plan { padding: 13px; border: 1px solid var(--alynivo-line); border-radius: 8px; background: #fff; box-shadow: 0 4px 15px rgba(28, 23, 40, .04); }
.alynivo__plan h3 { margin: 0 0 10px; color: var(--alynivo-ink); font-size: 14px; font-weight: 740; }
.alynivo__plan ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.alynivo__plan li { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; padding-bottom: 8px; border-bottom: 1px solid var(--alynivo-line); font-size: 11px; }
.alynivo__plan li > span:first-child { display: grid; min-width: 0; }
.alynivo__plan li strong { overflow-wrap: anywhere; font-size: 11px; }
.alynivo__plan li small { color: var(--alynivo-muted); font-size: 10px; }
.alynivo__plan li > span:last-child { flex: 0 0 auto; font-weight: 700; }
.alynivo__plan-total { margin: 10px 0; color: var(--alynivo-ink); font-size: 16px; font-weight: 760; text-align: right; }
.alynivo__plan-choose { width: 100%; min-height: 36px; padding: 7px 10px; border: 0; border-radius: 6px; background: var(--alynivo-color); color: #fff; cursor: pointer; font-size: 12px; font-weight: 700; }
.alynivo__plan-choose:hover { filter: brightness(.95); }
.alynivo__messages > .alynivo__cart-link { display: block; margin: 4px 0 14px 35px; color: var(--alynivo-color); font-weight: 700; text-decoration: none; }

.alynivo__leave-fields {
	display: grid;
	gap: 8px;
	padding: 0 12px 8px;
	border-top: 1px solid var(--alynivo-line);
	background: #fff;
}
.alynivo__leave-fields[hidden] { display: none; }
.alynivo__leave-fields input {
	width: 100%;
	height: 38px;
	min-width: 0;
	padding: 0 12px;
	border: 1px solid #dedbe5;
	border-radius: 7px;
	background: #faf9fc;
	color: var(--alynivo-ink);
	font-size: 13px;
}
.alynivo__leave-fields input:focus {
	border-color: var(--alynivo-color);
	background: #fff;
	outline: 0;
	box-shadow: 0 0 0 3px rgba(114, 87, 255, .1);
}
.alynivo__composer { display: grid; grid-template-columns: minmax(0, 1fr) 42px; gap: 8px; padding: 11px 12px 8px; border-top: 1px solid var(--alynivo-line); background: #fff; }
.alynivo__composer--live { grid-template-columns: 42px minmax(0, 1fr) 42px; }
.alynivo__composer-hint {
	margin: 0;
	padding: 8px 14px 0;
	color: #6b6575;
	font-size: 12px;
	line-height: 1.4;
}
.alynivo__composer-hint[hidden] { display: none; }
.alynivo__composer input[name="message"] { width: 100%; height: 42px; min-width: 0; padding: 0 13px; border: 1px solid #dedbe5; border-radius: 7px; background: #faf9fc; color: var(--alynivo-ink); font-size: 13px; }
.alynivo__composer input[name="message"]::placeholder { color: #9893a2; }
.alynivo__composer input[name="message"]:focus { border-color: var(--alynivo-color); background: #fff; outline: 0; box-shadow: 0 0 0 3px rgba(114, 87, 255, .1); }
.alynivo__composer button[type="submit"] { display: grid; width: 42px; height: 42px; border: 0; border-radius: 7px; place-items: center; background: var(--alynivo-color); color: #fff; cursor: pointer; font-size: 20px; font-weight: 700; }
.alynivo__composer button[type="submit"]:hover { filter: brightness(.95); }
.alynivo__attach { display: grid; width: 42px; height: 42px; border: 1px solid #dedbe5; border-radius: 7px; place-items: center; background: #faf9fc; color: var(--alynivo-ink); cursor: pointer; font-size: 20px; font-weight: 600; line-height: 1; }
.alynivo__attach:hover:not(:disabled) { border-color: var(--alynivo-color); }
.alynivo__attach:disabled { opacity: .45; cursor: default; }
.alynivo__bubble--attachment { padding: 8px; }
.alynivo__attachment-image { display: block; max-width: min(220px, 70vw); max-height: 180px; border-radius: 6px; }
.alynivo__attachment-chip { color: inherit; font-weight: 600; text-decoration: underline; text-underline-offset: 2px; }
.alynivo__powered {
	padding: 0 12px 8px;
	background: #fff;
	color: #8a8592;
	font-size: 9px;
	line-height: 1.35;
	text-align: center;
	text-transform: uppercase;
}
.alynivo__powered--ai {
	padding-top: 7px;
	font-size: 10.5px;
	text-transform: none;
	border-top: 1px solid #f1eef4;
}
.alynivo__powered a {
	color: inherit;
	font-weight: 650;
	text-decoration: underline;
	text-underline-offset: 2px;
}
.alynivo__powered a:hover { color: var(--alynivo-color); }

@keyframes alynivo-typing {
	0%, 60%, 100% { transform: translateY(0); opacity: .45; }
	30% { transform: translateY(-3px); opacity: 1; }
}

/* Keep the desktop browser widget focused and compact. A 720px fixed panel
   leaves too much empty conversation space on tall screens and at higher
   browser zoom levels. The message area remains scrollable as threads grow.
   Phones keep their dedicated near-full-screen sheet below. */
@media (min-width: 481px) {
	.alynivo__panel {
		height: min(620px, calc(100dvh - 112px));
		min-height: 430px;
	}
}

@media (max-width: 480px) {
	.alynivo { right: 12px; bottom: 12px; left: 12px; }
	.alynivo--left { left: 12px; }
	/* Near-full-screen sheet on phones, with a visible gap at the top so the
	   page stays reachable behind it rather than a full takeover. The two
	   custom properties are only set by widget.js WHILE the composer input
	   is focused (keyboard open): they pin the panel to the Visual
	   Viewport's live top/height so the keyboard cannot expose the page
	   around the panel on iOS. At rest they are unset and the fallbacks
	   below (resting top gap, dvh height) apply. Android/Chrome resizes the
	   layout viewport natively via interactive-widget=resizes-content. */
	.alynivo__panel,
	.alynivo--left .alynivo__panel {
		position: fixed;
		right: 0;
		left: 0;
		top: var(--alynivo-vv-top, 48px);
		bottom: auto;
		width: auto;
		height: var(--alynivo-vv-height, calc(100dvh - 48px));
		min-height: 0;
		border-radius: 14px 14px 0 0;
		border-width: 1px 0 0;
	}
	/* iOS freezes `position: fixed` boxes while the keyboard is open, so no
	   amount of repositioning can guarantee the panel covers every pixel the
	   keyboard scroll exposes. Instead, make what slips through harmless: a
	   neutral curtain three screens tall sits behind the panel while the
	   chat is open, so any exposed strip shows this backdrop — never the
	   page. Painted before the panel in tree order, so it stays behind it. */
	.alynivo.is-open::before {
		content: '';
		position: fixed;
		left: 0;
		right: 0;
		top: -100dvh;
		height: 300dvh;
		background: var(--alynivo-soft);
	}
	.alynivo__launcher { width: 54px; height: 54px; }
	.alynivo__messages { padding: 16px 12px; }
	/* iOS Safari auto-zooms the whole page when a focused input's font-size
	   is below 16px. That zoom makes the layout viewport wider than the
	   screen, so the right edge of the fixed panel — including the send
	   button — lands outside the visible area and everything looks shifted.
	   16px on phones prevents the zoom entirely. */
	.alynivo__composer input[name="message"],
	.alynivo__leave-fields input { font-size: 16px; }
	.alynivo__quick-replies,
	.alynivo__product-list,
	.alynivo__plan-list { margin-left: 34px; }
	.alynivo__quick-replies--grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 350px) {
	.alynivo__quick-replies--grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
	.alynivo *, .alynivo *::before, .alynivo *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}
