/* Zholo chat message actions — isolated, ChatGPT-like message controls */
.chat-message-user .chat-message-bubble{
  background:#e7f3ff !important;
  color:#152235 !important;
  border:1px solid rgba(52,132,212,.08);
}

.chat-message-assistant{
  position:relative;
}

.zholo-message-actions{
  display:flex;
  align-items:center;
  gap:2px;
  margin-top:6px;
  margin-left:-5px;
  min-height:30px;
}

.zholo-message-action{
  width:30px;
  height:30px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#70757d;
  display:grid;
  place-items:center;
  cursor:pointer;
  padding:0;
  transition:background .15s ease,color .15s ease,transform .12s ease;
}
.zholo-message-action:hover{
  background:#f2f3f5;
  color:#202124;
}
.zholo-message-action:active{transform:scale(.94)}
.zholo-message-action svg{
  width:17px;
  height:17px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
  pointer-events:none;
}
.zholo-message-action.is-active{
  color:#1769aa;
  background:#edf6ff;
}
.zholo-message-action[data-action="dislike"].is-active{
  color:#b54a4a;
  background:#fff1f1;
}
.zholo-message-action[data-action="read"].is-speaking{
  color:#1769aa;
  background:#edf6ff;
}

.zholo-action-toast{
  position:fixed;
  left:50%;
  bottom:92px;
  transform:translateX(-50%) translateY(8px);
  z-index:10050;
  padding:8px 12px;
  border-radius:10px;
  background:rgba(28,28,30,.92);
  color:#fff;
  font-size:12px;
  font-weight:650;
  box-shadow:0 8px 30px rgba(0,0,0,.18);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
}
.zholo-action-toast.is-visible{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}

html[data-theme="dark"] .chat-message-user .chat-message-bubble{
  background:#263d52 !important;
  color:#edf6ff !important;
  border-color:rgba(120,190,255,.12);
}
html[data-theme="dark"] .zholo-message-action{color:#a9adb4}
html[data-theme="dark"] .zholo-message-action:hover{
  background:#303236;
  color:#f2f3f5;
}
html[data-theme="dark"] .zholo-message-action.is-active,
html[data-theme="dark"] .zholo-message-action[data-action="read"].is-speaking{
  color:#9fd0ff;
  background:#26384a;
}
html[data-theme="dark"] .zholo-message-action[data-action="dislike"].is-active{
  color:#ffaaaa;
  background:#472f31;
}

@media(max-width:760px){
  .zholo-message-actions{margin-top:4px;margin-left:-4px}
  .zholo-message-action{width:32px;height:32px}
  .zholo-action-toast{bottom:84px}
}
