/* -------------------------------------------------------
   Chat Highlight Overlay (Host controlled)
   Safe: isolated selectors + dedicated IDs/classes only.
-------------------------------------------------------- */

#chat-highlight-overlay {
  position: absolute;
  left: 50%;
  top: 92px; /* a bit lower so it clears header/labels */
  transform: translateX(-50%);
  z-index: 65;
  width: min(1280px, calc(100% - 24px)); /* MUCH wider */
  pointer-events: none;
  display: none;
}


#chat-highlight-overlay.show {
  display: block;
}

#chat-highlight-overlay .ch-card {
  pointer-events: none;
  padding: 18px 22px;     /* bigger padding */
  border-radius: 18px;    /* slightly more premium */
  background: rgba(2, 6, 23, 0.92);
  border: 3px solid rgba(249, 115, 22, 0.90);
  box-shadow: 0 0 34px rgba(249, 115, 22, 0.40);
  color: #e5e7eb;
}


#chat-highlight-overlay .ch-top {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 6px;
  opacity: 0.95;
}

#chat-highlight-overlay .ch-badge {
  font-size: 14px;         /* bigger */
  letter-spacing: 0.20em;
  padding: 6px 12px;
}

#chat-highlight-overlay .ch-user {
  font-weight: 900;
  font-size: 18px;         /* bigger */
}

#chat-highlight-overlay .ch-text {
  font-size: 28px;         /* ~2× readable */
  font-weight: 900;
  line-height: 1.18;
  word-break: break-word;
  text-shadow: 0 0 16px rgba(0, 0, 0, 0.75);
}


/* Host chat selection + inline actions (host-only script adds these) */
.chat-message.chat-selected {
  outline: 2px solid rgba(249, 115, 22, 0.9);
  border-radius: 10px;
  background: rgba(249, 115, 22, 0.10);
}

.chat-message .chat-actions {
  display: flex;
  gap: 6px;
  margin-top: 6px;
}

.chat-message .chat-actions button {
  font-size: 11px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(2, 6, 23, 0.65);
  color: #e5e7eb;
  cursor: pointer;
  pointer-events: auto; /* buttons are inside chat, allow clicks */
}

.chat-message .chat-actions button.primary {
  border-color: rgba(249, 115, 22, 0.85);
}

.chat-message .chat-actions button.danger {
  border-color: rgba(239, 68, 68, 0.85);
}