/* ==========================================================================
   Telkini v126 — محادثة Telkini AI: تصميم بسيط وهادئ + شعار Telkini متحرك
   ========================================================================== */
.tkc-launcher, .tkc-panel {
  --tkc-green: #16a34a; --tkc-green-d: #15803d; --tkc-ink: #0f172a; --tkc-muted: #64748b;
  --tkc-line: #e5e7eb; --tkc-bg: #ffffff; --tkc-soft: #f6f8fa; --tkc-ai: #ffffff;
  font-family: Cairo, Inter, system-ui, sans-serif;
}
html.dark .tkc-launcher, html.dark .tkc-panel {
  --tkc-ink: #f1f5f9; --tkc-muted: #94a3b8; --tkc-line: #1f2a3c; --tkc-bg: #0f172a; --tkc-soft: #0b1222; --tkc-ai: #131d31;
}

/* ---------- الشعار المتحرك ---------- */
.tkc-logo::after { content: ""; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--tkc-green); opacity: 0; pointer-events: none; }

/* زر الفتح: يطفو بهدوء + موجة خضراء كل بضع ثوانٍ */
.tkc-launcher {
  position: fixed; right: 20px; bottom: 24px; z-index: 60; width: 60px; height: 60px; padding: 0;
  border-radius: 50%; border: 0; background: transparent; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
}
.tkc-launcher:hover { transform: translateY(-2px) scale(1.05); }
.tkc-launcher:focus-visible { outline: 3px solid rgba(22, 163, 74, .45); outline-offset: 3px; }
.tkc-launcher.tkc-hidden { opacity: 0; pointer-events: none; transform: translateY(12px) scale(.9); }
.tkc-logo-launch { width: 56px; height: 56px; }
.tkc-tip {
  position: absolute; right: calc(100% + 10px); top: 50%; transform: translateY(-50%) translateX(6px);
  white-space: nowrap; padding: 7px 12px; border-radius: 10px; background: var(--tkc-ink); color: var(--tkc-bg);
  font: 700 12.5px Cairo, sans-serif; opacity: 0; pointer-events: none; transition: opacity .18s ease, transform .18s ease;
}
.tkc-launcher:hover .tkc-tip { opacity: 1; transform: translateY(-50%) translateX(0); }

@keyframes tkc-float { 0%, 100% { transform: translateY(0) } 50% { transform: translateY(-3px) } }
@keyframes tkc-wave { 0% { opacity: .55; transform: scale(1) } 60%, 100% { opacity: 0; transform: scale(1.35) } }
@keyframes tkc-pop { 0% { transform: scale(.6); opacity: 0 } 70% { transform: scale(1.06) } 100% { transform: scale(1); opacity: 1 } }
@keyframes tkc-think { 0%, 100% { transform: scale(1) rotate(0) } 25% { transform: scale(1.06) rotate(-6deg) } 75% { transform: scale(1.06) rotate(6deg) } }
@keyframes tkc-spin { to { transform: rotate(360deg) } }
@keyframes tkc-dot { 0%, 80%, 100% { opacity: .25; transform: translateY(0) } 40% { opacity: 1; transform: translateY(-3px) } }
@keyframes tkc-in { from { opacity: 0; transform: translateY(6px) } to { opacity: 1; transform: none } }

/* ---------- النافذة ---------- */
.tkc-panel {
  position: fixed; right: 20px; bottom: 24px; z-index: 70; width: 380px; height: min(600px, calc(100vh - 48px));
  display: flex; flex-direction: column; overflow: hidden; color: var(--tkc-ink); background: var(--tkc-bg);
  border: 1px solid var(--tkc-line); border-radius: 20px; box-shadow: 0 24px 60px -20px rgba(15, 23, 42, .4);
  opacity: 0; transform: translateY(14px) scale(.98); transform-origin: bottom right; transition: opacity .2s ease, transform .2s ease;
}
.tkc-panel.tkc-in { opacity: 1; transform: none; }
.tkc-panel[hidden] { display: none !important; }

.tkc-head { display: flex; align-items: center; gap: 10px; padding: 12px 12px 12px 14px; border-bottom: 1px solid var(--tkc-line); }
.tkc-logo-head { width: 38px; height: 38px; }
.tkc-logo-head.is-thinking::after { opacity: 1; inset: -4px; border-color: transparent; border-top-color: var(--tkc-green); border-right-color: var(--tkc-green); border-radius: 50%; animation: tkc-spin .9s linear infinite; }
.tkc-head-txt { flex: 1; min-width: 0; }
.tkc-head-txt h2 { margin: 0; font: 800 15px/1.2 Inter, Cairo, sans-serif; color: var(--tkc-ink); }
.tkc-head-txt p { margin: 2px 0 0; font: 600 12px/1.3 Cairo, sans-serif; color: var(--tkc-muted); }
.tkc-icon { width: 34px; height: 34px; border: 0; border-radius: 10px; background: transparent; color: var(--tkc-muted); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tkc-icon:hover { background: var(--tkc-soft); color: var(--tkc-ink); }

.tkc-log { flex: 1; overflow-y: auto; padding: 16px 14px; background: var(--tkc-soft); display: flex; flex-direction: column; gap: 10px; scroll-behavior: smooth; }

/* البداية: الشعار + ترحيب + اقتراحات */
.tkc-welcome { text-align: center; padding: 18px 6px 4px; animation: tkc-in .3s ease both; }
.tkc-logo-hero { width: 104px; height: 104px; margin: 12px 0 16px; }
.tkc-welcome h3 { margin: 14px 0 6px; font: 800 17px Cairo, sans-serif; color: var(--tkc-ink); }
.tkc-welcome p { margin: 0 auto; max-width: 290px; font: 600 13px/1.8 Cairo, sans-serif; color: var(--tkc-muted); }
.tkc-chips { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; }
.tkc-chip { width: 100%; text-align: start; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--tkc-line); background: var(--tkc-bg); color: var(--tkc-ink); font: 600 13px/1.5 Cairo, Inter, sans-serif; cursor: pointer; transition: border-color .15s, background .15s; }
.tkc-chip:hover { border-color: var(--tkc-green); background: rgba(22, 163, 74, .06); }

/* الرسائل */
.tkc-row { display: flex; animation: tkc-in .2s ease both; }
.tkc-user { justify-content: flex-start; }      /* RTL: رسالة الطالب يميناً */
.tkc-assistant { justify-content: flex-end; }
.tkc-bubble { max-width: 86%; padding: 9px 13px; border-radius: 16px; font: 500 14px/1.75 Cairo, Inter, sans-serif; word-wrap: break-word; overflow-wrap: anywhere; }
.tkc-user .tkc-bubble { background: var(--tkc-green); color: #fff; border-bottom-right-radius: 6px; font-weight: 600; }
.tkc-assistant .tkc-bubble { background: var(--tkc-ai); color: var(--tkc-ink); border: 1px solid var(--tkc-line); border-bottom-left-radius: 6px; }
.tkc-bubble p { margin: 0 0 6px; } .tkc-bubble p:last-child { margin-bottom: 0; }
.tkc-bubble ul { margin: 4px 0 6px; padding-inline-start: 18px; } .tkc-bubble li { margin: 2px 0; }
.tkc-bubble b { font-weight: 800; }
.tkc-err .tkc-bubble { background: #fffbeb; border-color: #fde68a; color: #92400e; }
html.dark .tkc-err .tkc-bubble { background: rgba(245, 158, 11, .1); border-color: rgba(245, 158, 11, .35); color: #fcd34d; }
.tkc-dots { display: inline-flex; gap: 5px; align-items: center; padding: 13px 15px; }
.tkc-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--tkc-green); animation: tkc-dot 1.2s ease-in-out infinite; }
.tkc-dots i:nth-child(2) { animation-delay: .15s } .tkc-dots i:nth-child(3) { animation-delay: .3s }

/* بطاقات (انتهاء الحصة / التفعيل) */
.tkc-card { padding: 14px; border-radius: 14px; border: 1px solid var(--tkc-line); background: var(--tkc-bg); font: 600 13px/1.8 Cairo, sans-serif; color: var(--tkc-muted); animation: tkc-in .25s ease both; }
.tkc-card b { display: block; margin-bottom: 4px; font-size: 14.5px; font-weight: 800; color: var(--tkc-ink); }
.tkc-card p { margin: 0 0 10px; }
.tkc-card ol { margin: 6px 0 10px; padding-inline-start: 18px; } .tkc-card li { margin: 3px 0; }
.tkc-card a { color: var(--tkc-green); font-weight: 800; }
.tkc-card small { display: block; margin-top: 8px; font-size: 11.5px; }
.tkc-btn { height: 40px; padding: 0 16px; border: 0; border-radius: 11px; background: var(--tkc-green); color: #fff; font: 800 13.5px Cairo, sans-serif; cursor: pointer; }
.tkc-btn:hover { background: var(--tkc-green-d); } .tkc-btn[disabled] { opacity: .6; cursor: wait; }
.tkc-key { width: 100%; height: 42px; box-sizing: border-box; padding: 0 12px; border-radius: 11px; border: 1px solid var(--tkc-line); background: var(--tkc-soft); color: var(--tkc-ink); font: 600 14px ui-monospace, Menlo, monospace; outline: none; }
.tkc-key:focus { border-color: var(--tkc-green); box-shadow: 0 0 0 3px rgba(22, 163, 74, .15); }
.tkc-setup-row { display: flex; align-items: center; gap: 10px; margin-top: 10px; flex-wrap: wrap; }
.tkc-key-msg { font-size: 12.5px; font-weight: 700; } .tkc-key-msg.is-ok { color: var(--tkc-green); } .tkc-key-msg.is-err { color: #dc2626; }

/* الكتابة */
.tkc-form { display: flex; align-items: flex-end; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--tkc-line); background: var(--tkc-bg); }
.tkc-form[hidden] { display: none; }
.tkc-form textarea { flex: 1; min-height: 42px; max-height: 110px; resize: none; box-sizing: border-box; padding: 10px 14px; border-radius: 14px; border: 1px solid var(--tkc-line); background: var(--tkc-soft); color: var(--tkc-ink); font: 500 14px/1.5 Cairo, Inter, sans-serif; outline: none; }
.tkc-form textarea:focus { border-color: var(--tkc-green); box-shadow: 0 0 0 3px rgba(22, 163, 74, .12); background: var(--tkc-bg); }
.tkc-send { width: 42px; height: 42px; flex-shrink: 0; border: 0; border-radius: 13px; background: var(--tkc-green); color: #fff; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; }
.tkc-send svg { transform: scaleX(-1); } /* السهم نحو اليسار في واجهة عربية */
.tkc-send:hover { background: var(--tkc-green-d); } .tkc-send[disabled] { opacity: .5; cursor: wait; }
.tkc-foot { margin: 0; padding: 0 14px 10px; background: var(--tkc-bg); font: 600 11.5px Cairo, sans-serif; color: var(--tkc-muted); text-align: center; }
.tkc-foot:empty { display: none; }

/* ---------- الهاتف: نافذة بكامل الشاشة، والزر فوق شريط التنقل ---------- */
@media (max-width: 1023px) { .tkc-launcher { bottom: calc(96px + env(safe-area-inset-bottom)); right: 14px; width: 54px; height: 54px; } .tkc-logo-launch { width: 50px; height: 50px; } .tkc-tip { display: none; } }
@media (max-width: 560px) {
  .tkc-panel { inset: 0; width: auto; height: auto; max-height: none; border-radius: 0; border: 0; transform: translateY(20px); }
  .tkc-panel.tkc-in { transform: none; }
  .tkc-form { padding-bottom: calc(10px + env(safe-area-inset-bottom)); }
  html.tkc-open, html.tkc-open body { overflow: hidden; }
}

@media (prefers-reduced-motion: reduce) {
  .tkc-launcher *, .tkc-panel *, .tkc-launcher, .tkc-panel { animation: none !important; transition: none !important; }
}

/* ==========================================================================
   أزرار «Ask AI» ونافذة Ask AI داخل الامتحان: نفس هوية Telkini (الشعار بدل الكرة الملونة)
   ========================================================================== */
/* v127: إعداد المفتاح */
.tkc-btn-ghost { background: transparent; color: var(--tkc-ink); border: 1px solid var(--tkc-line); }
.tkc-btn-ghost:hover { background: var(--tkc-soft); }
.tkc-setup .tkc-key { margin-top: 8px; }
/* v147: حقل المفتاح مع «إظهار» و«لصق» وتأكيد واضح */
.tkc-keyrow { display: flex; align-items: flex-end; gap: 6px; }
.tkc-keyrow .tkc-key { flex: 1; min-width: 0; }
.tkc-key-masked { -webkit-text-security: disc; }
.tkc-keybtn { flex-shrink: 0; height: 42px; padding: 0 10px; font-size: 12.5px; }
.tkc-key-hint { min-height: 0; margin-top: 6px; font: 700 12.5px/1.6 Cairo, Inter, sans-serif; }
.tkc-key-hint:empty { display: none; }
.tkc-key-hint.is-ok { color: var(--tkc-green-d); }
html.dark .tkc-key-hint.is-ok { color: #4ade80; }
.tkc-key-hint.is-err { color: #dc2626; }
.tkc-key-state { margin: 2px 0 6px; padding: 8px 10px; border-radius: 10px; background: var(--tkc-soft); font: 700 12.5px Cairo, Inter, sans-serif; color: var(--tkc-ink); }
.tkc-key-msg { display: block; margin-top: 8px; line-height: 1.7; }
.tkc-link { border: 0; background: none; padding: 0; color: var(--tkc-green); font: 800 11.5px Cairo, sans-serif; cursor: pointer; text-decoration: underline; }
.tkc-key-detail { display: block; margin-top: 4px; font: 600 11.5px/1.5 Inter, monospace; opacity: .85; text-align: left; word-break: break-word; }


/* ==========================================================================
   v128 — زر «Ask AI» متحرك + نافذة Ask AI الجديدة (كيف يمكنني مساعدتك؟)
   ========================================================================== */

/* --- الزر (v129: تصميم Telkini الجديد — كبسولة خضراء + أيقونة TP) --- */
.ask-ai-btn {
  position: relative; isolation: isolate; overflow: visible;
  display: inline-flex !important; align-items: center; gap: 10px !important;
  padding: 5px 20px 5px 5px !important; min-height: 50px;
  border-radius: 999px !important;
  background: linear-gradient(180deg, #f6fcf8 0%, #ebf7ef 100%) !important;
  border: 2.5px solid #1b6e47 !important;
  box-shadow: 0 6px 18px -8px rgba(27,110,71,.55), inset 0 1px 0 #fff !important;
  font-family: Poppins, Inter, system-ui, sans-serif !important;
  transition: transform .2s ease, box-shadow .25s ease, background .25s ease !important;
  animation: ask-ai-pulse 2.8s ease-out infinite;
}
html.dark .ask-ai-btn {
  background: linear-gradient(180deg, #10251b 0%, #0c1f16 100%) !important;
  border-color: #34a06b !important;
}
/* لمعة تمر على الزر */
.ask-ai-btn::before {
  content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none;
  background: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.75) 50%, transparent 65%);
  background-size: 250% 100%; background-repeat: no-repeat;
  animation: ask-ai-sweep 4.2s ease-in-out infinite;
  filter: none !important; opacity: 1 !important;
}
html.dark .ask-ai-btn::before { background-image: linear-gradient(105deg, transparent 35%, rgba(255,255,255,.14) 50%, transparent 65%); }
.ask-ai-btn::after { display: none !important; }
.ask-ai-btn:hover {
  transform: translateY(-2px);
  background: linear-gradient(180deg, #ffffff 0%, #e2f4e8 100%) !important;
  box-shadow: 0 12px 26px -10px rgba(27,110,71,.7), inset 0 1px 0 #fff !important;
}
.ask-ai-btn:active { transform: scale(.96); }
.ask-ai-btn:focus-visible { outline: 3px solid #86d3a5 !important; outline-offset: 3px; }

/* الأيقونة داخل مربع أبيض بإطار أخضر فاتح */
.ask-ai-orb {
  position: relative; flex-shrink: 0;
  width: 40px !important; height: 40px !important;
  border-radius: 11px !important;
  background: #fff url(/assets/ai/ask-ai-icon.webp) center / 88% no-repeat !important;
  box-shadow: 0 0 0 1.5px #9fd4b1, 0 3px 8px -3px rgba(27,110,71,.45) !important;
  animation: ask-ai-bob 3s ease-in-out infinite;
}
.ask-ai-orb::before, .ask-ai-orb::after { display: none !important; }
.ask-ai-btn:hover .ask-ai-orb { animation: ask-ai-wiggle .7s ease-in-out infinite; }

/* النص: Ask أخضر + AI رمادي داكن */
.ask-ai-label {
  display: inline-flex; align-items: baseline; gap: .28em;
  font: 800 20px/1 Poppins, Inter, system-ui, sans-serif !important; letter-spacing: -.01em;
  background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important;
  color: inherit !important; animation: none !important;
}
.ask-ai-a { color: #1f8a52; }
.ask-ai-b { color: #3b4448; }
html.dark .ask-ai-a { color: #4ade80; }
html.dark .ask-ai-b { color: #e2e8f0; }

/* زر «تصحيح وتحليل AI» في نافذة B1: نفس الأيقونة بحجم أصغر */
button[onclick="runLesenAICorrection()"] .ask-ai-orb { width: 26px !important; height: 26px !important; border-radius: 8px !important; }
button[onclick="runLesenAICorrection()"] { border: 2px solid #1b6e47 !important; background: #f2faf5 !important; color: #1b6e47 !important; }

@media (max-width: 640px) {
  .ask-ai-btn { min-height: 44px; padding: 4px 14px 4px 4px !important; gap: 8px !important; }
  .ask-ai-orb { width: 34px !important; height: 34px !important; border-radius: 9px !important; }
  .ask-ai-label { font-size: 17px !important; }
}

/* الكلمة «Ask AI» تبقى ظاهرة حتى على الهواتف الصغيرة (كانت مخفية تحت 400px) */
.ex-bottom-bar .ask-ai-btn > .ask-ai-label,
[id^="exercise"][id$="-view"] > .fixed.bottom-0 .ask-ai-btn > .ask-ai-label { display: inline-flex !important; }
@media (max-width: 400px) {
  .ask-ai-btn { min-height: 42px; padding: 3px 12px 3px 3px !important; gap: 6px !important; }
  .ask-ai-orb { width: 32px !important; height: 32px !important; }
  .ask-ai-label { font-size: 15.5px !important; }
}

@keyframes ask-ai-pulse {
  0%   { box-shadow: 0 6px 18px -8px rgba(27,110,71,.55), 0 0 0 0 rgba(34,160,95,.38), inset 0 1px 0 #fff; }
  70%  { box-shadow: 0 6px 18px -8px rgba(27,110,71,.55), 0 0 0 11px rgba(34,160,95,0), inset 0 1px 0 #fff; }
  100% { box-shadow: 0 6px 18px -8px rgba(27,110,71,.55), 0 0 0 0 rgba(34,160,95,0), inset 0 1px 0 #fff; }
}
@keyframes ask-ai-sweep { 0%, 55% { background-position: 160% 0; } 100% { background-position: -60% 0; } }
@keyframes ask-ai-bob { 0%, 100% { transform: translateY(0) rotate(0); } 50% { transform: translateY(-2px) rotate(-4deg); } }
@keyframes ask-ai-wiggle { 0%, 100% { transform: rotate(0) scale(1.06); } 30% { transform: rotate(-10deg) scale(1.1); } 70% { transform: rotate(8deg) scale(1.1); } }


/* --- v130: نافذة Ask AI بهوية Telkini (أخضر الموقع، خط Cairo، شعار TP) --- */
#tai-modal { background: rgba(15, 23, 42, .4); backdrop-filter: blur(3px); -webkit-backdrop-filter: blur(3px); }
@media (min-width: 640px) { #tai-modal { padding-bottom: 92px !important; } }
#tai-panel.tai-v2 {
  --tai-green: #16a34a; --tai-green-d: #15803d; --tai-tint: #ecfdf3; --tai-tint-line: #bbf7d0;
  --tai-ink: #0f172a; --tai-muted: #64748b; --tai-line: #e5e7eb; --tai-card: #f8fafc; --tai-bg: #fff;
  height: auto; max-height: min(660px, 88vh); width: 100%; max-width: 480px !important;
  background: var(--tai-bg); color: var(--tai-ink);
  border: 1px solid var(--tai-line); border-radius: 24px 24px 0 0;
  box-shadow: 0 24px 60px -18px rgba(15, 23, 42, .4);
  font-family: Cairo, Tajawal, sans-serif; transition: max-width .25s ease, height .25s ease, max-height .25s ease;
}
@supports (height: 1dvh) { #tai-panel.tai-v2 { max-height: min(660px, 88dvh); } }
@media (min-width: 640px) { #tai-panel.tai-v2 { border-radius: 24px; } }
html.dark #tai-panel.tai-v2 { --tai-tint: rgba(22, 163, 74, .13); --tai-tint-line: rgba(34, 197, 94, .32); --tai-ink: #f1f5f9; --tai-muted: #94a3b8; --tai-line: #1f2a3c; --tai-card: #131d31; --tai-bg: #0f172a; }
#tai-panel.tai-v2.has-thread { height: min(660px, 88vh); }
@supports (height: 1dvh) { #tai-panel.tai-v2.has-thread { height: min(660px, 88dvh); } }
#tai-panel.tai-v2.tai-max { max-width: 780px !important; height: 92vh; max-height: 92vh; }
@supports (height: 1dvh) { #tai-panel.tai-v2.tai-max { height: 92dvh; max-height: 92dvh; } }
#tai-panel.tai-pop { animation: tai-pop .3s cubic-bezier(.22, 1.2, .36, 1) both; }
@keyframes tai-pop { from { opacity: 0; transform: translateY(20px) scale(.97); } to { opacity: 1; transform: none; } }

.tai-grab { width: 40px; height: 4px; border-radius: 9px; background: #d5dbe3; margin: 8px auto 0; flex-shrink: 0; }
html.dark .tai-grab { background: #334155; }
@media (min-width: 640px) { .tai-grab { display: none; } }

.tai-head { display: flex; align-items: center; gap: 10px; padding: 10px 12px 10px 10px; flex-shrink: 0; border-bottom: 1px solid var(--tai-line); }
.tai-logo { width: 38px; height: 38px; }
.tai-brand { flex: 1; min-width: 0; }
.tai-brand h2 { margin: 0; font: 800 15px/1.25 Inter, Cairo, sans-serif; color: var(--tai-ink); text-align: right; }
.tai-brand p { margin: 1px 0 0; font: 600 12px/1.4 Cairo, Inter, sans-serif; color: var(--tai-muted); text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tai-head-side { display: flex; align-items: center; gap: 2px; flex-shrink: 0; }
.tai-icon-btn { width: 34px; height: 34px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; color: var(--tai-muted); background: none; border: 0; cursor: pointer; transition: background .15s, color .15s; }
.tai-icon-btn:hover { background: var(--tai-card); color: var(--tai-ink); }
.tai-icon-btn svg, .tai-expand svg, #tai-send.tai-send svg { width: 18px !important; height: 18px !important; min-width: 0 !important; min-height: 0 !important; }
.tai-quota { display: inline-flex; align-items: center; gap: 5px; height: 26px; padding: 0 3px 0 9px; border-radius: 999px; border: 1px solid var(--tai-line); font: 800 11.5px Inter, sans-serif; color: var(--tai-ink); direction: ltr; flex-shrink: 0; }
.tai-quota:empty { display: none; }
.tai-quota-tier { font: 800 10px Inter, sans-serif; font-style: normal; padding: 3px 7px; border-radius: 999px; background: #e2e8f0; color: #334155; }
.tai-quota-tier.is-pro { background: var(--tai-green); color: #fff; }

.tai-hero { flex: 1 1 auto; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; align-items: center; padding: 20px 16px 12px; }
.tai-hero[hidden] { display: none; }
.tai-hero-logo { width: 88px; height: 88px; margin: 12px 0 14px; }
.tai-hero-title { margin: 12px 0 2px; font: 800 19px/1.4 Cairo, Tajawal, sans-serif; color: var(--tai-ink); text-align: center; }
.tai-hero-sub { margin: 0 0 14px; font: 600 12.5px/1.7 Cairo, sans-serif; color: var(--tai-muted); text-align: center; }
.tai-suggest { width: 100%; display: flex; flex-direction: column; gap: 8px; }
.tai-sug {
  width: 100%; display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 14px;
  border: 1px solid var(--tai-line); background: var(--tai-bg); color: var(--tai-ink);
  font: 700 13.5px/1.55 Cairo, Tajawal, sans-serif; text-align: right; cursor: pointer;
  transition: border-color .15s, background .15s; animation: tai-up .32s ease both;
}
.tai-sug:hover { border-color: var(--tai-green); background: var(--tai-tint); }
.tai-sug:active { transform: scale(.99); }
.tai-sug:focus-visible { outline: 2px solid var(--tai-green); outline-offset: 2px; }
.tai-sug-ic { width: 32px; height: 32px; border-radius: 10px; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; background: var(--tai-tint); color: var(--tai-green-d); }
html.dark .tai-sug-ic { color: #4ade80; }
.tai-sug.is-ai { border-color: var(--tai-tint-line); background: var(--tai-tint); }
.tai-sug.is-ai .tai-sug-ic { background: var(--tai-green); color: #fff; }
@keyframes tai-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

#tai-log[hidden], #tai-chips[hidden] { display: none !important; }
.tai-md { background: var(--tai-card); color: var(--tai-ink); border: 1px solid var(--tai-line); font-family: Cairo, Inter, sans-serif; line-height: 1.8; }
.tai-md p { margin: 0 0 6px; } .tai-md p:last-of-type { margin-bottom: 0; }
.tai-md ul { margin: 4px 0 6px; padding-inline-start: 18px; list-style: disc; } .tai-md li { margin: 2px 0; }
.tai-md b { font-weight: 800; }

/* أزرار داخل الردود: تفتح موضوعاً أو قسماً من الموقع (Ask AI والزر العائم) */
.tk-ai-acts { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.tk-ai-act { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; padding: 6px 12px; border-radius: 999px; border: 1px solid #16a34a; background: #fff; color: #15803d; font: 800 12.5px/1.4 Cairo, Inter, sans-serif; cursor: pointer; transition: background .15s, color .15s; }
.tk-ai-act span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-ai-act svg { flex-shrink: 0; }
.tk-ai-act:hover { background: #16a34a; color: #fff; }
html.dark .tk-ai-act { background: transparent; color: #4ade80; }
html.dark .tk-ai-act:hover { background: #16a34a; color: #fff; }

#tai-panel.tai-v2 .tai-foot { padding: 8px 12px max(12px, env(safe-area-inset-bottom)); border-top: 1px solid var(--tai-line); }
.tai-form { display: flex; align-items: center; gap: 6px; padding: 4px; border-radius: 16px; border: 1.5px solid var(--tai-line); background: var(--tai-card); transition: border-color .15s, box-shadow .15s, background .15s; }
.tai-form:focus-within { border-color: var(--tai-green); background: var(--tai-bg); box-shadow: 0 0 0 3px rgba(22, 163, 74, .14); }
.tai-input { flex: 1; min-width: 0; border: 0; background: transparent; padding: 8px 4px; font: 600 14.5px Cairo, Tajawal, sans-serif; color: var(--tai-ink); outline: none; }
.tai-input::placeholder { color: #94a3b8; font-size: 13px; }
.tai-expand { width: 34px; height: 34px; border-radius: 10px; border: 0; background: none; color: #94a3b8; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; }
.tai-expand:hover, .tai-expand[aria-pressed="true"] { color: var(--tai-green); background: var(--tai-tint); }
@media (max-width: 639px) { .tai-expand { display: none; } }
#tai-send.tai-send { width: 40px; height: 40px; border-radius: 12px; border: 0; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center; color: #fff; cursor: pointer; background: var(--tai-green) !important; transition: background .15s; }
#tai-send.tai-send:hover { background: var(--tai-green-d) !important; }
#tai-send.tai-send:active { transform: scale(.94); }
#tai-send.tai-send:disabled { opacity: .55; cursor: not-allowed; }
.tai-dot { background: #16a34a !important; }

@media (max-width: 639px) {
  #tai-panel.tai-v2 { max-width: 100% !important; }
  #tai-panel.tai-v2.tai-max { border-radius: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .ask-ai-btn, .ask-ai-btn::before, .ask-ai-orb, .ask-ai-label, .tai-hero-logo, .tai-hero-logo::after, .tai-sug, .tai-hero-title, #tai-panel.tai-pop { animation: none !important; }
}

/* ==========================================================================
   v145: كرة Telkini AI — تدور باستمرار، بامتزاج فاتح بين الأخضر والأبيض والأسود.
   عند الفتح: جيروسكوب ثلاثي الأبعاد — حلقات ضوئية بذيل مذنّب تدور حول الكرة
   (جزء منها أمام الكرة وجزء خلفها)، ثم تُسحب إلى داخلها فتنبض بموجة ضوء.
   ========================================================================== */
.tk-orb { position: relative; display: inline-block; flex-shrink: 0; vertical-align: middle; will-change: transform; transform-style: preserve-3d; perspective: 520px; }
/* v145: كرة Telkini بهوية الأسود العميق والأخضر الأنيق —
   نواة سوداء، تيارات خضراء تنساب وتدور داخلها، حافة ضوئية خضراء، وهالة تتنفس حولها.
   (transform و opacity فقط في الحركة: خفيفة على الهاتف) */
.tk-orb { --tko-glow: .7; }
/* الهالة الخضراء حول الكرة: تتنفس بهدوء */
.tk-orb::before {
  content: ""; position: absolute; inset: -22%; border-radius: 50%; pointer-events: none;
  background: radial-gradient(closest-side, rgba(34, 197, 94, .55), rgba(22, 163, 74, .22) 55%, rgba(22, 163, 74, 0) 100%);
  opacity: var(--tko-glow); animation: tk-orb-breathe 4.6s ease-in-out infinite;
  transition: opacity .35s ease;
}
@keyframes tk-orb-breathe { 0%, 100% { transform: scale(.9); } 50% { transform: scale(1.06); } }
.tk-orb-fill {
  position: absolute; inset: 0; display: block; overflow: hidden; border-radius: 50%; isolation: isolate;
  background: radial-gradient(circle at 50% 58%, #0d1a13 0%, #070c0a 58%, #020403 100%);
  box-shadow: 0 0 0 1px rgba(74, 222, 128, .28), 0 2px 10px -2px rgba(5, 46, 22, .6);
}
/* طبقتا دوران: البطيئة الدائمة، والسريعة عند الفتح */
.tk-orb-spin, .tk-orb-core { position: absolute; inset: 0; display: block; }
.tk-orb-core { animation: tk-orb-turn 14s linear infinite; }
@keyframes tk-orb-turn { to { transform: rotate(360deg); } }
/* شفق أخضر يدور عكس النواة: يعطي إحساس ذكاء نشِط */
.tk-orb-spin::before {
  content: ""; position: absolute; inset: -10%; border-radius: 50%; pointer-events: none; z-index: 1;
  background: conic-gradient(from 20deg, rgba(34, 197, 94, 0) 0deg, rgba(74, 222, 128, .55) 50deg, rgba(34, 197, 94, 0) 110deg, rgba(34, 197, 94, 0) 180deg, rgba(16, 185, 129, .45) 235deg, rgba(34, 197, 94, 0) 290deg);
  -webkit-mask: radial-gradient(closest-side, transparent 38%, #000 72%, transparent 100%);
          mask: radial-gradient(closest-side, transparent 38%, #000 72%, transparent 100%);
  opacity: .75; animation: tk-orb-aurora 9s linear infinite; transition: opacity .35s ease;
}
@keyframes tk-orb-aurora { to { transform: rotate(-360deg); } }
.tk-orb-fill i { position: absolute; display: block; border-radius: 50%; will-change: transform; }
.tk-orb-fill i:nth-child(1) { width: 90%; height: 90%; left: -30%; top: 26%; background: radial-gradient(closest-side, rgba(34, 197, 94, .95) 0%, rgba(22, 163, 74, .55) 45%, rgba(22, 163, 74, 0) 100%); animation: tk-orb-a 6.4s ease-in-out infinite alternate; }
.tk-orb-fill i:nth-child(2) { width: 58%; height: 58%; right: -10%; top: -8%; background: radial-gradient(closest-side, rgba(187, 247, 208, .9) 0%, rgba(74, 222, 128, .45) 45%, rgba(74, 222, 128, 0) 100%); animation: tk-orb-b 5.2s ease-in-out infinite alternate; }
.tk-orb-fill i:nth-child(3) { width: 70%; height: 70%; left: 24%; bottom: -24%; background: radial-gradient(closest-side, rgba(6, 95, 70, .95) 0%, rgba(6, 78, 59, .5) 50%, rgba(6, 78, 59, 0) 100%); animation: tk-orb-c 7.6s ease-in-out infinite alternate; }
.tk-orb-fill i:nth-child(4) { width: 46%; height: 46%; left: 12%; top: 6%; background: radial-gradient(closest-side, rgba(16, 185, 129, .8) 0%, rgba(16, 185, 129, .3) 50%, rgba(16, 185, 129, 0) 100%); animation: tk-orb-d 5.8s ease-in-out infinite alternate; }
/* لمعة زجاجية ثابتة + حافة ضوئية خضراء: إحساس كرة حقيقية بينما يدور ما بداخلها */
.tk-orb-fill::after {
  content: ""; position: absolute; inset: 0; z-index: 2; border-radius: inherit; pointer-events: none;
  background:
    radial-gradient(circle at 32% 24%, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 24%),
    radial-gradient(circle at 50% 50%, rgba(2, 4, 3, 0) 58%, rgba(2, 4, 3, .55) 86%, rgba(74, 222, 128, .55) 100%);
}
@keyframes tk-orb-a { to { transform: translate(52%, -46%) scale(1.15); } }
@keyframes tk-orb-b { to { transform: translate(-70%, 60%) scale(.85); } }
@keyframes tk-orb-c { to { transform: translate(-40%, -86%) scale(1.12); } }
@keyframes tk-orb-d { to { transform: translate(64%, 66%) scale(.92); } }

/* تفاعل: عند المرور تضيء الهالة ويقوى الشفق، وعند الضغط تنضغط الكرة ثم ترتد */
.tkc-launcher:hover .tk-orb, .tkc-launcher:focus-visible .tk-orb, .ask-ai-btn:hover .tk-orb, .ask-ai-btn:focus-visible .tk-orb { --tko-glow: 1; }
.tkc-launcher:hover .tk-orb-spin::before, .ask-ai-btn:hover .tk-orb-spin::before { opacity: 1; }
.tkc-launcher:active .tk-orb-fill, .ask-ai-btn:active .tk-orb-fill { transform: scale(.9); }
.tk-orb-fill { transition: transform .35s cubic-bezier(.34, 1.56, .64, 1); }
.tkc-logo-head.is-thinking .tk-orb { --tko-glow: 1; }
.tkc-logo-head.is-thinking .tk-orb-spin::before { opacity: 1; animation-duration: 2.4s; }

/* الكرة الصغيرة داخل أزرار «Ask AI» */
.ask-ai-orb > .tk-orb { display: block; width: 100%; height: 100%; }
.ask-ai-orb > .tk-orb::before { inset: -30%; }

/* الحلقات وموجة الضوء: في الكرة الكبيرة فقط */
.tk-orb-gyro, .tk-orb-shock { display: none; position: absolute; pointer-events: none; }
.tkc-logo-hero .tk-orb-gyro, .tai-hero-logo .tk-orb-gyro, .tkc-logo-hero .tk-orb-shock, .tai-hero-logo .tk-orb-shock { display: block; }
.tk-orb-gyro { inset: -13%; transform-style: preserve-3d; }
.tk-orb-gyro b {
  --tk-c: #16a34a; --tk-ry: 0deg; --tk-rx: 70deg;
  position: absolute; inset: 0; display: block; border-radius: 50%; opacity: 0;
  transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) scale(.5);
}
/* الذيل: تدرج دائري مقصوص إلى خط رفيع */
.tk-orb-gyro b::before { content: ""; position: absolute; inset: 0; border-radius: 50%; background: conic-gradient(from 0deg, rgba(0, 0, 0, 0) 0deg, rgba(0, 0, 0, 0) 150deg, var(--tk-c) 360deg); -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 4.5px), #000 calc(100% - 4px)); mask: radial-gradient(closest-side, transparent calc(100% - 4.5px), #000 calc(100% - 4px)); }
/* القمر الصغير في رأس الذيل */
.tk-orb-gyro b::after { content: ""; position: absolute; left: 50%; top: 0; width: 11px; height: 11px; margin: -3.500px 0 0 -5.500px; border-radius: 50%; background: var(--tk-c); box-shadow: 0 0 8px 2px var(--tk-c); }
.tk-orb-gyro b:nth-child(1) { --tk-c: #22c55e; --tk-ry: 0deg; }
.tk-orb-gyro b:nth-child(2) { --tk-c: #0a100d; --tk-ry: 62deg; }
.tk-orb-gyro b:nth-child(3) { --tk-c: #fff; --tk-ry: -62deg; }
.tk-orb-gyro b:nth-child(3)::after { box-shadow: 0 0 0 1.5px #16a34a, 0 0 8px 2px rgba(22, 163, 74, .8); }
.tk-orb-gyro b:nth-child(3)::before { background: conic-gradient(from 0deg, rgba(0, 0, 0, 0) 0deg, rgba(0, 0, 0, 0) 150deg, #86efac 360deg); }
html.dark .tk-orb-gyro b:nth-child(2) { --tk-c: #bbf7d0; }
html.dark .tk-orb-gyro b:nth-child(1) { --tk-c: #4ade80; }
.tk-orb-shock { inset: 0; border-radius: 50%; border: 2px solid #22c55e; opacity: 0; }

/* الترحيب عند الفتح */
.tk-orb.is-greeting { animation: tk-orb-pop 2.8s cubic-bezier(.4, 0, .2, 1) var(--tko-delay, 0s) both; }
.tk-orb.is-greeting .tk-orb-spin { animation: tk-orb-whirl 2.8s cubic-bezier(.45, 0, .2, 1) var(--tko-delay, 0s) both; }
.tk-orb.is-greeting .tk-orb-gyro b { animation: tk-orb-orbit 2.8s linear var(--tko-delay, 0s) both; }
.tk-orb.is-greeting .tk-orb-gyro b:nth-child(2) { animation-delay: calc(var(--tko-delay, 0s) + .07s); }
.tk-orb.is-greeting .tk-orb-gyro b:nth-child(3) { animation-delay: calc(var(--tko-delay, 0s) + .14s); }
.tk-orb.is-greeting .tk-orb-shock { animation: tk-orb-shock 2.8s ease-out var(--tko-delay, 0s) both; }
/* تنكمش كأنها تشحن، تتنفس أثناء الدوران، ثم تنبض عندما تعود الحلقات إليها */
@keyframes tk-orb-pop {
  0% { transform: scale(1); }
  10% { transform: scale(.84); }
  24%, 58% { transform: scale(.94); }
  72% { transform: scale(.88); }
  82% { transform: scale(1.12); }
  100% { transform: scale(1); }
}
@keyframes tk-orb-whirl { to { transform: rotate(1080deg); } }
/* تسارع ثم سحب إلى الداخل: الزوايا متزايدة مع توقيت خطي، فلا يتوقف الدوران بين المراحل */
@keyframes tk-orb-orbit {
  0%, 6% { opacity: 0; transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) rotateZ(0deg) scale(.5); }
  20% { opacity: 1; transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) rotateZ(260deg) scale(1.02); }
  60% { opacity: 1; transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) rotateZ(1120deg) scale(1.08); }
  76% { opacity: .85; transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) rotateZ(1620deg) scale(.5); }
  82%, 100% { opacity: 0; transform: rotateZ(var(--tk-ry)) rotateX(var(--tk-rx)) rotateZ(1840deg) scale(.2); }
}
@keyframes tk-orb-shock {
  0%, 76% { opacity: 0; transform: scale(.9); }
  80% { opacity: .75; transform: scale(1); }
  100% { opacity: 0; transform: scale(1.65); }
}
.tkc-logo-head.is-thinking .tk-orb-core { animation-duration: 1.4s; }
@media (prefers-reduced-motion: reduce) {
  .tk-orb.is-greeting, .tk-orb.is-greeting .tk-orb-spin, .tk-orb-core, .tk-orb-fill i, .tk-orb::before, .tk-orb-spin::before { animation: none !important; }
  .tk-orb-gyro, .tk-orb-shock { display: none !important; }
}
/* ==========================================================================
   v132 — أيقونة Telkini AI: إطار دائري متحرك بهدوء + رسالة ترحيب متعددة اللغات
   الشعار (الكرة الخضراء) لم يتغيّر — الإطار والهالة حوله فقط.
   ========================================================================== */
.tkc-launcher { isolation: isolate; }
.tkc-launcher .tk-orb { position: relative; z-index: 1; }

/* الإطار: خط رفيع ثابت + قوس مضيء يدور ببطء + هالة تتنفس */
.tkc-ring {
  position: absolute; inset: -5px; z-index: 0; border-radius: 50%; pointer-events: none;
  box-shadow: inset 0 0 0 1.5px rgba(22, 163, 74, .20), 0 6px 18px -6px rgba(22, 163, 74, .45);
  background: rgba(255, 255, 255, .55);
  transition: transform .35s cubic-bezier(.2, .8, .2, 1), box-shadow .35s ease, background .35s ease;
}
html.dark .tkc-ring { background: rgba(15, 23, 42, .55); box-shadow: inset 0 0 0 1.5px rgba(74, 222, 128, .22), 0 6px 18px -6px rgba(34, 197, 94, .5); }
.tkc-ring::before {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: conic-gradient(from 0deg, rgba(34, 197, 94, 0) 0deg, rgba(34, 197, 94, 0) 40deg, #22c55e 150deg, #bbf7d0 205deg, rgba(34, 197, 94, 0) 260deg, rgba(34, 197, 94, 0) 360deg);
  -webkit-mask: radial-gradient(closest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px));
          mask: radial-gradient(closest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px));
  animation: tkc-ring-spin 7s linear infinite;
}
html.dark .tkc-ring::before { background: conic-gradient(from 0deg, rgba(74, 222, 128, 0) 0deg, rgba(74, 222, 128, 0) 40deg, #4ade80 150deg, #dcfce7 205deg, rgba(74, 222, 128, 0) 260deg, rgba(74, 222, 128, 0) 360deg); }
.tkc-ring::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(34, 197, 94, .32);
  animation: tkc-ring-breathe 3.6s ease-out infinite;
}
@keyframes tkc-ring-spin { to { transform: rotate(360deg); } }
@keyframes tkc-ring-breathe {
  0% { box-shadow: 0 0 0 0 rgba(34, 197, 94, .30); }
  70%, 100% { box-shadow: 0 0 0 9px rgba(34, 197, 94, 0); }
}

/* تمرير الفأرة / التركيز: الإطار يتسع قليلاً ويضيء */
.tkc-launcher:hover .tkc-ring, .tkc-launcher:focus-visible .tkc-ring, .tkc-launcher.tkc-greeting .tkc-ring {
  transform: scale(1.07);
  background: rgba(255, 255, 255, .8);
  box-shadow: inset 0 0 0 1.5px rgba(22, 163, 74, .38), 0 10px 26px -6px rgba(22, 163, 74, .6);
}
html.dark .tkc-launcher:hover .tkc-ring, html.dark .tkc-launcher:focus-visible .tkc-ring, html.dark .tkc-launcher.tkc-greeting .tkc-ring {
  background: rgba(15, 23, 42, .8);
  box-shadow: inset 0 0 0 1.5px rgba(74, 222, 128, .45), 0 10px 26px -6px rgba(34, 197, 94, .65);
}
.tkc-launcher { transition: transform .3s cubic-bezier(.2, .8, .2, 1), opacity .2s ease; }
.tkc-launcher:hover { transform: translateY(-3px) scale(1.04); }
.tkc-launcher:active { transform: translateY(-1px) scale(.97); }
.tkc-launcher:focus-visible { outline: none; }
.tkc-launcher:focus-visible .tkc-ring { box-shadow: 0 0 0 3px rgba(22, 163, 74, .45), 0 10px 26px -6px rgba(22, 163, 74, .6); }
/* v145: إطار زجاجي داكن يناسب الكرة السوداء/الخضراء (الوضعان الفاتح والداكن) */
.tkc-ring, html.dark .tkc-ring {
  background: radial-gradient(circle at 50% 40%, rgba(16, 28, 21, .92), rgba(3, 6, 4, .96));
  box-shadow: inset 0 0 0 1px rgba(74, 222, 128, .22), 0 8px 22px -8px rgba(2, 44, 20, .75), 0 0 18px -6px rgba(34, 197, 94, .45);
}
.tkc-ring::before, html.dark .tkc-ring::before { background: conic-gradient(from 0deg, rgba(74, 222, 128, 0) 0deg, rgba(74, 222, 128, 0) 60deg, #22c55e 160deg, #bbf7d0 210deg, rgba(74, 222, 128, 0) 270deg, rgba(74, 222, 128, 0) 360deg); }
.tkc-ring::after { animation-duration: 4.6s; }
.tkc-launcher:hover .tkc-ring, .tkc-launcher:focus-visible .tkc-ring, .tkc-launcher.tkc-greeting .tkc-ring,
html.dark .tkc-launcher:hover .tkc-ring, html.dark .tkc-launcher:focus-visible .tkc-ring, html.dark .tkc-launcher.tkc-greeting .tkc-ring {
  background: radial-gradient(circle at 50% 40%, rgba(20, 40, 28, .95), rgba(3, 6, 4, .98));
  box-shadow: inset 0 0 0 1.5px rgba(74, 222, 128, .45), 0 12px 28px -8px rgba(2, 44, 20, .8), 0 0 26px -4px rgba(34, 197, 94, .6);
}
.tkc-launcher:focus-visible .tkc-ring { box-shadow: 0 0 0 3px rgba(34, 197, 94, .55), 0 0 26px -4px rgba(34, 197, 94, .6); }
/* أثناء ظهور رسالة الترحيب لا نعرض تلميح «اسأل Telkini AI» فوقها */
.tkc-launcher.tkc-greeting .tkc-tip { display: none; }

/* ---------- فقاعة الترحيب ---------- */
.tkc-hello {
  --tkh-bg: #ffffff; --tkh-line: rgba(22, 163, 74, .18); --tkh-ink: #0f172a; --tkh-muted: #64748b;
  position: fixed; z-index: 60; right: calc(20px + 60px + 16px); bottom: 30px;
  display: flex; align-items: flex-start; gap: 2px;
  max-width: min(300px, calc(100vw - 120px));
  padding: 4px; border-radius: 18px; background: var(--tkh-bg); border: 1px solid var(--tkh-line);
  box-shadow: 0 18px 40px -16px rgba(15, 23, 42, .35), 0 4px 12px -6px rgba(22, 163, 74, .25);
  transform-origin: calc(100% + 16px) 50%;
  opacity: 0; transform: translateX(14px) scale(.94);
  transition: opacity .38s ease, transform .5s cubic-bezier(.2, .9, .25, 1.12);
  font-family: Inter, Cairo, system-ui, sans-serif;
}
html.dark .tkc-hello { --tkh-bg: #111a2e; --tkh-line: rgba(74, 222, 128, .22); --tkh-ink: #f1f5f9; --tkh-muted: #94a3b8; box-shadow: 0 18px 40px -16px rgba(0, 0, 0, .7), 0 4px 12px -6px rgba(34, 197, 94, .25); }
.tkc-hello[hidden] { display: none; }
.tkc-hello.is-in { opacity: 1; transform: none; }
.tkc-hello.is-out { opacity: 0; transform: translateX(10px) scale(.96); transition: opacity .32s ease, transform .4s ease; }
/* الذيل يشير إلى الأيقونة */
.tkc-hello::after {
  content: ""; position: absolute; right: -6px; bottom: 18px; width: 12px; height: 12px;
  background: var(--tkh-bg); border-right: 1px solid var(--tkh-line); border-top: 1px solid var(--tkh-line);
  transform: rotate(45deg); border-radius: 0 3px 0 0;
}
.tkc-hello-body {
  flex: 1; min-width: 0; text-align: left; cursor: pointer; border: 0; background: transparent; color: var(--tkh-ink);
  padding: 8px 6px 9px 12px; border-radius: 14px; font: inherit; -webkit-tap-highlight-color: transparent;
  transition: background .2s ease;
}
.tkc-hello-body:hover { background: rgba(22, 163, 74, .06); }
.tkc-hello-body:focus-visible, .tkc-hello-x:focus-visible { outline: 3px solid rgba(22, 163, 74, .4); outline-offset: 1px; }
.tkc-hello-name { display: flex; align-items: center; gap: 6px; font: 800 11px/1 Inter, sans-serif; letter-spacing: .02em; color: #16a34a; margin-bottom: 5px; }
html.dark .tkc-hello-name { color: #4ade80; }
.tkc-hello-dot { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; box-shadow: 0 0 0 3px rgba(34, 197, 94, .2); }
.tkc-hello-text { display: block; font: 600 13.5px/1.5 Inter, system-ui, sans-serif; color: var(--tkh-ink); }
.tkc-hello-x {
  flex-shrink: 0; width: 26px; height: 26px; margin: 2px; border: 0; border-radius: 9px; background: transparent;
  color: var(--tkh-muted); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; transition: background .2s, color .2s;
}
.tkc-hello-x:hover { background: rgba(100, 116, 139, .12); color: var(--tkh-ink); }
/* الكتابة تظهر بعد خروج الفقاعة بقليل */
.tkc-hello.is-in .tkc-hello-name, .tkc-hello.is-in .tkc-hello-text { animation: tkc-hello-txt .45s ease .12s both; }
@keyframes tkc-hello-txt { from { opacity: 0; transform: translateX(6px); } to { opacity: 1; transform: none; } }

/* الهاتف والتابلت: نفس منطق موضع الأيقونة (فوق شريط التنقل السفلي) */
@media (max-width: 1023px) {
  .tkc-ring { inset: -4px; }
  /* يترك مكاناً لزر واتساب العائم في اليسار (#wa-float: 16px + 52px) حتى لا تغطيه الفقاعة */
  .tkc-hello { right: calc(14px + 54px + 14px); bottom: calc(96px + env(safe-area-inset-bottom) + 4px); max-width: min(280px, calc(100vw - 82px - 80px)); }
  .tkc-hello::after { bottom: 17px; }
}
@media (max-width: 380px) {
  .tkc-hello-text { font-size: 12.5px; }
  .tkc-hello-body { padding: 7px 4px 8px 10px; }
}
@media (hover: none) { .tkc-launcher:hover { transform: none; } .tkc-launcher:hover .tkc-ring { transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .tkc-ring::before, .tkc-ring::after { animation: none !important; }
  .tkc-hello, .tkc-hello.is-out { transform: none !important; transition: opacity .2s linear !important; }
  .tkc-hello.is-in .tkc-hello-name, .tkc-hello.is-in .tkc-hello-text { animation: none !important; }
}

/* ---------- v135: سجل المحادثات (Historique) + ملاحظة الخصوصية ---------- */
.tkc-privacy { margin: 10px auto 0 !important; max-width: 320px; padding: 8px 12px; border-radius: 12px; background: var(--tkc-soft, rgba(22,163,74,.07)); font: 600 11.5px/1.7 Cairo, sans-serif !important; color: var(--tkc-muted); }
.tkc-icon.is-on { background: rgba(22, 163, 74, .12); color: var(--tkc-green); }
.tkc-hist { display: flex; flex-direction: column; gap: 8px; animation: tkc-in .25s ease both; }
.tkc-hist-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 2px 6px; }
.tkc-hist-head b { font: 800 14px Cairo, sans-serif; color: var(--tkc-ink); }
.tkc-hist-item { display: flex; flex-direction: column; align-items: stretch; gap: 3px; width: 100%; text-align: start; padding: 11px 13px; border-radius: 13px; border: 1px solid var(--tkc-line); background: var(--tkc-bg); cursor: pointer; transition: border-color .2s, transform .15s, box-shadow .2s; }
.tkc-hist-item:hover { border-color: rgba(22, 163, 74, .45); box-shadow: 0 6px 16px -10px rgba(22, 163, 74, .5); }
.tkc-hist-item:active { transform: scale(.99); }
.tkc-hist-item:focus-visible { outline: 3px solid rgba(22, 163, 74, .35); outline-offset: 2px; }
.tkc-hist-title { font: 700 13.5px/1.5 Cairo, Inter, sans-serif; color: var(--tkc-ink); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.tkc-hist-meta { font: 600 11.5px Cairo, sans-serif; color: var(--tkc-muted); }
.tkc-hist-empty { margin: 18px 0; text-align: center; font: 600 13px Cairo, sans-serif; color: var(--tkc-muted); }
.tkc-hist > .tkc-btn { align-self: center; margin-top: 6px; }