/* Forum quick-switch layout authority.
   Loaded after chatroom.css and limited to .chatRoom.presentation-forum.
   Forum is a compact thread/post mode: visible identity, clear user direction,
   bounded rich HTML, and mobile-first widths. */

.chatRoom.presentation-forum {
  --chat-room-shell-max: 960px;
  --chat-assistant-bubble-max: 780px;
  --chat-user-bubble-max: 720px;
  --chat-message-gap: 14px !important;
  --chat-avatar-size: 38px;
  --chat-avatar-radius: 12px;
  --chat-bubble-radius: 14px;
  --chat-forum-bg: color-mix(in srgb, var(--chat-bg) 86%, var(--chat-surface) 14%);
  --chat-forum-card: color-mix(in srgb, var(--chat-bot-bubble) 90%, var(--chat-surface) 10%);
  --chat-forum-text: var(--chat-bot-ink, var(--chat-text));
  --chat-forum-muted: color-mix(in srgb, var(--chat-forum-text) 56%, transparent);
  --chat-forum-line: color-mix(in srgb, var(--chat-border) 58%, var(--chat-forum-text) 12%);
  --chat-forum-shadow: 0 10px 22px color-mix(in srgb, var(--chat-bg) 22%, transparent);
}

.chatRoom.presentation-forum .chatBg::after {
  background: var(--chat-forum-bg);
}

.chatRoom.presentation-forum .chatShell {
  max-width: min(100%, var(--chat-room-shell-max));
}

.chatRoom.presentation-forum .chatScroll {
  padding: 16px clamp(10px, 2vw, 22px) var(--chat-scroll-tail-space);
}

.chatRoom.presentation-forum .chatMessages {
  gap: var(--chat-message-gap);
  max-width: 100%;
  margin: 0 auto;
}

.chatRoom.presentation-forum .msgRow,
.chatRoom.presentation-forum .msgRow.assistant,
.chatRoom.presentation-forum .msgRow.richPageSurface {
  justify-content: flex-start;
  align-items: flex-start;
  gap: 9px;
  width: 100%;
  max-width: 100%;
}

.chatRoom.presentation-forum .msgRow.user {
  justify-content: flex-end;
}

.chatRoom.presentation-forum .msgAvatarSlot,
.chatRoom.presentation-forum .msgRow.user .msgAvatarSlot {
  position: relative;
  flex: 0 0 var(--chat-avatar-size);
  width: var(--chat-avatar-size);
  height: var(--chat-avatar-size);
  margin-top: 1px;
  border-width: 1px;
  border-radius: var(--chat-avatar-radius);
  box-shadow: 0 7px 14px rgba(7, 10, 24, 0.12);
  pointer-events: none;
}

.chatRoom.presentation-forum .msgRow.user .msgAvatarSlot {
  order: 2;
}

.chatRoom.presentation-forum .msgAvatarInitial {
  font-size: 13px;
}

.chatRoom.presentation-forum .bubble,
.chatRoom.presentation-forum .msgRow.assistant .bubble,
.chatRoom.presentation-forum .msgRow.user .bubble,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubble,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubble.wideRich {
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: min(100%, var(--chat-assistant-bubble-max));
  max-width: min(100%, var(--chat-assistant-bubble-max));
  min-width: 0;
  min-inline-size: 0;
  border: 1px solid color-mix(in srgb, var(--chat-forum-line) 74%, transparent);
  border-radius: var(--chat-bubble-radius);
  background: color-mix(in srgb, var(--chat-forum-card) 90%, transparent);
  color: var(--chat-forum-text);
  box-shadow: var(--chat-forum-shadow);
  overflow: hidden;
}

.chatRoom.presentation-forum .msgRow.assistant .bubble,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubble,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubble.wideRich {
  width: min(100%, var(--chat-assistant-bubble-max)) !important;
  max-width: min(100%, var(--chat-assistant-bubble-max)) !important;
}

.chatRoom.presentation-forum .msgRow.user .bubble {
  order: 1;
  width: fit-content;
  max-width: min(100%, var(--chat-user-bubble-max));
  margin-left: auto;
  background: color-mix(in srgb, var(--chat-user-bubble) 72%, var(--chat-forum-card) 28%);
  color: var(--chat-user-ink, var(--chat-text));
}

.chatRoom.presentation-forum .bubbleHead,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleHead,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleHead {
  min-height: 0;
  padding: 8px 11px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.chatRoom.presentation-forum .bubbleIdentity {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  gap: 7px;
}

.chatRoom.presentation-forum .bubbleRole,
.chatRoom.presentation-forum .msgRow.user .bubbleRole {
  color: currentColor;
  font-size: 13px;
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: 0;
}

.chatRoom.presentation-forum .msgTimeLine {
  gap: 6px;
  color: var(--chat-forum-muted);
  font-size: 11px;
  line-height: 1.2;
}

.chatRoom.presentation-forum .bubbleBody,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleBody,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleBody {
  min-height: 0;
  padding: 0 11px 11px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.chatRoom.presentation-forum .bubbleText,
.chatRoom.presentation-forum .bubbleText.rich,
.chatRoom.presentation-forum .bubbleText.sandbox {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  padding: 5px 0 0;
  color: currentColor;
  font-size: 14.5px;
  font-weight: 560;
  line-height: 1.7;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.chatRoom.presentation-forum .bubbleText.rich .richInner,
.chatRoom.presentation-forum .bubbleText.rich.richLayout-wide .richInner,
.chatRoom.presentation-forum .bubbleText.rich [data-rich-flow-segment="html"],
.chatRoom.presentation-forum .bubbleText.rich [data-rich-flow-segment="html"] > *,
.chatRoom.presentation-forum .bubbleText.sandbox .richSandbox {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

.chatRoom.presentation-forum .bubbleText :is(pre, code, table, img, video, iframe, canvas, svg) {
  max-width: 100%;
}

.chatRoom.presentation-forum .bubbleText pre {
  overflow: auto;
}

.chatRoom.presentation-forum .bubbleText img,
.chatRoom.presentation-forum .bubbleText video {
  height: auto;
}

.chatRoom.presentation-forum .bubbleText.sandbox .richSandbox {
  max-height: min(60dvh, 520px);
  overflow: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  border-color: var(--chat-forum-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--chat-forum-card) 94%, transparent);
  box-shadow: none;
}

.chatRoom.presentation-forum .msgToolWrap {
  position: relative;
  z-index: 3;
  gap: 4px;
}

.chatRoom.presentation-forum .msgToolWrap.expanded {
  max-width: min(100%, 300px);
}

.chatRoom.presentation-forum .msgToolBar,
.chatRoom.presentation-forum .msgToolBar.expanded,
.chatRoom.presentation-forum .msgToolInlineActions {
  gap: 4px;
}

.chatRoom.presentation-forum .msgToolBtn {
  width: 26px;
  height: 26px;
  border-radius: 8px;
  color: var(--chat-forum-muted);
}

.chatRoom.presentation-forum .msgToolBtnIcon {
  font-size: 13px;
}

.chatRoom.presentation-forum .msgToolInlineAction {
  min-height: 28px;
  padding: 0 8px;
  color: var(--chat-forum-muted);
  font-size: 11px;
}

.chatRoom.presentation-forum .msgToolBtn:hover,
.chatRoom.presentation-forum .msgToolBtn:focus-visible,
.chatRoom.presentation-forum .msgToolBtn.active,
.chatRoom.presentation-forum .msgToolBtn.primary,
.chatRoom.presentation-forum .msgToolInlineAction:hover,
.chatRoom.presentation-forum .msgToolInlineAction:focus-visible {
  color: currentColor;
  background: color-mix(in srgb, var(--chat-forum-card) 70%, transparent);
}

.chatRoom.presentation-forum .bubbleMeta,
.chatRoom.presentation-forum .bubbleActionRow,
.chatRoom.presentation-forum .replyCandidateControls {
  display: none;
}

.chatRoom.presentation-forum .chatHeroCard,
.chatRoom.presentation-forum .chatHeroCard.compact,
.chatRoom.presentation-forum .chatHeroCard.hasWideOpener {
  width: min(100%, var(--chat-assistant-bubble-max));
  max-width: 930px;
  margin-inline: auto;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.chatRoom.presentation-forum .chatHeroBlock.openerOnly {
  display: grid;
  gap: 6px;
  width: min(100%, var(--chat-assistant-bubble-max));
  max-width: 100%;
  margin: 0 auto 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.chatRoom.presentation-forum .chatHeroBlock.openerOnly .chatHeroLabel,
.chatRoom.presentation-forum .chatHeroBlock.openerOnly .chatHeroQuote {
  border: 1px solid var(--chat-forum-line);
  background: var(--chat-forum-card);
  box-shadow: var(--chat-forum-shadow);
}

.chatRoom.presentation-forum .chatHeroBlock.openerOnly .chatHeroLabel {
  min-height: 30px;
  padding: 4px 12px;
  border-radius: 12px;
  color: var(--chat-forum-muted);
  font-size: 11px;
  font-weight: 850;
}

.chatRoom.presentation-forum .chatHeroBlock.openerOnly .chatHeroQuote {
  min-height: 0;
  margin: 0;
  padding: 12px 14px;
  border-radius: 13px;
  color: var(--chat-forum-text);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.66;
}

.chatRoom.presentation-forum .chatHeroActions {
  display: none;
}

.chatRoom.presentation-forum .chatStatCard {
  min-height: 42px;
  padding: 7px 10px;
  border-color: var(--chat-forum-line);
  border-radius: 12px;
  background: var(--chat-forum-card);
  color: var(--chat-forum-text);
  box-shadow: none;
}

.chatRoom.presentation-forum .msgAvatarSlot::after,
.chatRoom.presentation-forum .bubbleHead::before,
.chatRoom.presentation-forum .bubbleHead::after,
.chatRoom.presentation-forum .bubbleBody::before,
.chatRoom.presentation-forum .bubbleBody::after,
.chatRoom.presentation-forum .bubbleText::before,
.chatRoom.presentation-forum .bubbleText::after,
.chatRoom.presentation-forum .bubbleMeta::after,
.chatRoom.presentation-forum .bubbleActionRow::after {
  content: none !important;
  display: none !important;
}

@media (max-width: 640px) {
  .chatRoom.presentation-forum {
    --chat-assistant-bubble-max: calc(100% - var(--chat-avatar-size) - 9px);
    --chat-user-bubble-max: min(300px, calc(100% - var(--chat-avatar-size) - 9px));
    --chat-message-gap: 11px !important;
    --chat-avatar-size: 32px;
    --chat-avatar-radius: 10px;
    --chat-bubble-radius: 13px;
  }

  .chatRoom.presentation-forum .chatScroll {
    padding: 12px 9px var(--chat-scroll-tail-space);
  }

  .chatRoom.presentation-forum .msgRow,
  .chatRoom.presentation-forum .msgRow.user,
  .chatRoom.presentation-forum .msgRow.assistant {
    gap: 7px;
  }

  .chatRoom.presentation-forum .bubble {
    gap: 5px;
  }

  .chatRoom.presentation-forum .bubbleHead {
    padding: 7px 9px 0;
  }

  .chatRoom.presentation-forum .bubbleBody {
    padding: 0 9px 9px;
  }

  .chatRoom.presentation-forum .bubbleText,
  .chatRoom.presentation-forum .bubbleText.sandbox {
    font-size: 14px;
    line-height: 1.66;
  }

  .chatRoom.presentation-forum .bubbleText.sandbox .richSandbox {
    max-height: none;
    overflow: visible;
    overscroll-behavior-y: auto;
    -webkit-overflow-scrolling: auto;
  }

  .chatRoom.presentation-forum .bubbleText.sandbox .richSandboxFrame {
    max-height: none !important;
  }
}

.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText.rich,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText.sandbox,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText.rich,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText.sandbox {
  min-height: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
  padding: 5px 0 0 !important;
  border-radius: 0 !important;
  font-size: 14px;
  line-height: 1.66;
}

.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText.rich .richInner,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText.rich .richInner,
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText.rich [data-rich-flow-segment="html"],
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText.rich [data-rich-flow-segment="html"],
.chatRoom.presentation-forum .msgRow.richPageSurface .bubbleText.rich [data-rich-flow-segment="html"] > *,
.chatRoom.presentation-forum .msgRow.richPageSurface.richWide .bubbleText.rich [data-rich-flow-segment="html"] > * {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box;
}

/* 20260526 forum layout authority: forum posts use a large author rail and
   rectangular post bodies, clearly separate from chat bubbles. */
@media (min-width: 900px) {
  .chatRoom.presentation-forum {
    --chat-room-shell-max: 1120px;
    --chat-avatar-size: 72px;
    --chat-message-gap: 18px !important;
    --chat-bubble-radius: 6px;
  }

  .chatRoom.presentation-forum .msgAvatarSlot,
  .chatRoom.presentation-forum .msgRow.user .msgAvatarSlot {
    flex-basis: var(--chat-avatar-size);
    width: var(--chat-avatar-size);
    height: var(--chat-avatar-size);
    border-radius: 10px;
  }

  .chatRoom.presentation-forum .msgRow,
  .chatRoom.presentation-forum .msgRow.assistant,
  .chatRoom.presentation-forum .msgRow.user {
    gap: 16px;
  }

  .chatRoom.presentation-forum .bubble,
  .chatRoom.presentation-forum .msgRow.assistant .bubble,
  .chatRoom.presentation-forum .msgRow.user .bubble {
    border-radius: var(--chat-bubble-radius);
  }

  .chatRoom.presentation-forum .bubbleHead {
    padding: 12px 16px 8px;
    border-bottom: 1px solid color-mix(in srgb, var(--chat-border) 54%, transparent);
    background: color-mix(in srgb, var(--chat-surface) 34%, transparent);
  }

  .chatRoom.presentation-forum .bubbleBody {
    padding: 0 16px 16px;
  }
}
