/* ==========================================================================
   word-ai.css — پنل کناری «دستیار هوش مصنوعی» ورد آنلاین
   (کلاس‌ها عمداً با wa- شروع می‌شوند؛ توضیح در word-ai.js)
   ========================================================================== */

/* ردیفِ دربرگیرنده‌ی «پنل + کادر سند»؛ پنل سمت چپ، مثل اکسل */
.wd-ai-row { display: flex; align-items: flex-start; direction: ltr; width: 100%; }
.wd-ai-row > .wd-workspace { flex: 1 1 auto; min-width: 0; }

.wa-panel {
  --wa-top: 130px;
  display: none; flex-direction: column; flex: 0 0 360px; width: 360px;
  position: relative; align-self: flex-start; will-change: transform; /* دنبال‌کردنِ اسکرول با JS (word-ai.js) */
  /* فاصله از لبه‌ی چپ صفحه (ویجت‌های شناور سایت) و از کادر سند */
  margin: 8px 12px 8px 60px;
  height: calc(100vh - var(--wa-top, 130px) - 30px); min-height: 420px; max-height: 840px;
  direction: rtl; text-align: right; background: #fff; color: #1f2937;
  border: 1px solid #e2e2ee; border-radius: 16px; overflow: hidden;
  box-shadow: 0 8px 28px rgba(76, 54, 160, .14), 0 1px 3px rgba(0,0,0,.06);
  font-size: 13px; z-index: 5; box-sizing: border-box;
}
.wa-panel *, .wa-panel *::before, .wa-panel *::after { box-sizing: border-box; }
.wa-panel.open { display: flex; }
.wa-panel.wa-float { position: fixed; top: 90px; left: 60px; margin: 0; height: calc(100vh - 110px); z-index: 100001; }

/* سرتیتر */
.wa-h { display: flex; align-items: center; gap: 8px; padding: 12px 14px; background: linear-gradient(135deg, #7c4dff, #00b0ff); color: #fff; font-weight: 700; flex: none; }
.wa-badge { font-size: 11px; font-weight: 400; background: rgba(255,255,255,.25); border-radius: 10px; padding: 1px 9px; white-space: nowrap; }
.wa-x { margin-inline-start: auto; border: 0; background: transparent; color: #fff; font-size: 16px; line-height: 1; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.wa-x:hover { background: rgba(255,255,255,.2); }

/* پیام‌ها */
.wa-msgs { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 12px; background: #f7f7fb; display: flex; flex-direction: column; gap: 8px; overscroll-behavior: contain; }
.wa-m { max-width: 94%; }
.wa-m.user { align-self: flex-start; }
.wa-m.assistant { align-self: flex-end; }
.wa-m .b { padding: 8px 11px; border-radius: 10px; line-height: 1.85; font-size: 13px; word-break: break-word; }
.wa-m.user .b { background: #185abd; color: #fff; border-end-start-radius: 2px; }
.wa-m.assistant .b { background: #fff; border: 1px solid #e0e0e0; border-end-end-radius: 2px; }
.wa-m code { background: #f1f1f1; padding: 0 4px; border-radius: 3px; font-size: 12px; direction: ltr; unicode-bidi: embed; }
.wa-m ul { margin: 4px 0; padding-inline-start: 18px; }

/* کارت نتیجه‌ی اعمال‌شده */
.wa-res { display: flex; align-items: center; gap: 8px; background: #ecfdf3; border: 1px solid #b7ebc9; color: #14532d; border-radius: 10px; padding: 7px 10px; }
.wa-ok { flex: none; width: 18px; height: 18px; border-radius: 50%; background: #16a34a; color: #fff; display: inline-flex; align-items: center; justify-content: center; font-size: 11px; }
.wa-res-t { flex: 1; min-width: 0; font-size: 12.5px; }
.wa-undo { flex: none; border: 1px solid #86d0a1; background: #fff; color: #166534; border-radius: 6px; padding: 2px 9px; font: inherit; font-size: 12px; cursor: pointer; }
.wa-undo:hover:not(:disabled) { background: #dcfce7; }
.wa-undo:disabled { opacity: .6; cursor: default; }
.wa-cost { margin-top: 3px; padding-inline-start: 4px; font-size: 11px; color: #6b7280; }

/* دکمه‌های کنش داخل پیام (ورود / تهیه‌ی اعتبار) */
.wa-acts { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.wa-link { display: inline-block; border: 1px solid #c4b5fd; background: #f5f3ff; color: #5b21b6; border-radius: 8px; padding: 4px 12px; font: inherit; font-size: 12px; text-decoration: none; cursor: pointer; }
.wa-link:hover { background: #ede9fe; text-decoration: none; color: #4c1d95; }

/* کارت ترغیب (ورود / خرید اعتبار) */
.wa-cta { margin-top: 6px; padding: 9px 11px; border-radius: 12px; background: linear-gradient(135deg, #f3edff, #e8f4ff); border: 1px solid #d9ccff; }
.wa-cta .s { font-size: 12px; line-height: 1.8; color: #3b2a7a; margin-bottom: 7px; }
.wa-cta-btn { display: block; width: 100%; text-align: center; border: 0; border-radius: 9px; padding: 7px 10px; background: linear-gradient(135deg, #7c4dff, #2b7cd3); color: #fff !important; font: inherit; font-size: 13px; font-weight: 700; text-decoration: none; cursor: pointer; }
.wa-cta-btn:hover { filter: brightness(1.08); text-decoration: none; }

/* نتیجه‌ی غلط‌یاب */
.wa-spell { background: #fff; border: 1px solid #e0e0e0; border-radius: 10px; padding: 8px 10px; min-width: 220px; }
.wa-spell-h { font-weight: 700; font-size: 12.5px; margin-bottom: 6px; }
.wa-spell-l { display: flex; flex-direction: column; gap: 3px; max-height: 180px; overflow-y: auto; margin-bottom: 8px; }
.wa-spell-i { text-align: right; border: 1px solid #eee; background: #fafafa; border-radius: 7px; padding: 3px 8px; font: inherit; font-size: 12.5px; cursor: pointer; }
.wa-spell-i:hover { background: #f1ecff; border-color: #d9ccff; }
.wa-spell-i s { color: #c0392b; } .wa-spell-i b { color: #15803d; }

/* چیپ‌های کار سریع */
.wa-chips { display: flex; flex-wrap: wrap; gap: 5px; padding: 6px 10px; border-top: 1px solid #eee; max-height: 92px; overflow-y: auto; flex: none; }
.wa-chip { border: 1px solid #d9ccff; background: #f6f2ff; color: #5a35c7; border-radius: 14px; padding: 3px 10px; font: inherit; font-size: 11.5px; cursor: pointer; }
.wa-chip:hover { background: #ebe3ff; }

/* ورودی */
.wa-in { padding: 8px 10px 10px; border-top: 1px solid #e0e0e0; background: #fff; flex: none; }
.wa-ctx { display: flex; gap: 6px; align-items: center; margin: 0 0 6px; font-size: 11.5px; font-weight: 400; color: #555; cursor: pointer; }
.wa-ctx input { margin: 0; }
.wa-row { display: flex; gap: 6px; align-items: stretch; }
.wa-row textarea { flex: 1; min-width: 0; resize: none; border: 1px solid #d4d4e0; border-radius: 10px; padding: 6px 9px; font: inherit; font-size: 13px; line-height: 1.7; color: #111; background: #fff; direction: rtl; }
.wa-row textarea:focus { outline: 2px solid #7c4dff; border-color: #7c4dff; }
.wa-send { flex: none; border: 0; border-radius: 10px; padding: 0 16px; background: linear-gradient(135deg, #185abd, #2b7cd3); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }
.wa-send:hover:not(:disabled) { background: #12489a; }
.wa-send:disabled { opacity: .55; cursor: default; }
.wa-foot { margin-top: 6px; font-size: 11px; color: #6b7280; }

/* نقطه‌های انتظار */
.wa-dots i { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: #7c4dff; margin: 0 1px; animation: waBounce 1s infinite; }
.wa-dots i:nth-child(2) { animation-delay: .15s; }
.wa-dots i:nth-child(3) { animation-delay: .3s; }
@keyframes waBounce { 0%, 80%, 100% { opacity: .2; transform: scale(.7); } 40% { opacity: 1; transform: scale(1.1); } }

/* پنل «نظرها/تغییرات» (word-ui.js) به‌صورت fixed سمت چپ باز می‌شود؛ وقتی دستیار باز است به راست منتقل شود تا تداخل نکند */
/* راست پنل با ۱۰۴px فاصله، تا زیر نوار ابزار عمودیِ سمت راست سایت نرود */
body.wa-open #wdReviewPane { left: auto !important; right: 104px; }

/* دکمه‌ی «دستیار هوش مصنوعی» در نوار عنوان ورد */
.wd-ai-top {
  display: inline-flex; align-items: center; gap: 5px; height: 22px; margin-inline-end: 6px; padding: 0 10px;
  border: 0; border-radius: 11px; background: linear-gradient(135deg, #7c4dff, #00b0ff); color: #fff;
  font: inherit; font-size: 11.5px; font-weight: 700; cursor: pointer; white-space: nowrap;
}
.wa-ico { flex: none; vertical-align: middle; }
.wa-title { display: inline-flex; align-items: center; gap: 6px; }
.wd-ai-top:hover { filter: brightness(1.08); }
.wd-ai-top.wd-pressed { box-shadow: 0 0 0 2px rgba(255,255,255,.65); }
@media (max-width: 520px) { .wd-ai-top .t { display: none; } .wd-ai-top { padding: 0 8px; } }

/* موبایل و تبلت: کشوی کوچک و جمع‌وجور پایین صفحه (بالاتر از ویجت‌های شناور سایت) */
@media (max-width: 900px) {
  .wd-ai-row { display: block; }
  .wa-panel, .wa-panel.wa-float {
    position: fixed; top: auto; left: 0; right: 0; bottom: 0; width: 100%; flex-basis: auto; margin: 0;
    height: min(42vh, 340px); max-height: none; min-height: 0; border-radius: 14px 14px 0 0;
    border: 1px solid #d1d5db; box-shadow: 0 -8px 30px rgba(0,0,0,.25); z-index: 2147483000;
    padding-bottom: env(safe-area-inset-bottom, 0); transform: none !important;
  }
  .wa-h { padding: 7px 10px; gap: 6px; font-size: 13px; }
  .wa-x { order: -1; margin-inline-start: 0; font-size: 15px; }
  .wa-badge { margin-inline-start: auto; font-size: 10.5px; padding: 0 8px; }
  .wa-msgs { padding: 8px; gap: 6px; }
  .wa-m { max-width: 96%; }
  .wa-m .b { padding: 5px 9px; font-size: 12.5px; line-height: 1.7; }
  .wa-chips { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; max-height: none; padding: 5px 8px; gap: 5px; -webkit-overflow-scrolling: touch; }
  .wa-chip { flex: none; white-space: nowrap; padding: 2px 9px; }
  .wa-in { padding: 5px 8px 7px; }
  .wa-ctx { margin-bottom: 4px; font-size: 11px; }
  .wa-row textarea { font-size: 16px; line-height: 1.5; height: 42px; padding: 4px 8px; }
  .wa-send { padding: 0 14px; }
  .wa-foot { display: none; }
}
@media print { .wa-panel, .wd-ai-top { display: none !important; } }