/*
 * مساعد iCloudITS — واجهة المحادثة (RTL)
 *
 * ملاحظة مهمة: كل القواعد مُسندة إلى #icloudits-ai-root لرفع أولويتها فوق
 * تنسيقات القالب (Elementor وغيره)، مع !important على الخصائص التي تعبث بها
 * القوالب عادة: الخلفية واللون والخط والحواف. بدون ذلك يرث الزر لون أزرار
 * القالب (وقد يظهر زهريًا) ويتغيّر خطه.
 */

#icloudits-ai-root {
	--icai-accent: #0b63ce;
	--icai-accent-dark: #0951a8;
	--icai-bg: #ffffff;
	--icai-text: #16202e;
	--icai-muted: #6b7a90;
	--icai-line: #e6ebf2;
	--icai-bot-bg: #f2f5fa;
	--surface: #ffffff;
	--icai-radius: 16px;
	--icai-font: "Tajawal", "Cairo", "IBM Plex Sans Arabic", "Segoe UI", system-ui, -apple-system, "Helvetica Neue", sans-serif;
	--icai-offset-bottom: 20px;
	--icai-offset-side: 20px;

	position: fixed !important;
	z-index: 2147483000 !important;
	bottom: var(--icai-offset-bottom) !important;
	font-family: var(--icai-font) !important;
	direction: rtl !important;
	line-height: 1.6 !important;
	letter-spacing: normal !important;
	text-align: right;
	box-sizing: border-box;
}

#icloudits-ai-root *,
#icloudits-ai-root *::before,
#icloudits-ai-root *::after {
	box-sizing: border-box;
	font-family: var(--icai-font) !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	text-shadow: none !important;
}

#icloudits-ai-root.icai-right { right: var(--icai-offset-side) !important; left: auto !important; }
#icloudits-ai-root.icai-left  { left: var(--icai-offset-side) !important; right: auto !important; }

/* ── الزر العائم ── */
#icloudits-ai-root .icai-fab {
	position: relative;
	display: flex !important;
	align-items: center;
	gap: 9px;
	background: var(--icai-accent) !important;
	background-image: none !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 999px !important;
	padding: 12px 19px 12px 15px !important;
	margin: 0 !important;
	font-size: 14.5px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	cursor: pointer;
	box-shadow: 0 10px 28px rgba(11, 99, 206, .34) !important;
	transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
	min-height: 0;
	width: auto !important;
	text-decoration: none !important;
	appearance: none;
	-webkit-appearance: none;
}
#icloudits-ai-root .icai-fab:hover,
#icloudits-ai-root .icai-fab:focus {
	background: var(--icai-accent-dark) !important;
	color: #fff !important;
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(11, 99, 206, .42) !important;
	outline: none;
}
#icloudits-ai-root .icai-fab:active { transform: translateY(0); }
#icloudits-ai-root .icai-fab svg { width: 19px; height: 19px; flex: none; display: block; }
#icloudits-ai-root .icai-fab span { color: #fff !important; font-weight: 700 !important; }
#icloudits-ai-root .icai-fab.icai-hidden { display: none !important; }

/* ── لوحة المحادثة ── */
#icloudits-ai-root .icai-panel {
	display: none;
	flex-direction: column;
	width: 344px;
	max-width: calc(100vw - 30px);
	height: 516px;
	max-height: calc(100vh - 120px);
	background: var(--icai-bg) !important;
	border: 1px solid var(--icai-line) !important;
	border-radius: var(--icai-radius) !important;
	box-shadow: 0 18px 48px rgba(16, 32, 56, .18) !important;
	overflow: hidden;
}
#icloudits-ai-root .icai-panel.icai-open {
	display: flex;
	animation: icai-in .22s ease-out;
}
@keyframes icai-in {
	from { opacity: 0; transform: translateY(14px) scale(.98); }
	to   { opacity: 1; transform: none; }
}

/* الترويسة */
#icloudits-ai-root .icai-head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 13px 15px;
	background: var(--icai-accent) !important;
	color: #fff !important;
	flex: none;
}
#icloudits-ai-root .icai-avatar {
	width: 34px; height: 34px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .2);
	display: grid; place-items: center;
	flex: none;
}
#icloudits-ai-root .icai-avatar svg { width: 18px; height: 18px; }
#icloudits-ai-root .icai-head-txt { flex: 1; min-width: 0; }
#icloudits-ai-root .icai-head-title {
	font-size: 14.5px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	color: #fff !important;
	margin: 0 !important;
}
#icloudits-ai-root .icai-head-sub {
	font-size: 12.5px !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	color: rgba(255, 255, 255, .9) !important;
	display: flex; align-items: center; gap: 5px;
	margin-top: 2px;
}
#icloudits-ai-root .icai-dot { width: 7px; height: 7px; border-radius: 50%; background: #4ade80; flex: none; }
#icloudits-ai-root .icai-x {
	background: none !important;
	border: 0 !important;
	color: #fff !important;
	cursor: pointer;
	padding: 6px !important;
	border-radius: 8px !important;
	line-height: 0 !important;
	opacity: .85;
	box-shadow: none !important;
	min-height: 0;
	width: auto !important;
}
#icloudits-ai-root .icai-x:hover { opacity: 1; background: rgba(255, 255, 255, .15) !important; }
#icloudits-ai-root .icai-x svg { width: 18px; height: 18px; display: block; }

/* الرسائل */
#icloudits-ai-root .icai-body {
	flex: 1;
	overflow-y: auto;
	padding: 14px 13px;
	display: flex;
	flex-direction: column;
	gap: 9px;
	background: #fbfcfe !important;
	overscroll-behavior: contain;
}
#icloudits-ai-root .icai-msg {
	max-width: 86%;
	padding: 11px 13px;
	border-radius: 13px;
	font-size: 14.5px !important;
	font-weight: 400 !important;
	line-height: 1.8 !important;
	white-space: pre-wrap;
	word-wrap: break-word;
	margin: 0 !important;
	animation: icai-msg-in .2s ease-out;
}
@keyframes icai-msg-in {
	from { opacity: 0; transform: translateY(6px); }
	to   { opacity: 1; transform: none; }
}
#icloudits-ai-root .icai-bot {
	align-self: flex-start;
	background: var(--icai-bot-bg) !important;
	color: var(--icai-text) !important;
	border-bottom-right-radius: 5px;
}
#icloudits-ai-root .icai-user {
	align-self: flex-end;
	background: var(--icai-accent) !important;
	color: #fff !important;
	border-bottom-left-radius: 5px;
}
#icloudits-ai-root .icai-note {
	align-self: center;
	background: #fff6e5 !important;
	color: #7a5a12 !important;
	border: 1px solid #f3e2bd !important;
	font-size: 14px !important;
	max-width: 94%;
	text-align: center;
}
#icloudits-ai-root .icai-msg strong { font-weight: 700 !important; color: inherit !important; }
#icloudits-ai-root .icai-msg a { color: inherit !important; text-decoration: underline !important; }

/* مؤشر الكتابة */
#icloudits-ai-root .icai-typing {
	align-self: flex-start;
	background: var(--icai-bot-bg) !important;
	border-radius: 14px;
	border-bottom-right-radius: 5px;
	padding: 14px 16px;
	display: flex; gap: 4px;
}
#icloudits-ai-root .icai-typing span {
	width: 7px; height: 7px; border-radius: 50%;
	background: var(--icai-muted);
	animation: icai-blink 1.3s infinite;
}
#icloudits-ai-root .icai-typing span:nth-child(2) { animation-delay: .2s; }
#icloudits-ai-root .icai-typing span:nth-child(3) { animation-delay: .4s; }
@keyframes icai-blink {
	0%, 60%, 100% { opacity: .28; transform: translateY(0); }
	30%           { opacity: 1;   transform: translateY(-3px); }
}

/* ── شبكة أهم الخدمات ── */
#icloudits-ai-root .icai-svc {
	margin-top: 4px;
	animation: icai-msg-in .25s ease-out;
}
#icloudits-ai-root .icai-svc-head {
	color: var(--icai-muted) !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	margin: 0 2px 9px !important;
}
#icloudits-ai-root .icai-grid {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr);
	gap: 6px;
}
#icloudits-ai-root .icai-tile {
	display: flex !important;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	background: #fff !important;
	background-image: none !important;
	border: 1px solid var(--icai-line) !important;
	border-radius: 11px !important;
	padding: 9px 5px 8px !important;
	margin: 0 !important;
	cursor: pointer;
	box-shadow: 0 1px 2px rgba(16, 32, 56, .04) !important;
	min-height: 0;
	width: 100% !important;
	text-align: center;
	appearance: none;
	-webkit-appearance: none;
	transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
#icloudits-ai-root .icai-tile:hover,
#icloudits-ai-root .icai-tile:focus-visible {
	border-color: var(--icai-accent) !important;
	box-shadow: 0 6px 16px rgba(11, 99, 206, .14) !important;
	transform: translateY(-2px);
	outline: none;
}
#icloudits-ai-root .icai-tile:active { transform: translateY(0); }

#icloudits-ai-root .icai-tile-ic {
	width: 34px;
	height: 34px;
	flex: none;
	border-radius: 9px;
	background: #eef4fd !important;
	color: var(--icai-accent) !important;
	display: grid !important;
	place-items: center;
	transition: background .16s ease, color .16s ease;
}
#icloudits-ai-root .icai-tile-ic svg { width: 18px; height: 18px; display: block; }
#icloudits-ai-root .icai-tile:hover .icai-tile-ic {
	background: var(--icai-accent) !important;
	color: #fff !important;
}

#icloudits-ai-root .icai-tile-lb {
	color: var(--icai-text) !important;
	font-size: 11px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	display: block;
	word-break: break-word;
}

/* بطاقة «غير ذلك» — تمتد على العرض كاملًا بشكل أفقي */
#icloudits-ai-root .icai-tile-other {
	grid-column: 1 / -1;
	flex-direction: row !important;
	justify-content: center;
	gap: 9px;
	padding: 8px 11px !important;
	background: #f7fafe !important;
	border-style: dashed !important;
}
#icloudits-ai-root .icai-tile-other .icai-tile-ic {
	width: 28px; height: 28px; border-radius: 8px;
}
#icloudits-ai-root .icai-tile-other .icai-tile-ic svg { width: 16px; height: 16px; }
#icloudits-ai-root .icai-tile-other .icai-tile-lb { font-size: 12.5px !important; }

/* التذييل */
#icloudits-ai-root .icai-foot {
	flex: none;
	border-top: 1px solid var(--icai-line);
	background: #fff !important;
	padding: 10px 11px 9px;
}
#icloudits-ai-root .icai-form {
	display: flex; gap: 8px; align-items: flex-end;
	margin: 0 !important;
	padding: 0 !important;
	background: none !important;
	border: 0 !important;
}
#icloudits-ai-root .icai-input {
	flex: 1;
	border: 1px solid var(--icai-line) !important;
	border-radius: 12px !important;
	padding: 10px 13px !important;
	margin: 0 !important;
	font-size: 14.5px !important;
	font-weight: 400 !important;
	line-height: 1.6 !important;
	resize: none;
	max-height: 110px;
	color: var(--icai-text) !important;
	background: #fff !important;
	outline: none;
	box-shadow: none !important;
	width: auto;
	min-height: 0;
}
#icloudits-ai-root .icai-input::placeholder { color: var(--icai-muted) !important; opacity: 1; }
#icloudits-ai-root .icai-input:focus {
	border-color: var(--icai-accent) !important;
	box-shadow: 0 0 0 3px rgba(11, 99, 206, .12) !important;
}
#icloudits-ai-root .icai-send {
	background: var(--icai-accent) !important;
	background-image: none !important;
	border: 0 !important;
	border-radius: 12px !important;
	padding: 0 !important;
	margin: 0 !important;
	width: 41px !important;
	height: 41px !important;
	display: grid;
	place-items: center;
	cursor: pointer;
	flex: none;
	box-shadow: none !important;
	min-height: 0;
	transition: opacity .15s ease, background .15s ease;
}
#icloudits-ai-root .icai-send:hover { background: var(--icai-accent-dark) !important; }
#icloudits-ai-root .icai-send:disabled { opacity: .45; cursor: not-allowed; }
#icloudits-ai-root .icai-send svg { width: 19px; height: 19px; fill: #fff; display: block; transform: scaleX(-1); }

#icloudits-ai-root .icai-wa {
	display: flex; align-items: center; justify-content: center; gap: 6px;
	margin-top: 10px;
	color: #128c7e !important;
	font-size: 13.5px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	background: none !important;
	padding: 0 !important;
}
#icloudits-ai-root .icai-wa:hover { text-decoration: underline !important; color: #0d6e62 !important; }
#icloudits-ai-root .icai-wa svg { width: 15px; height: 15px; fill: currentColor; display: block; }

#icloudits-ai-root .icai-disclaimer {
	text-align: center;
	color: var(--icai-muted) !important;
	font-size: 11.5px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	margin-top: 8px;
}

/* الجوال */
@media (max-width: 480px) {
	#icloudits-ai-root .icai-panel {
		position: fixed;
		inset: 0;
		width: 100vw;
		max-width: none;
		height: 100dvh;
		max-height: none;
		border-radius: 0 !important;
		border: 0 !important;
	}
	#icloudits-ai-root .icai-fab { padding: 13px 18px !important; font-size: 15px !important; }
}

@media (prefers-reduced-motion: reduce) {
	#icloudits-ai-root .icai-panel.icai-open,
	#icloudits-ai-root .icai-msg { animation: none; }
	#icloudits-ai-root .icai-fab { transition: none; }
}

/* ── نموذج الاسم والجوال قبل المحادثة ── */
#icloudits-ai-root .icai-lead {
	background: var(--surface) !important;
	border: 1px solid var(--rule) !important;
	border-radius: 12px;
	padding: 16px 16px 14px;
	display: flex;
	flex-direction: column;
	gap: 9px;
	animation: icai-msg-in .25s ease-out;
}
#icloudits-ai-root .icai-lead-h {
	font-size: 15px !important;
	font-weight: 700 !important;
	color: var(--icai-text) !important;
	line-height: 1.4 !important;
}
#icloudits-ai-root .icai-lead-s {
	font-size: 13px !important;
	font-weight: 400 !important;
	color: var(--icai-muted) !important;
	line-height: 1.7 !important;
	margin-bottom: 3px;
}
#icloudits-ai-root .icai-lead-i {
	width: 100% !important;
	border: 1px solid var(--icai-line) !important;
	border-radius: 10px !important;
	padding: 10px 13px !important;
	margin: 0 !important;
	font-size: 14.5px !important;
	line-height: 1.5 !important;
	color: var(--icai-text) !important;
	background: #fff !important;
	outline: none;
	box-shadow: none !important;
	min-height: 0;
}
#icloudits-ai-root .icai-lead-i::placeholder { color: var(--icai-muted) !important; opacity: 1; }
#icloudits-ai-root .icai-lead-i:focus {
	border-color: var(--icai-accent) !important;
	box-shadow: 0 0 0 3px rgba(11, 99, 206, .12) !important;
}
#icloudits-ai-root .icai-lead-e {
	color: #b3261e !important;
	font-size: 12.5px !important;
	line-height: 1.5 !important;
	min-height: 0;
}
#icloudits-ai-root .icai-lead-e:empty { display: none; }
#icloudits-ai-root .icai-lead-go {
	background: var(--icai-accent) !important;
	background-image: none !important;
	color: #fff !important;
	border: 0 !important;
	border-radius: 10px !important;
	padding: 11px 16px !important;
	margin: 2px 0 0 !important;
	font-size: 14.5px !important;
	font-weight: 700 !important;
	line-height: 1 !important;
	cursor: pointer;
	width: 100% !important;
	box-shadow: none !important;
	min-height: 0;
	transition: background .15s ease;
}
#icloudits-ai-root .icai-lead-go:hover { background: var(--icai-accent-dark) !important; }
#icloudits-ai-root .icai-lead-go:disabled { opacity: .6; cursor: default; }
#icloudits-ai-root .icai-lead-skip {
	background: none !important;
	border: 0 !important;
	color: var(--icai-muted) !important;
	font-size: 12.5px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	padding: 4px !important;
	margin: 0 !important;
	cursor: pointer;
	text-decoration: underline;
	box-shadow: none !important;
	min-height: 0;
	width: auto !important;
}
#icloudits-ai-root .icai-lead-skip:hover { color: var(--icai-text) !important; }

/* ── أزرار الاقتراحات بعد كل رد ── */
#icloudits-ai-root .icai-sug {
	display: flex !important;
	flex-wrap: wrap;
	gap: 6px;
	margin-top: 2px;
	animation: icai-msg-in .25s ease-out;
}
#icloudits-ai-root .icai-sug-b {
	background: var(--surface) !important;
	background-image: none !important;
	border: 1px solid var(--icai-accent) !important;
	color: var(--icai-accent) !important;
	border-radius: 999px !important;
	padding: 8px 14px !important;
	margin: 0 !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.3 !important;
	cursor: pointer;
	box-shadow: none !important;
	min-height: 0;
	width: auto !important;
	text-align: center;
	transition: background .15s ease, color .15s ease;
}
#icloudits-ai-root .icai-sug-b:hover {
	background: var(--icai-accent) !important;
	color: #fff !important;
}
