/* 修复 TOC 大纲与正文重叠的问题（01-user.md 等多标题页面） */
/* 根因：TOC 父容器是 display:flex + align-items:flex-end， */
/* flex 子项宽度由内容决定而非父列宽，导致 #TableOfContents 被内容撑到 445px， */
/* 远超 186px 的列宽，向左溢出覆盖正文 */
#TableOfContents {
  /* 约束 nav 宽度不超过父列，让内容在列宽内换行/滚动 */
  max-width: 100% !important;
}

#TableOfContents ul {
  /* 禁止多列布局，改为单列 + 垂直滚动（父级已有 overflow-y: auto + max-height） */
  flex-wrap: nowrap !important;
}

/* 允许长标题在窄列内自动换行，避免单条标题横向溢出 */
/* 原主题规则 #TableOfContents ul :where(li ul) { white-space: nowrap; } 会让 */
/* ### 级长标题（如"5.5 密码管理（在线修改密码 + 密保问题重置密码）"）不换行 */
#TableOfContents ul :where(li ul) {
  white-space: normal;
}


/* ============================================================
   大厂架构面试笔记样式（专攻大厂架构面试 系列）
   作用域全部限定在 .iv-* 下，避免与 dream 主题的 prose 全局样式冲突
   ============================================================ */
.iv-dialogue {
  display: flex;
  flex-direction: column;
  gap: 18px;
  margin: 1.25rem 0;
}

.iv-q,
.iv-a {
  max-width: 88%;
  padding: 14px 18px;
  border-radius: 16px;
  position: relative;
  line-height: 1.7;
}

.iv-q {
  align-self: flex-start;
  background: #f0f4f8;
  border-bottom-left-radius: 4px;
}

.iv-a {
  align-self: flex-end;
  background: #e8f7f1;
  border-bottom-right-radius: 4px;
}

.iv-speaker {
  font-weight: 700;
  font-size: 0.82rem;
  display: block;
  margin-bottom: 4px;
}

.iv-q .iv-speaker { color: #4a6fa5; }
.iv-a .iv-speaker { color: #2d7a5f; }

/* 让气泡内的强调词（<strong>）沿用参考笔记的红色强调，覆盖 prose 默认 */
.iv-q .iv-text strong,
.iv-a .iv-text strong { color: #d63031; }

.iv-hint {
  background: #fff9e6;
  border-left: 4px solid #fdcb6e;
  padding: 12px 16px;
  border-radius: 6px;
  margin: 1.25rem 0;
  font-size: 0.95rem;
  color: #5d4a1e;
}

.iv-mindmap {
  overflow-x: auto;
  padding: 6px 0;
  margin: 1rem 0;
}

.iv-mindmap svg {
  width: 100%;
  min-width: 760px;
  height: auto;
}

/* ---------- 暗色模式适配（dream 主题：html.dark 或系统偏好） ---------- */
.dark .iv-q { background: #1e293b; }
.dark .iv-a { background: #14342b; }
.dark .iv-q .iv-speaker { color: #93c5fd; }
.dark .iv-a .iv-speaker { color: #6ee7b7; }
.dark .iv-q .iv-text strong,
.dark .iv-a .iv-text strong { color: #f87171; }
.dark .iv-hint {
  background: #3a3320;
  color: #fde68a;
  border-left-color: #f59e0b;
}

@media (prefers-color-scheme: dark) {
  .iv-q { background: #1e293b; }
  .iv-a { background: #14342b; }
  .iv-q .iv-speaker { color: #93c5fd; }
  .iv-a .iv-speaker { color: #6ee7b7; }
  .iv-q .iv-text strong,
  .iv-a .iv-text strong { color: #f87171; }
  .iv-hint {
    background: #3a3320;
    color: #fde68a;
    border-left-color: #f59e0b;
  }
}