/* ================= پیام‌های خصوصی ================= */
.card:has(> #conversationList){
  --dm-brand:#3C01AF; --dm-brand-soft:rgba(60,1,175,.07);
  --dm-ink:#13152C; --dm-ink2:#565E70; --dm-ink3:#7A8394;
  --dm-line:#E7EAF1; --dm-paper:#fff; --dm-bg:#F5F6FA;
  --dm-frame:max(620px, calc(100dvh - 150px));
  display:grid !important; grid-template-columns:300px minmax(0,1fr) !important;
  gap:0 !important; padding:0 !important;
  height:var(--dm-frame) !important; max-height:var(--dm-frame) !important;
  min-height:420px !important; overflow:hidden !important;
  border-radius:14px; background:var(--dm-paper);
}
html[data-theme="dark"] .card:has(> #conversationList){
  --dm-ink:#F4F6FA; --dm-ink2:#B9C0CE; --dm-ink3:#8E96A6;
  --dm-line:rgba(255,255,255,.10); --dm-paper:#14162B; --dm-bg:#0E1020;
  --dm-brand-soft:rgba(124,77,255,.16);
}

/* ---------- فهرست مخاطبان ---------- */
#conversationList{
  width:auto !important; min-width:0;
  border-inline-start:1px solid var(--dm-line) !important;
  overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin;
  padding:8px !important; display:flex; flex-direction:column; gap:3px;
  background:var(--dm-paper);
}
.conv-row{
  padding:9px 10px !important; gap:10px !important;
  border-radius:10px; min-height:54px; flex:0 0 auto;
  background:transparent !important; transition:background .12s ease;
}
.conv-row:hover{ background:var(--dm-brand-soft) !important; }
.conv-row[style*="parchment"],
.conv-row.is-active{
  background:var(--dm-brand-soft) !important;
  box-shadow:inset 2px 0 0 var(--dm-brand);
}
.conv-row .avatar{ border-radius:10px !important; font-weight:800; }
.conv-row > div > div:first-child{ font-size:13.5px !important; color:var(--dm-ink); }
.conv-row .muted{ font-size:12px !important; color:var(--dm-ink3) !important; }
.conv-row .pill{ font-size:11px; padding:2px 8px; border-radius:999px; font-weight:700; }

/* ---------- ناحیه گفتگو ---------- */
.chat-wrap{
  display:flex !important; flex-direction:column; min-width:0; min-height:0;
  height:auto !important; padding:0 !important; background:var(--dm-bg);
}
.chat-log{
  flex:1 1 0 !important; min-height:0 !important; height:auto !important;
  overflow-y:auto; overscroll-behavior:contain; overflow-anchor:none;
  display:flex; flex-direction:column; gap:12px;
  padding:18px 18px 22px !important; scrollbar-width:thin;
}
.chat-msg{
  display:flex; gap:10px; align-items:flex-start;
  max-width:min(74%, 640px); min-width:0;
}
.chat-msg.is-me{ margin-inline-start:auto; flex-direction:row-reverse; }
.chat-msg > div{ min-width:0; display:flex; flex-direction:column; gap:4px; }
.chat-msg.is-me > div{ align-items:flex-end; }
.chat-msg .avatar{ flex:0 0 auto; border-radius:50% !important; font-weight:700; }
.chat-sender{ font-size:12px; font-weight:800; color:var(--dm-ink); }
.chat-bubble{
  background:var(--dm-paper); border:1px solid var(--dm-line);
  border-radius:14px; padding:10px 13px; width:fit-content; max-width:100%;
  font-size:14px; line-height:1.95; color:var(--dm-ink);
  white-space:pre-wrap; overflow-wrap:anywhere; word-break:break-word;
}
.chat-msg.is-me .chat-bubble{
  background:var(--dm-brand); border-color:var(--dm-brand); color:#fff;
}
.delete-msg{ align-self:flex-start; color:var(--dm-ink3) !important; }
.delete-msg:hover{ color:#B42318 !important; }

.empty-state{
  margin:auto; text-align:center; padding:32px 24px;
  display:flex; flex-direction:column; gap:6px; align-items:center;
}
.empty-state h3{ margin:0; font-size:16px; font-weight:800; color:var(--dm-ink); }
.empty-state p{ margin:0; font-size:13px; line-height:2; color:var(--dm-ink3); max-width:40ch; }

#dmReadOnly{
  flex:0 0 auto; border-top:1px solid var(--dm-line);
  background:var(--dm-paper); padding:14px 18px !important;
  text-align:center; color:var(--dm-ink3) !important;
}

/* ---------- کادر نوشتن ---------- */
.chat-input-row{
  display:flex !important; gap:9px; align-items:flex-end; flex:0 0 auto;
  min-width:0; padding:12px 14px !important;
  border-top:1px solid var(--dm-line); background:var(--dm-paper);
}
.chat-input-row textarea{
  flex:1 1 auto; width:100%; min-width:0; box-sizing:border-box;
  min-height:44px; max-height:150px; resize:none; overflow-y:auto;
  padding:11px 13px; border-radius:10px;
  border:1px solid var(--dm-line) !important;
  background:var(--dm-bg) !important; color:var(--dm-ink) !important;
  -webkit-text-fill-color:var(--dm-ink) !important;
  font-family:inherit; font-size:14px; line-height:1.85;
}
.chat-input-row textarea::placeholder{
  color:var(--dm-ink3) !important; -webkit-text-fill-color:var(--dm-ink3) !important; opacity:1;
}
.chat-input-row textarea:focus{
  outline:2px solid rgba(60,1,175,.20); outline-offset:0;
  border-color:var(--dm-brand) !important;
}
.chat-input-row .btn{ flex:0 0 auto; min-height:44px; padding-inline:18px; }

/* ---------- مانیتور بزرگ ---------- */
@media (min-width: 1600px){
  .card:has(> #conversationList){
    grid-template-columns:340px minmax(0,1fr) !important;
    --dm-frame:max(700px, calc(100dvh - 140px));
  }
  .chat-msg{ max-width:min(66%, 720px); }
}

/* ---------- تبلت و گوشی ---------- */
@media (max-width: 900px){
  html body .card:has(> #conversationList){
    grid-template-columns:minmax(0,1fr) !important;
    grid-template-rows:auto minmax(0,1fr) !important;
    height:calc(100dvh - 190px) !important;
    max-height:calc(100dvh - 190px) !important;
    min-height:340px !important;
  }
  html body #conversationList{
    border-inline-start:0 !important;
    border-bottom:1px solid var(--dm-line);
    flex-direction:row !important; gap:8px;
    overflow-x:auto !important; overflow-y:hidden !important;
    padding:8px !important; scrollbar-width:none;
    scroll-snap-type:x proximity;
  }
  html body #conversationList::-webkit-scrollbar{ display:none; }
  html body .conv-row{
    width:min(208px, 62vw) !important; flex:0 0 auto !important;
    border:1px solid var(--dm-line); scroll-snap-align:start;
    min-height:52px;
  }
  html body .conv-row[style*="parchment"]{ border-color:var(--dm-brand); box-shadow:none; }
  html body .conv-row .muted{ display:none !important; }
  .chat-msg{ max-width:86%; }
  .chat-log{ padding:12px 12px 16px !important; gap:10px; }
}
@media (max-width: 620px){
  html body .card:has(> #conversationList){
    height:calc(100dvh - 178px) !important;
    max-height:calc(100dvh - 178px) !important;
    min-height:300px !important;
    border-radius:12px;
  }
  html body .conv-row{ width:min(180px, 56vw) !important; min-height:48px; padding:8px 9px !important; }
  html body .conv-row > div > div:first-child{ font-size:12.5px !important; }
  .chat-msg{ max-width:100%; }
  .chat-bubble{ font-size:13.5px; padding:9px 11px; border-radius:12px; }
  .chat-sender{ font-size:11.5px; }
  .chat-log{ padding:10px 10px 14px !important; gap:9px; }
  .chat-input-row{ padding:9px 10px !important; gap:7px; }
  .chat-input-row textarea{ font-size:13.5px; min-height:40px; max-height:110px; padding:9px 11px; }
  .chat-input-row .btn{ min-height:40px; padding-inline:14px; font-size:12.5px; }
  .empty-state{ padding:22px 16px; }
  .empty-state h3{ font-size:15px; }
  .empty-state p{ font-size:12.5px; }
}
/* هنگام باز بودن کیبورد */
html.kb-open body .card:has(> #conversationList){
  height:calc(100dvh - 70px) !important; max-height:calc(100dvh - 70px) !important;
  min-height:170px !important;
}
html.kb-open body #conversationList{ display:none !important; }


/* ---------- گوشی: اصلاح ردیف نوشتن و نوار مخاطبان ---------- */
@media (max-width: 900px){
  html body #conversationList{
    height:auto !important; min-height:70px !important; max-height:76px !important;
    align-items:stretch !important; flex:0 0 auto !important;
  }
  html body .conv-row{ height:auto !important; min-height:54px !important; align-items:center !important; }

  html body .chat-input-row{
    display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important;
    align-items:flex-end !important; gap:8px !important; width:100% !important;
  }
  html body .chat-input-row textarea{
    flex:1 1 auto !important; width:auto !important; min-width:0 !important;
    display:block !important; height:auto !important; min-height:42px !important;
  }
  html body .chat-input-row .btn,
  html body .chat-input-row button[type="submit"]{
    flex:0 0 auto !important; width:auto !important;
    min-width:76px !important; max-width:110px !important;
    margin:0 !important; display:inline-flex !important;
    align-items:center !important; justify-content:center !important;
  }
}


/* ---------- تنظیم نهایی اندازه‌ها ---------- */
html body .card:has(> #conversationList){
  --dm-frame:max(560px, calc(100dvh - 130px));
}
html body .chat-input-row{ padding:10px 14px !important; align-items:center !important; }
html body .chat-input-row textarea{
  min-height:44px !important; height:44px !important; max-height:120px !important;
  padding:11px 14px !important; line-height:1.6 !important;
  font-size:13.5px !important; overflow-y:auto !important;
}
html body .chat-input-row .btn{ min-height:44px !important; height:44px !important; padding-inline:20px !important; }

/* دکمه حذف: کوچک و چسبیده به حباب */
html body .delete-msg{
  margin-top:2px !important; padding:1px 6px !important;
  font-size:10.5px !important; opacity:.55; background:transparent !important;
  border:0 !important; min-height:0 !important;
}
html body .delete-msg:hover{ opacity:1; }

html body .chat-log{ padding:14px 16px 18px !important; gap:10px !important; }
html body .chat-bubble{ font-size:13.5px !important; line-height:1.85 !important; padding:9px 12px !important; }
html body .chat-sender{ font-size:11.5px !important; }
html body .chat-msg{ max-width:min(68%, 600px) !important; }
html body .chat-msg .avatar{ width:26px !important; height:26px !important; font-size:11px !important; }

html body #conversationList{ padding:7px !important; }
html body .conv-row{ min-height:50px !important; padding:8px 9px !important; }
html body .conv-row > div > div:first-child{ font-size:12.5px !important; }
html body .conv-row .muted{ font-size:11px !important; }

@media (min-width: 1600px){
  html body .card:has(> #conversationList){ --dm-frame:max(640px, calc(100dvh - 120px)); }
  html body .chat-msg{ max-width:min(60%, 680px) !important; }
  html body .chat-bubble{ font-size:14px !important; }
}
@media (max-width: 900px){
  html body .card:has(> #conversationList){
    height:calc(100dvh - 185px) !important; max-height:calc(100dvh - 185px) !important;
  }
  html body .chat-msg{ max-width:88% !important; }
}
@media (max-width: 620px){
  html body .card:has(> #conversationList){
    height:calc(100dvh - 172px) !important; max-height:calc(100dvh - 172px) !important;
  }
  html body .chat-msg{ max-width:100% !important; }
  html body .chat-bubble{ font-size:13px !important; padding:8px 11px !important; }
  html body .chat-input-row{ padding:8px 10px !important; }
  html body .chat-input-row textarea{ min-height:40px !important; height:40px !important; font-size:13px !important; padding:9px 11px !important; }
  html body .chat-input-row .btn{ min-height:40px !important; height:40px !important; padding-inline:14px !important; font-size:12.5px !important; }
}


/* ---------- دسکتاپ: کادر نوشتن بزرگ‌تر ---------- */
@media (min-width: 901px){
  html body .chat-input-row{ padding:14px 16px !important; align-items:flex-end !important; }
  html body .chat-input-row textarea{
    min-height:76px !important; height:76px !important; max-height:200px !important;
    font-size:14.5px !important; line-height:1.9 !important; padding:13px 15px !important;
  }
  html body .chat-input-row .btn{
    min-height:76px !important; height:76px !important;
    padding-inline:26px !important; font-size:14px !important;
  }
}
@media (min-width: 1600px){
  html body .chat-input-row textarea{
    min-height:90px !important; height:90px !important; max-height:240px !important; font-size:15px !important;
  }
  html body .chat-input-row .btn{ min-height:90px !important; height:90px !important; }
}


/* زمان پیام */
.chat-when{
  font-size:10.5px; color:var(--dm-ink3);
  font-variant-numeric:tabular-nums; white-space:nowrap; opacity:.85;
}
.chat-msg.is-me .chat-when{ text-align:start; }
@media (max-width: 620px){ .chat-when{ font-size:10px; } }


/* ---------- گوشی: کادر نوشتن پیام خصوصی ---------- */
@media (max-width: 620px){
  html body .chat-input-row{ padding:9px 10px !important; gap:8px !important; align-items:center !important; }
  html body .chat-input-row textarea{
    min-height:62px !important; height:62px !important; max-height:130px !important;
    font-size:13.5px !important; line-height:1.7 !important; padding:10px 12px !important;
  }
  html body .chat-input-row .btn{
    min-height:62px !important; height:62px !important;
    padding-inline:16px !important; font-size:13px !important; min-width:70px !important;
  }
  html body .chat-input-row textarea::placeholder{ font-size:13px !important; }
}


/* ---------- حذف پرش افقی ---------- */
html,body{ overflow-x:hidden !important; max-width:100% !important; }
html body .ch-wrap{ overflow-x:clip; max-width:100%; }
/* snap باعث می‌شد نوار افقی بعد از رندر یک تکان بخورد */
html body .ch-list{ scroll-snap-type:none !important; scroll-behavior:auto !important; }
html body .ch-item{ scroll-snap-align:none !important; }
html body #conversationList{ scroll-snap-type:none !important; scroll-behavior:auto !important; }
html body .conv-row{ scroll-snap-align:none !important; }
/* نوار اسکرول عمودی همیشه رزرو شود تا ظاهر و ناپدید شدنش صفحه را جابه‌جا نکند */
html{ scrollbar-gutter:stable; }