
#ssaic-widget{--ssaic-primary:#4F46E5;--ssaic-secondary:#818CF8;--ssaic-radius:16px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;z-index:99999;direction:rtl}
.ssaic-widget{position:fixed;bottom:24px}.ssaic-pos-bottom-right{right:24px}.ssaic-pos-bottom-left{left:24px}
.ssaic-toggle{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,var(--ssaic-primary),var(--ssaic-secondary));border:none;color:#fff;cursor:pointer;box-shadow:0 4px 20px rgba(79,70,229,.4);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.ssaic-toggle:hover{transform:scale(1.08)}.ssaic-toggle.open .ssaic-icon-chat{display:none}.ssaic-toggle.open .ssaic-icon-close{display:block!important}
.ssaic-window{position:absolute;bottom:76px;width:var(--ssaic-w,380px);max-width:calc(100vw - 32px);height:var(--ssaic-h,520px);max-height:calc(100vh - 120px);background:#fff;border-radius:var(--ssaic-radius);box-shadow:0 12px 48px rgba(15,23,42,.18);display:none;flex-direction:column;overflow:hidden;animation:ssaic-up .25s ease}
.ssaic-pos-bottom-right .ssaic-window{right:0}.ssaic-pos-bottom-left .ssaic-window{left:0}
@keyframes ssaic-up{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.ssaic-header-bar{background:linear-gradient(135deg,var(--ssaic-primary),var(--ssaic-secondary));color:#fff;padding:14px 16px;display:flex;align-items:center;justify-content:space-between}
.ssaic-header-info{display:flex;align-items:center;gap:10px}
.ssaic-avatar{width:40px;height:40px;background:rgba(255,255,255,.2);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px}
.ssaic-name{font-weight:600;font-size:15px}.ssaic-status{font-size:12px;opacity:.85;display:flex;align-items:center;gap:5px}
.ssaic-dot{width:7px;height:7px;background:#4ade80;border-radius:50%;display:inline-block}
.ssaic-header-actions{display:flex;gap:4px}
.ssaic-icon-btn{background:rgba(255,255,255,.15);border:none;color:#fff;width:32px;height:32px;border-radius:8px;cursor:pointer;font-size:14px}
.ssaic-messages{flex:1;overflow-y:auto;padding:16px;background:#f8fafc;display:flex;flex-direction:column;gap:10px}
.ssaic-msg{display:flex;max-width:85%}.ssaic-msg-bot{align-self:flex-start}.ssaic-msg-user{align-self:flex-end}
.ssaic-bubble{padding:10px 14px;border-radius:14px;font-size:14px;line-height:1.55;word-break:break-word}
.ssaic-msg-bot .ssaic-bubble{background:#fff;color:#1e293b;border:1px solid #e2e8f0;border-bottom-right-radius:4px}
.ssaic-msg-user .ssaic-bubble{background:var(--ssaic-primary);color:#fff;border-bottom-left-radius:4px}
.ssaic-typing{display:flex;gap:4px;padding:12px 16px}
.ssaic-typing span{width:7px;height:7px;background:#94a3b8;border-radius:50%;animation:ssaic-bounce 1.2s infinite}
.ssaic-typing span:nth-child(2){animation-delay:.15s}.ssaic-typing span:nth-child(3){animation-delay:.3s}
@keyframes ssaic-bounce{0%,60%,100%{transform:translateY(0)}30%{transform:translateY(-5px)}}
.ssaic-product-card{background:#fff;border:1px solid #e2e8f0;border-radius:12px;padding:10px;display:flex;gap:10px;align-items:center;margin-top:6px}
.ssaic-product-card img{width:48px;height:48px;object-fit:cover;border-radius:8px}
.ssaic-pc-name{font-size:13px;font-weight:600}.ssaic-pc-price{font-size:12px;color:var(--ssaic-primary)}
.ssaic-add-cart-btn{background:var(--ssaic-primary);color:#fff;border:none;padding:6px 12px;border-radius:8px;font-size:12px;cursor:pointer}
.ssaic-quick-replies{padding:8px 12px;display:flex;flex-wrap:wrap;gap:6px;background:#fff;border-top:1px solid #f1f5f9}
.ssaic-qr-btn{background:#EEF2FF;color:var(--ssaic-primary);border:1px solid #c7d2fe;padding:6px 12px;border-radius:20px;font-size:12px;cursor:pointer}
.ssaic-input-area{display:flex;align-items:flex-end;gap:8px;padding:12px;background:#fff;border-top:1px solid #e2e8f0}
#ssaic-input{flex:1;border:1px solid #e2e8f0;border-radius:12px;padding:10px 14px;font-size:14px;resize:none;max-height:100px;outline:none;font-family:inherit}
#ssaic-input:focus{border-color:var(--ssaic-primary)}
.ssaic-send-btn{width:42px;height:42px;border-radius:12px;background:var(--ssaic-primary);color:#fff;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ssaic-send-btn:disabled{opacity:.5}
.ssaic-rating{display:flex;gap:4px;margin-top:6px}
.ssaic-rating button{background:none;border:none;font-size:18px;cursor:pointer;opacity:.4}
.ssaic-rating button:hover,.ssaic-rating button.active{opacity:1}
.ssaic-theme-minimal .ssaic-header-bar{background:#1e293b}
.ssaic-theme-luxury .ssaic-header-bar{background:linear-gradient(135deg,#1a1a2e,#16213e)}
.ssaic-theme-luxury .ssaic-toggle{background:linear-gradient(135deg,#c9a227,#e8d48b);color:#1a1a2e}
@media(max-width:480px){.ssaic-window{width:calc(100vw - 16px);height:calc(100vh - 100px);bottom:70px}}


/* ---- Action bar: operator + end (screenshot style) ---- */
.ssaic-action-bar{
	display:none;
	gap:8px;
	padding:10px 12px 8px;
	border-top:1px solid #eef2ff;
	background:#fff;
	direction:rtl;
	flex-shrink:0;
}
.ssaic-action-bar.ssaic-show{
	display:flex !important;
}
.ssaic-action-btn{
	flex:1;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	padding:9px 12px;
	border-radius:999px;
	border:1.5px solid #e2e8f0;
	background:#fff;
	font-size:12px;
	font-weight:600;
	cursor:pointer;
	transition:all .18s ease;
	color:#475569;
	line-height:1.25;
	box-shadow:0 1px 2px rgba(15,23,42,.04);
}
.ssaic-action-btn:hover{
	transform:translateY(-1px);
	box-shadow:0 4px 14px rgba(79,70,229,.12);
}
.ssaic-action-icon{font-size:13px;line-height:1}
.ssaic-btn-operator{
	border-color:#c7d2fe;
	color:#4338ca;
	background:linear-gradient(180deg,#f5f7ff 0%,#eef2ff 100%);
}
.ssaic-btn-operator:hover{background:#e0e7ff;border-color:#a5b4fc}
.ssaic-btn-end{
	border-color:#d1d5db;
	color:#475569;
	background:#fff;
}
.ssaic-btn-end:hover{background:#f8fafc;border-color:#94a3b8}
.ssaic-action-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;box-shadow:none}
.ssaic-msg-system .ssaic-bubble{
	background:#f1f5f9!important;
	color:#64748b!important;
	font-size:12px;
	text-align:center;
	width:100%;
	border:1px dashed #cbd5e1;
}
.ssaic-msg-operator .ssaic-bubble{
	background:#fef3c7!important;
	color:#92400e!important;
	border:1px solid #fde68a;
}


/* ACTION BAR FORCE VISIBLE */
#ssaic-window{display:none;flex-direction:column;}
#ssaic-window.ssaic-open{display:flex !important;}
#ssaic-messages{flex:1 1 auto;min-height:0;overflow-y:auto;}
#ssaic-action-bar{
	flex:0 0 auto;
	gap:8px;
	padding:10px 12px;
	border-top:1px solid #e8ecf5;
	background:#fff;
	direction:rtl;
}
#ssaic-action-bar[hidden]{display:none !important;}
#ssaic-action-bar.ssaic-show,
#ssaic-action-bar.is-visible{
	display:flex !important;
}
#ssaic-action-bar .ssaic-action-btn{
	flex:1;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:6px;
	padding:9px 12px;
	border-radius:999px;
	border:1.5px solid #e2e8f0;
	background:#fff;
	font-size:12px;
	font-weight:600;
	cursor:pointer;
	color:#475569;
	line-height:1.25;
}
#ssaic-btn-operator{
	border-color:#c7d2fe !important;
	color:#4338ca !important;
	background:linear-gradient(180deg,#f5f7ff,#eef2ff) !important;
}
#ssaic-btn-end{
	border-color:#d1d5db !important;
	color:#475569 !important;
	background:#fff !important;
}
#ssaic-input-area, .ssaic-input-area{flex:0 0 auto;}

/* Refined chat visuals */
.ssaic-header-bar{background:var(--ssaic-header,var(--ssaic-primary)) !important}
.ssaic-msg-user .ssaic-bubble{
	background:var(--ssaic-user-bubble,var(--ssaic-primary)) !important;
	color:#fff !important;
	border-radius:16px 16px 4px 16px;
	box-shadow:0 4px 14px rgba(79,70,229,.18);
}
.ssaic-msg-bot .ssaic-bubble{
	background:var(--ssaic-bot-bubble,#F1F5F9) !important;
	color:var(--ssaic-bot-text,#1E293B) !important;
	border-radius:16px 16px 16px 4px;
}
.ssaic-qr-btn{
	background:var(--ssaic-qr-bg,#EEF2FF) !important;
	color:var(--ssaic-qr-text,var(--ssaic-primary)) !important;
	border:1px solid var(--ssaic-qr-border,#C7D2FE) !important;
	border-radius:999px !important;
	padding:8px 14px !important;
	font-weight:600;
	transition:transform .15s ease,box-shadow .15s ease;
}
.ssaic-qr-btn:hover{transform:translateY(-1px);box-shadow:0 4px 12px rgba(79,70,229,.12)}

/* Product card — responsive & premium */
.ssaic-product-card{
	background:#fff;
	border:1px solid #e8ecf4;
	border-radius:16px;
	padding:12px;
	display:flex;
	gap:12px;
	align-items:center;
	margin-top:8px;
	box-shadow:0 6px 20px rgba(15,23,42,.06);
	width:100%;
	max-width:100%;
	box-sizing:border-box;
	flex-wrap:wrap;
}
.ssaic-product-card img{
	width:64px;
	height:64px;
	object-fit:cover;
	border-radius:12px;
	flex-shrink:0;
	background:#f8fafc;
}
.ssaic-pc-info{flex:1;min-width:120px}
.ssaic-pc-name{font-size:13px;font-weight:700;color:#0f172a;line-height:1.4;margin-bottom:4px}
.ssaic-pc-price{font-size:13px;font-weight:700;color:var(--ssaic-primary)}
.ssaic-add-cart-btn{
	width:100%;
	margin-top:4px;
	background:var(--ssaic-primary);
	color:#fff !important;
	border:none;
	border-radius:10px;
	padding:8px 12px;
	font-size:12px;
	font-weight:700;
	cursor:pointer;
}
.ssaic-add-cart-btn:hover{filter:brightness(1.05)}
@media(min-width:380px){
	.ssaic-add-cart-btn{width:auto;margin-top:0}
	.ssaic-product-card{flex-wrap:nowrap}
}

/* Admin color grid */
.ssaic-color-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}


/* Product card — fixed responsive layout */
.ssaic-product-card{
	display:grid !important;
	grid-template-columns:56px 1fr 40px;
	align-items:center;
	gap:10px;
	width:100%;
	max-width:100%;
	box-sizing:border-box;
	background:#fff;
	border:1px solid #e8ecf4;
	border-radius:14px;
	padding:10px;
	margin-top:8px;
	box-shadow:0 4px 16px rgba(15,23,42,.06);
	overflow:hidden;
}
.ssaic-pc-img{
	width:56px;height:56px;
	border-radius:10px;
	overflow:hidden;
	background:#f8fafc;
	flex-shrink:0;
}
.ssaic-pc-img img,
.ssaic-product-card > img{
	width:56px !important;
	height:56px !important;
	object-fit:cover;
	border-radius:10px;
	display:block;
}
.ssaic-pc-info{
	min-width:0; /* critical for text truncation in grid */
	overflow:hidden;
}
.ssaic-pc-name{
	font-size:12px;
	font-weight:700;
	color:#0f172a;
	line-height:1.35;
	margin-bottom:4px;
	display:-webkit-box;
	-webkit-line-clamp:2;
	-webkit-box-orient:vertical;
	overflow:hidden;
	word-break:break-word;
}
.ssaic-pc-price{
	font-size:12px;
	font-weight:700;
	color:var(--ssaic-primary,#4F46E5);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}
.ssaic-add-cart-btn{
	width:36px !important;
	height:36px !important;
	min-width:36px !important;
	max-width:36px !important;
	padding:0 !important;
	margin:0 !important;
	border:none !important;
	border-radius:10px !important;
	background:var(--ssaic-primary,#4F46E5) !important;
	color:#fff !important;
	display:inline-flex !important;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	flex-shrink:0;
	box-shadow:0 2px 8px rgba(79,70,229,.25);
}
.ssaic-add-cart-btn:hover{filter:brightness(1.08);transform:scale(1.05)}
.ssaic-add-cart-btn svg{display:block;pointer-events:none}
@media(max-width:360px){
	.ssaic-product-card{grid-template-columns:48px 1fr 36px;gap:8px;padding:8px}
	.ssaic-pc-img,.ssaic-pc-img img,.ssaic-product-card>img{width:48px!important;height:48px!important}
}

/* Qty + cart controls */
.ssaic-pc-cart{
	display:flex;
	flex-direction:column;
	align-items:center;
	gap:6px;
	flex-shrink:0;
}
.ssaic-qty{
	display:inline-flex;
	align-items:center;
	border:1px solid #e2e8f0;
	border-radius:8px;
	overflow:hidden;
	background:#fff;
}
.ssaic-qty-btn{
	width:26px;height:26px;
	border:none;background:#f8fafc;
	cursor:pointer;font-size:14px;font-weight:700;
	color:#334155;line-height:1;
}
.ssaic-qty-btn:hover{background:#eef2ff;color:#4F46E5}
.ssaic-qty-val{
	width:28px;height:26px;border:none;
	text-align:center;font-size:12px;font-weight:700;
	color:#0f172a;background:#fff;padding:0;
	-moz-appearance:textfield;
}
.ssaic-qty-val::-webkit-outer-spin-button,
.ssaic-qty-val::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.ssaic-product-card{
	grid-template-columns:56px 1fr auto !important;
}
.ssaic-add-cart-btn.is-loading{opacity:.6;pointer-events:none}
.ssaic-add-cart-btn.is-added{background:#059669 !important}

/* Toast */
.ssaic-toast{
	position:absolute;bottom:80px;left:50%;
	transform:translateX(-50%) translateY(10px);
	background:#0f172a;color:#fff;
	padding:8px 14px;border-radius:10px;
	font-size:12px;font-weight:600;
	opacity:0;pointer-events:none;
	transition:all .25s ease;z-index:10;
	white-space:nowrap;max-width:90%;
}
.ssaic-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.ssaic-toast-err{background:#b91c1c}

/* Minimize button clickable */
.ssaic-icon-btn{
	position:relative;z-index:5;
	pointer-events:auto !important;
	cursor:pointer !important;
}
.ssaic-header-actions{position:relative;z-index:6}

/* Mobile visibility & dimensions */
@media (max-width: 768px) {
	body.ssaic-hide-mobile #ssaic-widget { display: none !important; }
	#ssaic-widget.ssaic-mobile-on #ssaic-window.ssaic-open {
		width: var(--ssaic-mobile-w, calc(100vw - 16px)) !important;
		height: var(--ssaic-mobile-h, calc(100vh - 90px)) !important;
		max-width: calc(100vw - 12px) !important;
		max-height: calc(100vh - 80px) !important;
		bottom: 70px;
		right: 6px;
		left: 6px;
		margin: 0 auto;
		border-radius: 14px;
	}
	#ssaic-widget.ssaic-mobile-on .ssaic-toggle {
		width: 54px; height: 54px;
	}
	#ssaic-widget.ssaic-mobile-on .ssaic-product-card {
		grid-template-columns: 48px 1fr auto !important;
	}
}
