/* XPATSOFT Live Chat — visitor widget. Self-contained, brand-blue, responsive. */

.xpchat{
	--xpchat-color:#0152A1;
	--xpchat-deep:#013B75;
	position:fixed;
	bottom:90px;
	z-index:2147480000;
	font-family:"Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
}
.xpchat--right{ right:22px; }
.xpchat--left{ left:22px; }

/* Launcher */
.xpchat-launcher{
	width:60px;height:60px;border:0;border-radius:50%;cursor:pointer;
	background:var(--xpchat-color);color:#fff;
	display:inline-grid !important;place-items:center;
	box-shadow:0 12px 30px rgba(1,82,161,.42);
	transition:transform .25s cubic-bezier(.22,1,.36,1),box-shadow .25s ease;
	-webkit-tap-highlight-color:transparent;
	padding:0;line-height:0;
}
/* Force the message icon to render regardless of theme SVG resets. */
.xpchat .xpchat-launcher svg{
	width:26px !important;height:26px !important;
	display:block !important;
	fill:currentColor;pointer-events:none;
}
.xpchat-launcher:hover{ transform:translateY(-3px) scale(1.05); box-shadow:0 16px 38px rgba(1,82,161,.5); }
.xpchat.is-open .xpchat-launcher{ transform:scale(.9); opacity:.9; }
.xpchat.has-session:not(.is-open) .xpchat-launcher::after{
	content:"";position:absolute;top:10px;right:10px;width:12px;height:12px;border-radius:50%;
	background:#22a06b;border:2px solid #fff;
}

/* Panel */
.xpchat-panel{
	position:absolute;bottom:74px;width:360px;max-width:calc(100vw - 32px);
	height:520px;max-height:calc(100vh - 120px);
	background:#fff;border-radius:18px;overflow:hidden;
	display:flex;flex-direction:column;
	box-shadow:0 24px 60px rgba(1,21,47,.28);
	opacity:0;visibility:hidden;transform:translateY(12px) scale(.98);
	transform-origin:bottom right;
	transition:opacity .28s ease,transform .28s cubic-bezier(.22,1,.36,1),visibility .28s ease;
}
.xpchat--right .xpchat-panel{ right:0; }
.xpchat--left .xpchat-panel{ left:0; transform-origin:bottom left; }
.xpchat.is-open .xpchat-panel{ opacity:1;visibility:visible;transform:none; }

/* Header */
.xpchat-header{
	background:linear-gradient(135deg,var(--xpchat-deep),var(--xpchat-color));
	color:#fff;padding:16px 16px;display:flex;align-items:center;justify-content:space-between;
}
.xpchat-htext{ font-family:"Poppins","Raleway",sans-serif;font-weight:800;font-size:16px;letter-spacing:-.01em;display:block; }
.xpchat-hstatus{ display:flex;align-items:center;gap:6px;font-size:12px;opacity:.92;margin-top:2px; }
.xpchat-sdot{ width:8px;height:8px;border-radius:50%;background:#9fb6d6; }
.xpchat-sdot.is-online{ background:#3ddc84;box-shadow:0 0 0 3px rgba(61,220,132,.25); }
.xpchat-close{ background:transparent;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;opacity:.9;padding:0 4px; }
.xpchat-close:hover{ opacity:1; }

/* Body */
.xpchat-body{ flex:1;display:flex;flex-direction:column;min-height:0;background:#f6f8fc; }

/* Intro + start form */
.xpchat-intro{ padding:18px 16px 6px; }
.xpchat-welcome{ margin:0;font-size:14.5px;line-height:1.55;color:#243244; }
.xpchat-start{ padding:8px 16px 16px;display:flex;flex-direction:column;gap:10px; }
.xpchat-input{
	width:100%;font:400 14.5px/1.5 inherit;color:#101826;background:#fff;
	border:1.5px solid #e2e9f3;border-radius:12px;padding:12px 13px;outline:none;
	transition:border-color .2s ease,box-shadow .2s ease;
}
.xpchat-input:focus{ border-color:var(--xpchat-color);box-shadow:0 0 0 3px rgba(1,82,161,.14); }
textarea.xpchat-input{ resize:vertical;min-height:64px; }
.xpchat-hp{ position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important; }
.xpchat-btn{
	border:0;cursor:pointer;font:800 13px/1 "Poppins","Raleway",sans-serif;letter-spacing:.06em;text-transform:uppercase;
	color:#fff;background:linear-gradient(135deg,var(--xpchat-color),var(--xpchat-deep));
	padding:14px;border-radius:12px;box-shadow:0 10px 22px rgba(1,82,161,.3);
	transition:transform .2s ease,box-shadow .2s ease;
}
.xpchat-btn:hover{ transform:translateY(-2px); }
.xpchat-btn:disabled{ opacity:.7;cursor:progress;transform:none; }

.xpchat-err{
	margin:0;padding:10px 12px;border-radius:10px;background:#fdecec;border:1px solid #f5c2c2;
	color:#a12626;font-size:13px;font-weight:600;
}

/* Messages */
.xpchat-messages{ flex:1;overflow-y:auto;padding:16px 14px;display:flex;flex-direction:column;gap:10px;-webkit-overflow-scrolling:touch; }
.xpchat-loading{ text-align:center;color:#8a94a8;font-size:13px;padding:20px 0; }
.xpchat-m{ max-width:82%;display:flex;flex-direction:column;gap:3px; }
.xpchat-m--me{ align-self:flex-end;align-items:flex-end; }
.xpchat-m--op,.xpchat-m--sys{ align-self:flex-start;align-items:flex-start; }
.xpchat-mb{
	padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.5;word-break:break-word;white-space:pre-wrap;
}
.xpchat-m--me .xpchat-mb{ background:var(--xpchat-color);color:#fff;border-bottom-right-radius:5px; }
.xpchat-m--op .xpchat-mb{ background:#fff;color:#101826;border:1px solid #e6ecf4;border-bottom-left-radius:5px; }
.xpchat-m--sys .xpchat-mb{ background:#eef2f8;color:#51607a;font-size:13px; }
.xpchat-mt{ font-size:10.5px;color:#9aa6ba;padding:0 4px; }

/* Compose */
.xpchat-compose{ display:flex;align-items:flex-end;gap:8px;padding:10px 12px;background:#fff;border-top:1px solid #e9eef5; }
.xpchat-cinput{
	flex:1;font:400 14px/1.5 inherit;color:#101826;background:#f4f7fb;
	border:1.5px solid #e2e9f3;border-radius:14px;padding:11px 13px;outline:none;resize:none;max-height:120px;
}
.xpchat-cinput:focus{ border-color:var(--xpchat-color);background:#fff; }
.xpchat-cbtn{
	flex:none;width:42px;height:42px;border:0;border-radius:12px;cursor:pointer;color:#fff;
	background:var(--xpchat-color);display:flex;align-items:center;justify-content:center;
	transition:transform .2s ease,background .2s ease;
}
.xpchat-cbtn:hover{ background:var(--xpchat-deep);transform:translateY(-1px); }
.xpchat-compose + .xpchat-err{ margin:0 12px 10px; }

@media (max-width:480px){
	.xpchat{ bottom:84px; }
	.xpchat--right{ right:16px; }
	.xpchat--left{ left:16px; }
	.xpchat-panel{ width:calc(100vw - 24px);height:calc(100vh - 96px);bottom:72px; }
}
@media (prefers-reduced-motion:reduce){
	.xpchat-launcher,.xpchat-panel,.xpchat-btn,.xpchat-cbtn{ transition:none; }
}

/* ---------- Real-time alerts for the visitor (unread badge, reply preview, sound toggle, receipts) ---------- */
.xpchat-launcher{ position:relative; }
.xpchat-unread{ position:absolute;top:-4px;right:-4px;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#E11D48;color:#fff;font:700 12px/22px -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;text-align:center;border:2px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.25);animation:xpchat-pop .35s ease-out; }
@keyframes xpchat-pop{ 0%{ transform:scale(.4); } 70%{ transform:scale(1.15); } 100%{ transform:scale(1); } }
.xpchat-preview{ position:absolute;right:0;bottom:calc(100% + 12px);width:min(290px,calc(100vw - 32px));background:#fff;color:#0f172a;border-radius:16px;box-shadow:0 12px 34px rgba(1,42,85,.28);padding:12px 34px 12px 14px;cursor:pointer;display:grid;gap:3px;font:14px/1.4 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;animation:xpchat-rise .3s ease-out; }
.xpchat-preview strong{ color:var(--xpchat-color);font-size:13px; }
.xpchat-preview span{ overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical; }
.xpchat-preview::after{ content:"";position:absolute;right:22px;bottom:-7px;width:14px;height:14px;background:#fff;transform:rotate(45deg);box-shadow:3px 3px 6px rgba(1,42,85,.12); }
.xpchat-preview-x{ position:absolute;top:6px;right:8px;border:0;background:transparent;color:#64748b;font-size:18px;line-height:1;cursor:pointer;padding:2px 4px; }
.xpchat.is-open .xpchat-preview{ display:none; }
@keyframes xpchat-rise{ from{ opacity:0;transform:translateY(8px); } to{ opacity:1;transform:none; } }
.xpchat-sound{ background:transparent;border:0;color:#fff;font-size:17px;line-height:1;cursor:pointer;opacity:.9;padding:2px 6px;margin-left:auto; }
.xpchat-sound:hover,.xpchat-sound:focus-visible{ opacity:1; }
.xpchat-st{ font-size:11px;color:#64748b;margin-top:3px;text-align:right; }
.xpchat-st.is-seen{ color:var(--xpchat-color);font-weight:600; }
@media (prefers-reduced-motion:reduce){ .xpchat-unread,.xpchat-preview{ animation:none; } }
.xpchat--left .xpchat-preview{ right:auto;left:0; }
.xpchat--left .xpchat-preview::after{ right:auto;left:22px; }
