/* #region zone:monitor.page.support — หน้าช่วยเหลือสมาชิก */
/* Support page (console-support.js) — page specifics only; components come from design-system.css. */
.support-summary {
  display: block;
  max-width: 420px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
/* A prospect case's name with its "ผู้สนใจ" pill: never touching, wraps at narrow widths. */
.support-who {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
}
/* Prospects tab: the avatar + name cell keeps a readable width when the table scrolls on a phone. */
.prospect-who {
  min-width: 176px;
}
/* "ให้สิทธิ์" + "เปิดเรื่อง" and the member-state / unfollowed pills: 8px apart, wrap on narrow screens. */
.prospect-actions,
.prospect-notes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-2);
}
.prospect-actions {
  flex-wrap: nowrap;
  justify-content: flex-end;
}
.conversation-kind {
  justify-content: flex-start;
}
.prospect-notes {
  margin-top: var(--s-2);
}
.support-back {
  align-self: flex-start;
  margin-left: calc(-1 * var(--s-3));
}
.support-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--s-3);
  margin-bottom: var(--s-4);
  font-size: var(--fs-sm);
  color: var(--text-2);
}
.support-meta strong {
  font-size: var(--fs-md);
  color: var(--text-1);
}
.support-timeline {
  list-style: none;
  margin: var(--s-5) 0 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--s-3);
}
.support-msg {
  max-width: 78%;
  padding: var(--s-3) var(--s-4);
  border-radius: var(--r-lg);
  border: 1px solid var(--border);
  background: var(--surface-2);
}
.support-msg small {
  display: block;
  font-size: var(--fs-xs);
  color: var(--text-3);
}
.support-msg p {
  margin-top: var(--s-1);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.support-msg-member {
  align-self: flex-start;
}
.support-msg-assistant {
  align-self: flex-start;
  background: var(--surface-3);
}
.support-msg-admin {
  align-self: flex-end;
  background: var(--accent-soft);
  border-color: transparent;
}
.support-close {
  display: flex;
  gap: var(--s-2);
  align-items: center;
}
.support-close .input {
  flex: 1;
}
.support-samples small {
  display: block;
  color: var(--text-2);
  overflow-wrap: anywhere;
  font-size: var(--fs-xs);
}
@media (max-width: 699px) {
  .support-msg {
    max-width: 100%;
  }
  .support-close {
    flex-direction: column;
    align-items: stretch;
  }
}
/* #endregion */