/* 移动端样式 */
@media screen and (max-width: 768px) {
  /* 整体布局调整 - 只针对主要容器 */
  .chat-container .flex:not(.flex-row),
  .sidebar-container .flex:not(.flex-row),
  .message-container .flex:not(.flex-row):not([class*="items-center"]) {
    flex-direction: column;
  }

  /* 确保按钮组保持水平排列 */
  .message-container .button-group {
    flex-direction: row !important;
    display: flex !important;
  }

  /* Override for the sidebar top bar to ensure row layout */
  .sidebar-top-bar {
    flex-direction: row !important; 
  }

  /* Set height for search input and new button in mobile sidebar */
  .sidebar-top-bar input,
  .sidebar-top-bar button {
    height: 44px !important;
    box-sizing: border-box !important; /* Include padding/border in height */
  }

  /* Optional: Adjust padding if needed for visual alignment within the height */
  .sidebar-top-bar input {
    padding-top: 0.5rem !important; 
    padding-bottom: 0.5rem !important;
  }
  .sidebar-top-bar button {
    padding-top: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  /* 导航栏样式 */
  nav {
    display: none !important;
  }

  /* 汉堡菜单按钮 */
  .menu-button {
    position: fixed !important;
    left: 1rem !important;
    top: 1rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    background: var(--chat-bg) !important;
    border: none !important;
    border-radius: 8px !important;
    z-index: 1002 !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
    cursor: pointer !important;
  }

  .menu-button:active {
    background: var(--hover-color) !important;
  }

  .menu-button svg {
    width: 24px !important;
    height: 24px !important;
    color: var(--text-primary) !important;
  }

  /* 侧边栏样式 - 抽屉模式 */
  .sidebar-container {
    position: fixed !important;
    top: 0 !important;
    left: -100% !important;
    width: 80% !important;
    height: 100vh !important;
    background: var(--sidebar-bg) !important;
    z-index: 1001 !important;
    transition: left 0.3s ease !important;
    box-shadow: none !important;
    padding: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    border-right: 1px solid var(--border-color) !important;
  }

  /* 侧边栏打开状态 */
  .sidebar-container.open {
    left: 0 !important;
    box-shadow: 2px 0 10px rgba(0, 0, 0, 0.1) !important;
  }

  /* 遮罩层 */
  .sidebar-overlay {
    display: none !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: rgba(0, 0, 0, 0.3) !important;
    z-index: 1000 !important;
  }

  .sidebar-overlay.show {
    display: block !important;
  }

  /* 聊天区域样式 */
  .chat-container {
    width: 100% !important;
    height: 100vh !important;
    margin-top: 0 !important;
    padding-bottom: 70px !important;
    padding-top: 0 !important;
  }

  /* 头部区域调整 */
  .chat-container > div:first-child {
    height: 56px !important;
    padding: 0 1rem !important;
    padding-top: 1rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    background: var(--chat-bg) !important;
    border-bottom: 1px solid var(--border-color) !important;
  }

  /* 左侧模型选择器按钮 */
  .chat-container .model-selector {
    width: 36px !important;
    height: 36px !important;
  }

  .chat-container .model-selector > button {
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    border: none !important;
    border-radius: 8px !important;
  }

  /* 隐藏中间标题 */
  .chat-container > div:first-child > div:nth-child(2) {
    display: none !important;
  }

  /* 右侧主题切换按钮 */
  .chat-container > div:first-child > div:last-child {
    display: none !important;
  }

  /* 主题切换按钮 */
  .theme-switcher {
    position: fixed !important;
    right: 1rem !important;
    top: 1rem !important;
    z-index: 1002 !important;
  }

  .theme-switcher button {
    width: 36px !important;
    height: 36px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: var(--chat-bg) !important;
    border: none !important;
    border-radius: 8px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  }

  .theme-switcher button:active {
    background: var(--hover-color) !important;
  }

  .theme-switcher button svg {
    width: 20px !important;
    height: 20px !important;
  }

  /* 消息样式 */
  .message-container {
    max-width: 100% !important;
    padding: 1rem !important;
  }

  .message-container > div {
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 手机端AI消息特殊样式 */
  .chat-message .flex[class*="justify-start"] > div {
    max-width: 98% !important;
    margin-left: 0 !important;
  }

  /* 隐藏手机端AI头像 */
  .chat-message .flex[class*="justify-start"] .flex-shrink-0:has(img) {
    display: none !important;
  }

  /* 移除AI消息的左侧间距 */
  .chat-message .flex[class*="justify-start"] > div {
    gap: 0 !important;
  }

  /* AI消息气泡右边距调整 */
  .chat-message .flex[class*="justify-start"] .relative {
    margin-right: 0 !important;
  }

  /* 加载指示器AI头像隐藏 */
  .group.mb-6 .flex-shrink-0:has(img) {
    display: none !important;
  }

  /* 加载指示器容器调整 */
  .group.mb-6 > div {
    max-width: 98% !important;
    gap: 0 !important;
  }

  /* 加载指示器气泡调整 */
  .group.mb-6 .relative {
    margin-right: 0 !important;
  }

  /* AI消息字体大小优化 */
  .chat-message .flex[class*="justify-start"] .markdown-content {
    font-size: 0.875rem !important; /* 14px */
    line-height: 1.5 !important;
  }

  .chat-message .flex[class*="justify-start"] .markdown-content p {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
    margin-bottom: 0.75rem !important;
  }

  .chat-message .flex[class*="justify-start"] .markdown-content li {
    font-size: 0.875rem !important;
    line-height: 1.5 !important;
  }

  .chat-message .flex[class*="justify-start"] .markdown-content h1 {
    font-size: 1.25rem !important;
  }

  .chat-message .flex[class*="justify-start"] .markdown-content h2 {
    font-size: 1.125rem !important;
  }

  .chat-message .flex[class*="justify-start"] .markdown-content h3 {
    font-size: 1rem !important;
  }

  .message-container .flex {
    justify-content: flex-start !important;
  }

  .message-container .flex-wrap {
    justify-content: flex-start !important;
  }

  /* 输入框区域 */
  .input-container {
    padding: 0.75rem 1rem !important;
    position: fixed !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--chat-bg) !important;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.1) !important;
    height: 72px !important;
  }

  .input-container > div {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.75rem !important;
    height: 100% !important;
  }

  .input-container .relative {
    flex: 1 !important;
    min-width: 0 !important;
  }

  .input-container input {
    width: 100% !important;
    height: 44px !important;
    font-size: 16px !important;
    padding: 0 2.5rem 0 1rem !important;
    border-radius: 8px !important;
  }

  /* 发送按钮样式 */
  .input-container button {
    width: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
    min-width: auto !important;
    flex-shrink: 0 !important;
  }

  .input-container button svg {
    width: 20px !important;
    height: 20px !important;
  }

  /* 隐藏按钮文字 */
  .input-container button span {
    display: none !important;
  }

  /* 停止状态按钮样式 */
  .input-container button[data-state="stop"] {
    background-color: var(--error-color) !important;
  }

  .input-container button[data-state="stop"]:hover {
    background-color: var(--error-hover-color) !important;
  }

  /* 继续状态按钮样式 */
  .input-container button[data-state="continue"] {
    background-color: var(--warning-color) !important;
  }

  .input-container button[data-state="continue"]:hover {
    background-color: var(--warning-hover-color) !important;
  }

  /* Markdown 内容样式 */
  .markdown-content {
    font-size: 1rem !important;
    line-height: 1.6 !important;
    text-align: left !important;
  }

  .markdown-content p,
  .markdown-content h1,
  .markdown-content h2,
  .markdown-content h3,
  .markdown-content h4,
  .markdown-content h5,
  .markdown-content h6,
  .markdown-content ul,
  .markdown-content ol,
  .markdown-content blockquote,
  .markdown-content table {
    text-align: left !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
  }

  .markdown-content ul,
  .markdown-content ol {
    padding-left: 1.5rem !important;
  }

  .markdown-content blockquote {
    padding-left: 1rem !important;
    border-left: 4px solid var(--border-color) !important;
  }

  .markdown-content table {
    display: block !important;
    overflow-x: auto !important;
  }

  .markdown-content td,
  .markdown-content th {
    text-align: left !important;
    padding: 0.5rem !important;
  }

  .markdown-content .flex,
  .markdown-content .flex-wrap,
  .markdown-content div {
    justify-content: flex-start !important;
    text-align: left !important;
    align-items: flex-start !important;
  }

  /* 代码块样式 */
  .markdown-content pre,
  .markdown-content code {
    text-align: left !important;
    direction: ltr !important;
  }

  /* 图片容器 */
  .markdown-content .image-container {
    justify-content: flex-start !important;
    width: 100% !important;
  }

  /* 聊天记录列表样式 */
  .chat-list {
    overflow-y: auto;
    flex: 1;
    margin: 0 -1rem;
    padding: 0 1rem;
  }

  /* 聊天记录项样式 */
  .chat-list .chat-item {
    position: relative !important;
    padding-right: 2.5rem !important;
  }

  /* 删除按钮样式 */
  .chat-list .chat-item .delete-btn,
  .chat-list .chat-item:hover .delete-btn {
    position: absolute !important;
    right: 0.5rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 2rem !important;
    height: 2rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0.6 !important;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .chat-list .chat-item .delete-btn:active {
    opacity: 1 !important;
  }

  .chat-list .chat-item .delete-btn svg {
    width: 16px !important;
    height: 16px !important;
    color: var(--text-secondary) !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* 选中状态样式 */
  .chat-list .chat-item[aria-selected="true"] .delete-btn {
    opacity: 1 !important;
  }

  /* 对话气泡样式 */
  .message-container {
    position: relative !important;
  }

  .message-container > div {
    border-radius: 12px !important;
    overflow: hidden !important;
  }

  /* 模型选择器浮层 */
  .model-selector-overlay {
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0, 0, 0, 0.5) !important;
    z-index: 9999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 1rem !important;
  }

  /* 角色选择器移动端优化 */
  .role-selector-container {
    padding: 1rem !important;
    gap: 1rem !important;
  }

  .role-selector-container .role-list {
    min-height: 40vh !important;
    max-height: 50vh !important;
  }

  .role-selector-container .services-grid {
    min-height: 40vh !important;
    max-height: 50vh !important;
  }

  /* 防止移动端界面溢出 */
  body {
    overflow-x: hidden !important;
    position: relative !important;
  }

  html {
    overflow-x: hidden !important;
  }

  /* 确保容器不会超出视口 */
  .chat-container,
  .sidebar-container,
  .role-selector-container {
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }

  .model-selector-overlay[aria-hidden="true"] {
    display: none !important;
  }

  .model-selector-dialog {
    width: 100% !important;
    max-width: 480px !important;
    background: var(--chat-bg) !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2) !important;
  }

  .model-selector-dialog::before {
    content: "选择模型" !important;
    display: block !important;
    font-size: 1.125rem !important;
    font-weight: 600 !important;
    color: var(--text-primary) !important;
    padding: 1.25rem 1.25rem 0.75rem !important;
    border-bottom: 1px solid var(--border-color) !important;
  }

  .model-selector-dialog > div {
    padding: 1rem !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.75rem !important;
    max-height: calc(80vh - 4rem) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .model-selector-dialog [role="option"] {
    display: flex !important;
    align-items: center !important;
    padding: 0.75rem !important;
    background: var(--hover-color) !important;
    border-radius: 8px !important;
    cursor: pointer !important;
    transition: all 0.2s ease-out !important;
    width: 100% !important;
  }

  /* 第一层div - 包含图标和模型名称 */
  .model-selector-dialog [role="option"] > div:first-child {
    display: flex !important;
    align-items: center !important;
    min-width: 140px !important;
    flex-shrink: 0 !important;
  }

  /* SVG图标 */
  .model-selector-dialog [role="option"] > div:first-child svg {
    width: 20px !important;
    height: 20px !important;
    margin-right: 0.625rem !important;
    color: var(--primary) !important;
    flex-shrink: 0 !important;
  }

  /* 第二层div - 描述文本 */
  .model-selector-dialog [role="option"] > div:last-child {
    flex: 1 !important;
    font-size: 0.875rem !important;
    color: var(--text-secondary) !important;
    margin-left: 0.75rem !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* 选中状态样式 */
  .model-selector-dialog [role="option"][aria-selected="true"] {
    background: var(--primary) !important;
  }

  .model-selector-dialog [role="option"][aria-selected="true"] > div:first-child svg {
    color: white !important;
  }

  .model-selector-dialog [role="option"][aria-selected="true"] > div:first-child span,
  .model-selector-dialog [role="option"][aria-selected="true"] > div:last-child {
    color: white !important;
  }

  .model-selector-dialog [role="option"]:active {
    opacity: 0.9 !important;
  }

  /* 确保复制和改写按钮始终可见 */
  .message-container .copy-btn,
  .message-container .rewrite-btn {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
  }
  
  .message-container .copy-btn svg,
  .message-container .rewrite-btn svg {
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* 保持聊天记录删除按钮的原有行为 */
  .chat-list .chat-item .delete-btn {
    display: flex !important;
    visibility: visible !important;
    opacity: 0.6 !important;
  }
  
  .chat-list .chat-item .delete-btn svg {
    visibility: visible !important;
    opacity: 1 !important;
  }
} 
/* Markdown 样式修复补丁 - 优化层级结构和代码块可见性 */

/* =================
   层级结构优化
   ================= */

/* 重置所有markdown元素的基础间距 */
.markdown-content > * {
  margin-top: 0;
  margin-bottom: 0;
}

/* 段落间距优化 - 更紧凑但清晰的布局 */
.markdown-content p {
  margin-bottom: 0.8rem !important;
  line-height: 1.6 !important;
  word-break: break-word;
  overflow-wrap: break-word;
}

.markdown-content p:last-child {
  margin-bottom: 0 !important;
}

/* 标题层级间距优化 */
.markdown-content h1,
.markdown-content h2,
.markdown-content h3,
.markdown-content h4,
.markdown-content h5,
.markdown-content h6 {
  margin-top: 1.5rem !important;
  margin-bottom: 0.6rem !important;
  line-height: 1.3 !important;
  font-weight: 600 !important;
}

/* 第一个标题不需要上边距 */
.markdown-content > h1:first-child,
.markdown-content > h2:first-child,
.markdown-content > h3:first-child,
.markdown-content > h4:first-child,
.markdown-content > h5:first-child,
.markdown-content > h6:first-child {
  margin-top: 0 !important;
}

/* 标题紧跟段落的情况 */
.markdown-content p + h1,
.markdown-content p + h2,
.markdown-content p + h3,
.markdown-content p + h4,
.markdown-content p + h5,
.markdown-content p + h6 {
  margin-top: 2rem !important;
}

/* 列表层级间距优化 */
.markdown-content ul,
.markdown-content ol {
  margin-top: 0.6rem !important;
  margin-bottom: 0.8rem !important;
  padding-left: 1.5rem !important;
}

.markdown-content ul:first-child,
.markdown-content ol:first-child {
  margin-top: 0 !important;
}

.markdown-content ul:last-child,
.markdown-content ol:last-child {
  margin-bottom: 0 !important;
}

/* 列表项间距优化 */
.markdown-content li {
  margin-bottom: 0.3rem !important;
  line-height: 1.5 !important;
}

.markdown-content li:last-child {
  margin-bottom: 0 !important;
}

/* 嵌套列表优化 */
.markdown-content ul ul,
.markdown-content ol ol,
.markdown-content ul ol,
.markdown-content ol ul {
  margin-top: 0.3rem !important;
  margin-bottom: 0.3rem !important;
  padding-left: 1.2rem !important;
}

/* 列表项中的段落处理 */
.markdown-content li p {
  margin-bottom: 0.3rem !important;
  display: inline;
}

.markdown-content li p:last-child {
  margin-bottom: 0 !important;
}

/* 引用块间距优化 */
.markdown-content blockquote {
  margin-top: 0.8rem !important;
  margin-bottom: 0.8rem !important;
  padding: 0.6rem 1rem !important;
  border-left: 4px solid #3b82f6 !important;
  background-color: rgba(59, 130, 246, 0.05) !important;
  border-radius: 0 6px 6px 0 !important;
}

.markdown-content blockquote:first-child {
  margin-top: 0 !important;
}

.markdown-content blockquote:last-child {
  margin-bottom: 0 !important;
}

.markdown-content blockquote p {
  margin-bottom: 0.4rem !important;
  font-style: italic;
}

.markdown-content blockquote p:last-child {
  margin-bottom: 0 !important;
}

/* =================
   代码块可见性优化
   ================= */

/* 内联代码优化 - 提高可见性 */
.markdown-content :not(pre) > code {
  background-color: #f1f5f9 !important;
  color: #dc2626 !important;
  padding: 0.15rem 0.4rem !important;
  border-radius: 4px !important;
  font-family: 'JetBrains Mono', 'Fira Code', 'Monaco', 'Consolas', monospace !important;
  font-size: 0.85em !important;
  font-weight: 500 !important;
  border: 1px solid #e2e8f0 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05) !important;
}

/* 暗色主题下的内联代码 */
.dark .markdown-content :not(pre) > code,
[data-theme="hacker"] .markdown-content :not(pre) > code {
  background-color: #1e293b !important;
  color: #f87171 !important;
  border-color: #334155 !important;
}

[data-theme="girl"] .markdown-content :not(pre) > code {
  background-color: #fdf2f8 !important;
  color: #be185d !important;
  border-color: #f9a8d4 !important;
}

/* 代码块整体样式优化 */
.markdown-content pre {
  background-color: #0f172a !important;
  border: 1px solid #334155 !important;
  border-radius: 8px !important;
  margin: 1rem 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.markdown-content pre:first-child {
  margin-top: 0 !important;
}

.markdown-content pre:last-child {
  margin-bottom: 0 !important;
}

/* 代码块内容样式 */
.markdown-content pre code {
  display: block !important;
  padding: 1rem !important;
  color: #e2e8f0 !important;
  background: none !important;
  font-family: 'JetBrains Mono', 'Fira Code', 'Monaco', 'Consolas', monospace !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  overflow-x: auto !important;
  white-space: pre !important;
  word-break: normal !important;
  letter-spacing: 0.025em !important;
}

/* 代码高亮样式优化 - VS Code 深色主题 */
.markdown-content pre .token.comment,
.markdown-content pre .token.prolog,
.markdown-content pre .token.doctype,
.markdown-content pre .token.cdata {
  color: #6a9955 !important;
  font-style: italic;
}

.markdown-content pre .token.punctuation {
  color: #d4d4d4 !important;
}

.markdown-content pre .token.property,
.markdown-content pre .token.tag,
.markdown-content pre .token.boolean,
.markdown-content pre .token.number,
.markdown-content pre .token.constant,
.markdown-content pre .token.symbol {
  color: #b5cea8 !important;
}

.markdown-content pre .token.selector,
.markdown-content pre .token.attr-name,
.markdown-content pre .token.string,
.markdown-content pre .token.char,
.markdown-content pre .token.builtin {
  color: #ce9178 !important;
}

.markdown-content pre .token.operator,
.markdown-content pre .token.entity,
.markdown-content pre .token.url,
.markdown-content pre .token.variable {
  color: #d4d4d4 !important;
}

.markdown-content pre .token.atrule,
.markdown-content pre .token.attr-value,
.markdown-content pre .token.keyword {
  color: #569cd6 !important;
  font-weight: 500;
}

.markdown-content pre .token.function,
.markdown-content pre .token.class-name {
  color: #dcdcaa !important;
}

.markdown-content pre .token.regex,
.markdown-content pre .token.important {
  color: #d16969 !important;
}

.markdown-content pre .token.important,
.markdown-content pre .token.bold {
  font-weight: bold;
}

.markdown-content pre .token.italic {
  font-style: italic;
}

/* 代码块复制按钮容器样式优化 */
.markdown-content .group\/code {
  position: relative;
  margin: 1rem 0 !important;
}

.markdown-content .group\/code:first-child {
  margin-top: 0 !important;
}

.markdown-content .group\/code:last-child {
  margin-bottom: 0 !important;
}

/* 代码块头部样式 */
.markdown-content .group\/code > span:first-child {
  background-color: #1e293b !important;
  color: #94a3b8 !important;
  padding: 0.5rem 1rem !important;
  font-size: 0.75rem !important;
  font-weight: 500 !important;
  border-bottom: 1px solid #334155 !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  border-radius: 8px 8px 0 0 !important;
}

/* 代码块头部按钮样式 */
.markdown-content .group\/code button {
  background-color: #334155 !important;
  color: #e2e8f0 !important;
  border: 1px solid #475569 !important;
  padding: 0.25rem 0.5rem !important;
  border-radius: 4px !important;
  font-size: 0.75rem !important;
  transition: all 0.2s ease !important;
}

.markdown-content .group\/code button:hover {
  background-color: #475569 !important;
  color: #f8fafc !important;
}

/* 表格样式优化 */
.markdown-content table {
  margin: 1rem 0 !important;
  border-collapse: collapse !important;
  width: 100% !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  border: 1px solid #e2e8f0 !important;
}

.markdown-content table:first-child {
  margin-top: 0 !important;
}

.markdown-content table:last-child {
  margin-bottom: 0 !important;
}

.markdown-content table th,
.markdown-content table td {
  padding: 0.6rem 0.8rem !important;
  border: 1px solid #e2e8f0 !important;
  text-align: left !important;
}

.markdown-content table th {
  background-color: #f8fafc !important;
  font-weight: 600 !important;
  color: #374151 !important;
}

/* 暗色主题下的表格 */
.dark .markdown-content table,
[data-theme="hacker"] .markdown-content table {
  border-color: #374151 !important;
}

.dark .markdown-content table th,
.dark .markdown-content table td,
[data-theme="hacker"] .markdown-content table th,
[data-theme="hacker"] .markdown-content table td {
  border-color: #374151 !important;
}

.dark .markdown-content table th,
[data-theme="hacker"] .markdown-content table th {
  background-color: #1f2937 !important;
  color: #f3f4f6 !important;
}

/* 分割线优化 */
.markdown-content hr {
  margin: 1.5rem 0 !important;
  border: none !important;
  border-top: 2px solid #e2e8f0 !important;
  opacity: 0.6 !important;
}

.markdown-content hr:first-child {
  margin-top: 0 !important;
}

.markdown-content hr:last-child {
  margin-bottom: 0 !important;
}

/* 图片样式优化 */
.markdown-content img {
  margin: 1rem 0 !important;
  border-radius: 6px !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
  max-width: 100% !important;
  height: auto !important;
}

.markdown-content img:first-child {
  margin-top: 0 !important;
}

.markdown-content img:last-child {
  margin-bottom: 0 !important;
}

/* 链接样式优化 */
.markdown-content a {
  color: #3b82f6 !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 2px !important;
  transition: all 0.2s ease !important;
}

.markdown-content a:hover {
  color: #2563eb !important;
  text-decoration-thickness: 2px !important;
}

/* 主题特定的链接颜色 */
[data-theme="hacker"] .markdown-content a {
  color: #60a5fa !important;
}

[data-theme="hacker"] .markdown-content a:hover {
  color: #93c5fd !important;
}

[data-theme="girl"] .markdown-content a {
  color: #ec4899 !important;
}

[data-theme="girl"] .markdown-content a:hover {
  color: #db2777 !important;
}

/* 强调文本优化 */
.markdown-content strong {
  font-weight: 600 !important;
  color: inherit !important;
}

.markdown-content em {
  font-style: italic !important;
  color: inherit !important;
}

/* 修复流式渲染时的间距问题 */
.streaming-markdown-container > * {
  margin-top: 0 !important;
}

.streaming-markdown-container > *:not(:last-child) {
  margin-bottom: 0.8rem !important;
}

.streaming-markdown-container > *:last-child {
  margin-bottom: 0 !important;
}

/* 响应式优化 */
@media (max-width: 768px) {
  .markdown-content {
    font-size: 14px !important;
  }

  .markdown-content h1 {
    font-size: 1.4rem !important;
  }

  .markdown-content h2 {
    font-size: 1.2rem !important;
  }

  .markdown-content h3 {
    font-size: 1.1rem !important;
  }

  .markdown-content ul,
  .markdown-content ol {
    padding-left: 1.2rem !important;
  }

  .markdown-content pre code {
    font-size: 0.8rem !important;
    padding: 0.8rem !important;
  }

  .markdown-content blockquote {
    padding: 0.5rem 0.8rem !important;
    margin: 0.6rem 0 !important;
  }
}