/* ✏ Правка своих сообщений в чате (chatedit.js) — токены rec.css, как чат в talk.css */

/* ✏ рядом с 🗑 (та же кнопка, левее) */
.tk-medit { position:absolute; top:2px; right:48px; display:grid; place-items:center; width:30px; height:30px; padding:0; border:1px solid var(--line); border-radius:8px;
  background:var(--card); color:var(--text2); cursor:pointer; opacity:0; }
.tk-msg:hover .tk-medit, .tk-medit:focus-visible { opacity:1; }
.tk-medit:hover { color:var(--text); border-color:var(--text2); }
.tk-medit .i { width:15px; height:15px; }
.tk-medit.off { cursor:not-allowed; }
.tk-msg:hover .tk-medit.off { opacity:.4; }
.tk-msg:has(.tk-medit) { padding-right:86px; }
/* «⋯» — только на сенсорных экранах (там наведения нет): вместо ✏ и 🗑 у своих сообщений */
.tk-mmore { position:absolute; top:2px; right:14px; display:none; place-items:center; width:30px; height:30px; padding:0; border:1px solid var(--line); border-radius:8px;
  background:var(--card); color:var(--text2); cursor:pointer; opacity:.6; }
.tk-mmore .i { width:16px; height:16px; }
.tk-mmore[aria-expanded="true"] { opacity:1; color:var(--text); }
@media (hover: none) {
  .tk-mmore { display:grid; }
  .tk-msg:has(.tk-mmore) .tk-medit, .tk-msg:has(.tk-mmore) .tk-mdel { display:none; }
  .tk-msg:has(.tk-mmore) { padding-right:52px; }
}
/* правим это сообщение — подсветка как при наведении, кнопки прячутся */
.tk-msg.editing { background:var(--soft); }
.tk-msg.editing .tk-medit, .tk-msg.editing .tk-mdel, .tk-msg.editing .tk-mmore { display:none; }
.tk-msg:has(.tk-edit) { padding-right:18px; }

/* метка «(изменено)» и приглушённый текст, пока сервер не ответил */
.tk-edited { margin-left:5px; font-size:10.5px; color:var(--text2); white-space:nowrap; cursor:default; user-select:none; vertical-align:1px; }
.tk-mtext.edpend { opacity:.5; transition:opacity .15s; }

/* редактор на месте текста */
.tk-edit { margin:3px 0 4px; min-width:0; }
.tk-edit-box { padding:9px 12px; border-radius:10px; background:var(--card); border:1px solid var(--line); }
.tk-edit-box:focus-within { border-color:var(--blue); }
.tk-edit-in { display:block; width:100%; min-height:21px; max-height:min(320px, 45vh); padding:0; border:0; border-radius:0; resize:none; overflow-y:auto;
  background:none; font:inherit; line-height:1.45; color:var(--text); outline:none; overflow-wrap:anywhere; scrollbar-width:thin; }
.tk-edit-in:focus-visible { outline:none; }
.tk-edit-foot { display:flex; align-items:center; flex-wrap:wrap; gap:4px 10px; margin-top:6px; font-size:12px; color:var(--text2); }
.tk-edit-a { padding:0; border:0; background:none; color:var(--blue); font:inherit; cursor:pointer; }
.tk-edit-a:hover { text-decoration:underline; }
.tk-edit-n { font-variant-numeric:tabular-nums; }
.tk-edit-n.bad { color:var(--bad); }
.tk-edit-btns { display:flex; gap:6px; margin-left:auto; }
.tk-edit-btns .btn { min-height:30px; padding:0 14px; border-radius:15px; font-size:12.5px; }

/* меню «⋯» (как меню пространства) */
.tk-emenu { position:fixed; z-index:41; min-width:200px; display:flex; flex-direction:column; padding:6px; border-radius:14px; background:var(--card); border:1px solid var(--line);
  box-shadow:0 18px 44px -14px rgba(0,0,0,.45); animation:tk-pop .14s ease-out; }
.tk-emenu button { display:flex; align-items:center; gap:10px; min-height:40px; padding:0 10px; border:0; border-radius:9px; background:none; color:var(--text); cursor:pointer; text-align:left; font-size:14px; }
.tk-emenu button:hover, .tk-emenu button:focus-visible { background:var(--soft); }
.tk-emenu button .i { width:17px; height:17px; color:var(--text2); }
.tk-emenu button.bad, .tk-emenu button.bad .i { color:var(--bad); }
.tk-emenu button.bad:hover { background:var(--rec-soft); }
.tk-emenu button[aria-disabled="true"] { opacity:.5; }
.tk-emenu-bg { position:fixed; inset:0; z-index:40; background:transparent; }

@media (max-width: 760px) {
  .tk-medit, .tk-mmore { width:40px; height:40px; top:0; }
  .tk-medit { right:48px; }
  .tk-mmore { right:4px; }
  .tk-msg:has(.tk-medit) { padding-right:92px; }
  .tk-msg:has(.tk-edit) { padding-right:12px; }
  .tk-edit-hint { display:none; }   /* на телефоне нет Esc — только кнопки */
  .tk-edit-in { font-size:16px; }   /* меньше 16px — iPhone увеличивает страницу при вводе */
  .tk-edit-btns { width:100%; }
  .tk-edit-btns .btn { flex:1; min-height:38px; border-radius:19px; font-size:14px; }
  /* меню — снизу, как у участника */
  .tk-emenu { left:0 !important; right:0; top:auto !important; bottom:0; width:auto; padding:22px 10px calc(10px + env(safe-area-inset-bottom)); border-radius:20px 20px 0 0; border-bottom:0; animation:tk-sheet .18s ease-out; }
  .tk-emenu::before { content:""; position:absolute; top:8px; left:50%; width:36px; height:4px; margin-left:-18px; border-radius:2px; background:var(--line); }
  .tk-emenu button { min-height:48px; font-size:15px; }
  .tk-emenu-bg { background:rgba(0,0,0,.4); }
}
@media (hover: none) and (max-width: 760px) { .tk-msg:has(.tk-mmore) { padding-right:48px; } }