#aljww-root, #aljww-root *{
	box-sizing:border-box;
}
#aljww-root{
	--aljww-ink:#231536;
	--aljww-ink-soft:#5c5470;
	--aljww-paper:#F6F5F2;
	--aljww-card:#FFFFFF;
	--aljww-line:rgba(51,30,79,0.10);
	--aljww-shadow:0 20px 45px rgba(51,30,79,0.22);
	--aljww-radius:20px;

	position:fixed;
	z-index:999999;
	right:24px;
	bottom:24px;
	font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
	line-height:1.4;
}

/* launcher area: pinned bottom-right, grows leftward as the button expands */
.aljww-launcher-area{
	position:relative;
	min-height:64px;
	display:flex; justify-content:flex-end; align-items:flex-end;
}

/* the launcher itself: starts as a bare circle, morphs into a full pill */
.aljww-launcher{
	height:64px;
	border-radius:999px;
	background:linear-gradient(155deg,var(--aljww-primary) 0%,var(--aljww-primary-dark) 100%);
	border:none;cursor:pointer;
	display:inline-flex;align-items:center;
	box-shadow:0 14px 30px rgba(0,0,0,0.28);
	position:relative;
	padding:0;
	transition:box-shadow .25s ease, transform .25s ease;
}
.aljww-launcher:hover{transform:translateY(-2px);}

.aljww-launcher-icon{
	width:64px;height:64px;border-radius:50%;
	background:#fff;
	display:flex;align-items:center;justify-content:center;
	position:relative;flex-shrink:0;
}
.aljww-launcher-icon .aljww-ring{
	position:absolute;inset:-6px;border-radius:50%;
	border:2px solid var(--aljww-primary);
	opacity:0.55;
	animation:aljww-pulse 2.4s ease-out infinite;
}
@keyframes aljww-pulse{
	0%{transform:scale(.85);opacity:.55;}
	70%{transform:scale(1.18);opacity:0;}
	100%{opacity:0;}
}
.aljww-launcher svg{width:26px;height:26px;transition:opacity .15s ease, transform .15s ease;}
.aljww-launcher .aljww-icon-close{position:absolute;opacity:0;transform:scale(.6) rotate(-45deg);}
#aljww-root.open .aljww-launcher .aljww-icon-chat{opacity:0;transform:scale(.6) rotate(45deg);}
#aljww-root.open .aljww-launcher .aljww-icon-close{opacity:1;transform:scale(1) rotate(0);}

/* small green/grey "online" dot on the icon corner */
.aljww-dot-status{
	position:absolute; top:1px; left:1px;
	width:14px;height:14px;border-radius:50%;
	background:var(--aljww-primary); border:2px solid #fff;
	transition:opacity .2s ease, transform .2s ease;
}
#aljww-root.is-offline .aljww-dot-status{background:#8b8698;}
#aljww-root.aljww-unread .aljww-dot-status,
#aljww-root.open .aljww-dot-status{ opacity:0; transform:scale(.4); }

/* red unread badge, replaces the status dot once the button expands */
.aljww-badge{
	position:absolute; top:-4px; left:-4px;
	width:20px;height:20px;border-radius:50%;
	background:#E8442D;border:2px solid #fff;
	color:#fff;font-size:11px;font-weight:700;line-height:1;
	display:flex;align-items:center;justify-content:center;
	opacity:0; transform:scale(.4);
	transition:opacity .2s ease, transform .2s ease;
}
#aljww-root.aljww-unread .aljww-badge{ opacity:1; transform:scale(1); }
#aljww-root.open .aljww-badge,
#aljww-root.aljww-seen .aljww-badge{ opacity:0; transform:scale(.4); }

/* the text label that slides/fades in as the button expands into a pill */
.aljww-launcher-text{
	display:inline-block;
	color:#fff;font-weight:700;font-size:14.5px;line-height:1.3;
	white-space:nowrap; max-width:0; overflow:hidden;
	opacity:0; margin-left:0;
	transition:max-width .32s ease, opacity .28s ease, margin-left .32s ease;
}
.aljww-launcher.aljww-expanded{ padding-right:20px; }
.aljww-launcher.aljww-expanded .aljww-launcher-text{
	max-width:220px; opacity:1; margin-left:12px;
}
#aljww-root.open .aljww-launcher{ padding-right:0; }
#aljww-root.open .aljww-launcher-text{ max-width:0; opacity:0; margin-left:0; }

/* "typt..." teaser bubble, floats briefly above the button before it expands */
.aljww-teaser{
	position:absolute; right:0; bottom:76px;
	height:44px; padding:0 18px;
	border-radius:22px;
	background:var(--aljww-secondary);
	display:flex; align-items:center; gap:5px;
	box-shadow:0 14px 30px rgba(0,0,0,0.28);
	opacity:0; transform:translateY(8px) scale(.95);
	pointer-events:none;
	transition:opacity .25s ease, transform .25s ease;
	cursor:pointer;
}
.aljww-teaser.show{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
.aljww-teaser span{
	width:6px;height:6px;border-radius:50%;
	background:rgba(255,255,255,0.8);
	animation:aljww-bounce 1.1s infinite;
}
.aljww-teaser span:nth-child(2){animation-delay:.15s;}
.aljww-teaser span:nth-child(3){animation-delay:.3s;}

/* panel */
.aljww-panel{
	position:absolute; bottom:80px; right:0;
	width:360px; max-width:calc(100vw - 32px);
	height:520px; max-height:calc(100vh - 140px);
	background:var(--aljww-card);
	border-radius:var(--aljww-radius);
	box-shadow:var(--aljww-shadow);
	display:flex; flex-direction:column;
	overflow:hidden;
	opacity:0; transform:translateY(16px) scale(.97);
	pointer-events:none;
	transition:opacity .22s ease, transform .22s ease;
	margin:0;
}
#aljww-root.open .aljww-panel{
	opacity:1; transform:translateY(0) scale(1); pointer-events:auto;
}

.aljww-header{
	background:linear-gradient(135deg,var(--aljww-secondary) 0%, var(--aljww-secondary) 100%);
	padding:20px 20px 38px;
	position:relative;
	flex-shrink:0;
}
.aljww-header::after{
	content:"";position:absolute;left:0;right:0;top:100%;height:18px;
	transform:translateY(-18px);
	background:var(--aljww-paper);
	border-radius:18px 18px 0 0;
}
.aljww-header-top{display:flex;align-items:flex-start;justify-content:space-between;}
.aljww-id{display:flex;align-items:center;gap:12px;}
.aljww-avatar{
	width:42px;height:42px;border-radius:12px;
	background:var(--aljww-primary);
	display:flex;align-items:center;justify-content:center;
	color:var(--aljww-secondary);font-weight:700;font-size:16px;
	flex-shrink:0;
	overflow:hidden;
}
.aljww-avatar img{
	width:100%;height:100%;object-fit:cover;display:block;
}
.aljww-id h3{margin:0;color:#fff;font-size:16px;font-weight:700;line-height:1.3;}
.aljww-status{display:flex;align-items:center;gap:6px;margin-top:3px;}
.aljww-status .aljww-dot{width:7px;height:7px;border-radius:50%;background:var(--aljww-primary);box-shadow:0 0 0 3px rgba(255,255,255,0.12);}
#aljww-root.is-offline .aljww-status .aljww-dot{background:#8b8698;}
.aljww-status span.aljww-status-text{font-size:12px;color:rgba(255,255,255,0.6);}
.aljww-close{
	background:rgba(255,255,255,0.08);border:none;border-radius:8px;
	width:28px;height:28px;display:flex;align-items:center;justify-content:center;
	cursor:pointer;color:rgba(255,255,255,0.7);flex-shrink:0;
}
.aljww-close:hover{background:rgba(255,255,255,0.16);color:#fff;}
.aljww-close svg{width:14px;height:14px;}

.aljww-body{
	flex:1; overflow-y:auto; padding:22px 18px 14px;
	display:flex; flex-direction:column; gap:12px;
	background:var(--aljww-paper);
	position:relative; z-index:1;
}
.aljww-row{display:flex;gap:8px;align-items:flex-end;}
.aljww-row .aljww-mini-avatar{
	width:24px;height:24px;border-radius:7px;background:var(--aljww-secondary);
	display:flex;align-items:center;justify-content:center;flex-shrink:0;
	overflow:hidden;
}
.aljww-row .aljww-mini-avatar span{color:var(--aljww-primary);font-weight:700;font-size:11px;}
.aljww-row .aljww-mini-avatar img{width:100%;height:100%;object-fit:cover;display:block;}
.aljww-bubble{
	background:#fff; border:1px solid var(--aljww-line);
	padding:11px 14px; border-radius:14px 14px 14px 4px;
	font-size:14px; line-height:1.5; color:var(--aljww-ink);
	max-width:78%;
	box-shadow:0 2px 8px rgba(51,30,79,0.05);
	opacity:0; transform:translateY(6px);
	animation:aljww-in .35s ease forwards;
	margin:0;
}
@keyframes aljww-in{to{opacity:1;transform:translateY(0);}}

.aljww-typing{display:flex;gap:4px;align-items:center;padding:12px 14px;background:#fff;border:1px solid var(--aljww-line);border-radius:14px 14px 14px 4px;width:fit-content;}
.aljww-typing span{width:6px;height:6px;border-radius:50%;background:var(--aljww-ink-soft);opacity:.5;animation:aljww-bounce 1.1s infinite;}
.aljww-typing span:nth-child(2){animation-delay:.15s;}
.aljww-typing span:nth-child(3){animation-delay:.3s;}
@keyframes aljww-bounce{0%,60%,100%{transform:translateY(0);opacity:.5;}30%{transform:translateY(-4px);opacity:1;}}

.aljww-quickcta{
	margin:6px 0 4px;
	display:flex; align-items:center; gap:10px;
	background:#fff; border:1px solid var(--aljww-line);
	border-radius:14px; padding:12px 14px;
	text-decoration:none; cursor:pointer;
}
.aljww-quickcta .aljww-wa-ic{
	width:32px;height:32px;border-radius:50%;background:var(--aljww-primary);
	display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.aljww-quickcta .aljww-wa-ic svg{width:17px;height:17px;fill:#fff;}
.aljww-quickcta .aljww-txt b{display:block;font-size:13px;color:var(--aljww-ink);}
.aljww-quickcta .aljww-txt span{font-size:11.5px;color:var(--aljww-ink-soft);}
.aljww-quickcta:hover{border-color:var(--aljww-primary);}

.aljww-footer{
	flex-shrink:0; padding:12px 14px 14px;
	background:#fff; border-top:1px solid var(--aljww-line);
}
.aljww-inputwrap{
	display:flex; align-items:flex-end; gap:8px;
	background:var(--aljww-paper); border:1px solid var(--aljww-line);
	border-radius:16px; padding:6px 6px 6px 14px;
}
.aljww-inputwrap textarea{
	flex:1; border:none; background:transparent; resize:none;
	font-family:inherit; font-size:14px; line-height:1.4; color:var(--aljww-ink);
	padding:8px 0; max-height:70px; outline:none;
}
.aljww-inputwrap textarea::placeholder{color:var(--aljww-ink-soft);}
.aljww-send{
	width:38px;height:38px;border-radius:12px;border:none;flex-shrink:0;
	background:var(--aljww-primary); cursor:pointer;
	display:flex;align-items:center;justify-content:center;
	transition:transform .15s ease, background .15s ease;
	padding:0;
}
.aljww-send:hover{transform:scale(1.05);}
.aljww-send:disabled{background:#d8d8d8;cursor:default;transform:none;}
.aljww-send svg{width:17px;height:17px;fill:#fff;}
.aljww-foot-note{
	display:flex;align-items:center;gap:6px;
	font-size:11px;color:var(--aljww-ink-soft);margin-top:9px;padding-left:2px;
}
.aljww-foot-note svg{width:12px;height:12px;fill:var(--aljww-primary);flex-shrink:0;}

@media (max-width:480px){
	#aljww-root{right:12px;bottom:12px;}
	.aljww-panel{
		width:calc(100vw - 24px); height:calc(100vh - 110px);
		bottom:78px; right:-4px;
	}
}