/* scrollbar */
figure.shiki div.codeblock::-webkit-scrollbar-thumb {
  background: var(--hlscrollbar-bg);
  border-radius: 2.5px;
}
figure.shiki div.codeblock::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

/* code block figure */
figure.shiki .shiki-tools.closed ~ .codeblock {
  display: none;
}

figure.shiki {
  margin: 16px 0px;
  border-radius: 12px !important;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  position: relative;
  overflow: hidden; /* 改回hidden，确保圆角外内容被裁剪 */
  padding: 0;
  background: var(--hl-code-bg, #f8f9fa);
  color: var(--hl-code-fg, #24292e);
  line-height: 1.5;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed);
}

/* 当有展开按钮包装器时，figure应该移除自己的边框样式，让包装器处理 */
figure.shiki:has(.code-block-wrapper) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  border-radius: 0 !important;
  margin: 16px 0 !important;
  padding: 0 !important;
}

/* 当有展开按钮包装器时，确保工具栏也使用正确的边框样式 */
figure.shiki:has(.code-block-wrapper) .shiki-tools {
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed) !important;
  border-bottom: 1px solid var(--anzhiyu-card-border, #e1e8ed) !important;
  border-radius: 12px 12px 0 0 !important;
  background: var(--anzhiyu-background, #f6f8fa) !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 2 !important;
}

/* 展开按钮包装器处理代码块和按钮的整体边框 */
figure.shiki .code-block-wrapper {
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed) !important;
  border-top: none !important; /* 顶部无边框，与工具栏连接 */
  background: var(--hl-code-bg, #f8f9fa) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
  margin: -1px 0 0 0 !important; /* 与工具栏无缝连接 */
  padding: 0 !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 0 0 12px 12px !important; /* 默认底部圆角 */
}

/* 当工具栏关闭时，包装器也应该隐藏并保持正确的样式 */
figure.shiki .shiki-tools.closed ~ .code-block-wrapper {
  display: none !important;
}

/* 收起状态下，包装器需要为展开按钮的绝对定位提供空间 */
figure.shiki .code-block-wrapper.collapsed {
  border-radius: 0 0 12px 12px !important; /* 收起状态：完整底部圆角 */
  overflow: hidden !important;
}

/* 展开状态下，包装器不需要包含展开按钮（按钮被移出） */
figure.shiki .code-block-wrapper.expanded {
  border-radius: 0 0 0 0 !important; /* 展开状态：无底部圆角，与按钮完美对齐 */
  overflow: visible !important;
}

/* 确保在工具栏关闭时，工具栏自己承担所有样式 */
figure.shiki .shiki-tools.closed {
  border-bottom: none;
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed);
  background: var(--anzhiyu-background, #f6f8fa);
}

/* 收起状态的figure样式调整，消除留白 */
figure.shiki:has(.shiki-tools.closed) {
  margin: 4px 0 !important; /* 减小上下边距，只保留工具栏的间距 */
  min-height: fit-content !important;
}

/* 兼容不支持:has()的浏览器 */
figure.shiki .shiki-tools.closed {
  margin-bottom: 0;
}

/* 当工具栏关闭时，隐藏所有相关内容，彻底消除留白 */
figure.shiki .shiki-tools.closed ~ .codeblock,
figure.shiki .shiki-tools.closed ~ .code-block-wrapper {
  display: none !important;
}

figure.shiki .shiki-tools.closed ~ .code-expand-btn,
figure.shiki .shiki-tools.closed ~ * .code-expand-btn {
  display: none !important;
}

/* 支持现代浏览器的样式优化 */
@supports selector(:has(.shiki-tools.closed)) {
  figure.shiki:has(.shiki-tools.closed) {
    background: var(--anzhiyu-background, #f6f8fa) !important;
    border: 1px solid var(--anzhiyu-card-border, #e1e8ed) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important;
    margin: 16px 0 !important; /* 保持与展开时相同的边距 */
    min-height: fit-content !important;
    overflow: hidden !important;
    border-radius: 12px !important; /* 确保收起后仍然有圆角 */
  }

  figure.shiki:has(.shiki-tools.closed) .shiki-tools.closed {
    margin: 0 !important;
    border-bottom: none !important;
    border-radius: 12px !important; /* 工具栏应该有完整的圆角 */
  }

  /* 确保带展开按钮的代码块收起后也隐藏包装器 */
  figure.shiki:has(.shiki-tools.closed) .code-block-wrapper {
    display: none !important;
  }

  /* 确保收起后隐藏所有展开按钮 */
  figure.shiki:has(.shiki-tools.closed) .code-expand-btn {
    display: none !important;
  }
}

.shiki-tools {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 4px 16px;
  overflow: hidden;
  min-height: 32px;
  background: var(--anzhiyu-background, #f6f8fa);
  color: var(--anzhiyu-fontcolor, #1e293b);
  font-size: 0.85em;
  user-select: none;
  border-bottom: 1px solid var(--anzhiyu-card-border, #e1e8ed);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
}

/* 左对齐部分 */
.shiki-tools .left {
  display: flex;
  align-items: center;
  gap: 6px; /* 左对齐元素之间的间隔 */
  flex-shrink: 0; /* 禁止缩小 */
  min-width: 0; /* 允许收缩 */
}

/* macOS 风格交通灯按钮 */
.traffic-lights {
  display: flex;
  gap: 6px;
  align-items: center;
}

.traffic-light {
  width: 13px;
  height: 13px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  box-shadow:
    0 1px 3px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.3);
}

.traffic-light:hover {
  transform: scale(1.08);
  box-shadow:
    0 4px 8px rgba(0, 0, 0, 0.15),
    inset 0 1px 0 rgba(255, 255, 255, 0.4);
}

.traffic-light:active {
  transform: scale(0.95);
  box-shadow:
    0 1px 2px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.traffic-light.red {
  background: radial-gradient(circle at 30% 30%, #ff6b6b, #ff5252, #f44336);
  border: 1px solid #d32f2f;
}

.traffic-light.yellow {
  background: radial-gradient(circle at 30% 30%, #ffd93d, #ffcd38, #ffc107);
  border: 1px solid #f57c00;
}

.traffic-light.green {
  background: radial-gradient(circle at 30% 30%, #6bcf7f, #4caf50, #00c853);
  border: 1px solid #388e3c;
}

.traffic-light i {
  font-size: 6px;
  color: rgba(255, 255, 255, 0.9);
  display: none;
  text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 红色按钮的图标特殊处理 */
.traffic-light.red i {
  font-size: 8px;
}

/* 绿色按钮的图标特殊处理 */
.traffic-light.green i {
  font-size: 8px;
  transform: rotate(90deg);
}

.traffic-light:hover i {
  display: block;
  animation: iconPulse 0.3s ease-out;
  color: #1d1d1f;
}

/* 当hover到traffic-lights容器时，所有按钮都显示图标 */
.traffic-lights:hover .traffic-light i {
  display: block;
  animation: iconPulse 0.3s ease-out;
  color: #1d1d1f;
}

/* 绿色按钮hover时不应用动画 */
.traffic-lights:hover .traffic-light.green i {
  animation: none;
}

@keyframes iconPulse {
  0% {
    transform: scale(0.8) rotate(0deg);
    opacity: 0;
  }
  50% {
    transform: scale(1.1) rotate(0deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
    opacity: 1;
  }
}

/* 居中部分 - 绝对居中 */
.shiki-tools .center {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  max-width: 60%; /* 限制最大宽度，避免与两侧重叠 */
  white-space: nowrap;
}

/* 右对齐部分 */
.shiki-tools .right {
  display: flex;
  align-items: center;
  gap: 8px; /* 右对齐元素之间的间隔 */
  flex-shrink: 0; /* 禁止缩小 */
}

/* 复制按钮样式 */
.shiki-tools .copy-button {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  background: var(--anzhiyu-background, #f8f9fa);
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
  position: relative;
  overflow: hidden;
}

.shiki-tools .copy-button:hover {
  background: var(--anzhiyu-main, #49b1f5);
  border-color: var(--anzhiyu-main, #49b1f5);
  box-shadow: 0 2px 8px rgba(73, 177, 245, 0.3);
}

.shiki-tools .copy-button:active {
  transform: scale(0.98);
}

/* 复制按钮状态样式 */
.shiki-tools .copy-button.success {
  background: linear-gradient(
    135deg,
    rgba(52, 199, 89, 0.15),
    rgba(34, 197, 94, 0.15)
  );
  border-color: rgba(34, 197, 94, 0.4);
  animation: successPulse 0.6s ease-out;
}

.shiki-tools .copy-button.success i {
  color: #16a34a;
  animation: checkmarkAnimation 0.6s ease-out;
}

/* 确保成功状态时hover不覆盖样式 */
.shiki-tools .copy-button.success:hover {
  background: linear-gradient(
    135deg,
    rgba(52, 199, 89, 0.15),
    rgba(34, 197, 94, 0.15)
  );
  border-color: rgba(34, 197, 94, 0.4);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.shiki-tools .copy-button.success:hover i {
  color: #16a34a;
}

.shiki-tools .copy-button.error {
  background: linear-gradient(
    135deg,
    rgba(239, 68, 68, 0.15),
    rgba(220, 38, 38, 0.15)
  );
  border-color: rgba(239, 68, 68, 0.4);
  animation: errorShake 0.6s ease-out;
}

.shiki-tools .copy-button.error i {
  color: #dc2626;
  animation: errorIconAnimation 0.6s ease-out;
}

/* 确保错误状态时hover不覆盖样式 */
.shiki-tools .copy-button.error:hover {
  background: linear-gradient(
    135deg,
    rgba(239, 68, 68, 0.15),
    rgba(220, 38, 38, 0.15)
  );
  border-color: rgba(239, 68, 68, 0.4);
  box-shadow:
    0 2px 4px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.shiki-tools .copy-button.error:hover i {
  color: #dc2626;
}

.shiki-tools .copy-button i {
  font-size: 12px;
  color: var(--anzhiyu-fontcolor, #6b7280);
  transition: all 0.3s ease;
}

.shiki-tools .copy-button:hover i {
  color: #fff;
}

@keyframes successPulse {
  0% {
    box-shadow: 0 0 0 0 rgba(52, 199, 89, 0.4);
  }
  70% {
    box-shadow: 0 0 0 10px rgba(52, 199, 89, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(52, 199, 89, 0);
  }
}

@keyframes checkmarkAnimation {
  0% {
    transform: scale(0.8) rotate(0deg);
  }
  50% {
    transform: scale(1.2) rotate(10deg);
  }
  100% {
    transform: scale(1) rotate(0deg);
  }
}

@keyframes errorShake {
  0%,
  100% {
    transform: translateX(0);
  }
  25% {
    transform: translateX(-4px);
  }
  75% {
    transform: translateX(4px);
  }
}

@keyframes errorIconAnimation {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  50% {
    transform: scale(1.2);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}

/* 语言标签样式 - 适配anzhiyu主题 */
.shiki-tools .code-lang {
  padding: 3px 8px;
  font-weight: 500;
  font-size: var(--code-font-size, 12px);
  user-select: none;
  color: var(--anzhiyu-fontcolor, #1e293b);
  white-space: nowrap;
  margin-left: 0px;
  margin-right: 8px;
  cursor: pointer;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
  border-radius: 4px;
  background-color: var(--anzhiyu-background, #f6f8fa);
  border: none;
}

/* 语言标签hover效果 */
.shiki-tools .code-lang:hover {
  background-color: var(--anzhiyu-main, #49b1f5);
  color: #fff;
  border-color: var(--anzhiyu-main, #49b1f5);
}

/* 标题样式 - 增大字体版 */
.shiki-tools .code-title {
  font-size: 0.95em;
  font-weight: 600;
  color: #1e293b;
  user-select: text;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 1;
  padding: 0 12px;
  line-height: 1.3;
  text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
}

/* 展开按钮容器 - 包裹代码块和按钮 */
.code-block-wrapper {
  position: relative !important; /* 必须保持相对定位以支持展开按钮的绝对定位 */
  margin: 0 !important; /* 移除负边距，确保正常布局 */
  background: transparent !important; /* 移除背景，使用父容器的背景 */
  overflow: visible !important; /* 改为visible，让绝对定位的按钮能够显示 */
  border-radius: inherit !important; /* 继承父容器的圆角设置 */
}

/* 确保包装器的代码块继承圆角和背景 */
.code-block-wrapper .codeblock {
  background: transparent !important; /* 透明背景 */
  border-radius: inherit !important; /* 继承包装器的圆角 */
}

/* 包装器中的pre元素需要提供背景 */
.code-block-wrapper pre {
  background: var(--hl-code-bg, #f8f9fa) !important;
  border-radius: inherit !important;
  margin: 0 !important;
  position: relative !important;
  z-index: 1 !important;
}

/* 代码块容器 - 收起状态 */
.code-block-wrapper.collapsed .codeblock {
  overflow: hidden !important; /* 隐藏超出部分，避免在收起状态出现滚动条 */
  height: var(--highlight-height-limit, 200px) !important;
  max-height: var(--highlight-height-limit, 200px) !important;
  position: relative !important; /* 为展开按钮提供定位上下文 */
  padding-bottom: 0 !important; /* 不需要padding，按钮是绝对定位相对于包装器 */
  border-radius: 0 0 12px 12px !important; /* 收起状态：完整底部圆角 */
  margin: 0 !important;
}

/* 代码块容器 - 展开状态 */
.code-block-wrapper.expanded .codeblock {
  overflow: auto !important; /* 在展开状态允许水平滚动 */
  overflow-x: auto !important; /* 水平滚动 */
  overflow-y: hidden !important; /* 防止垂直滚动条 */
  height: auto !important;
  max-height: none !important;
  margin-bottom: 0 !important; /* 移除负边距，确保与展开按钮正确分离 */
  position: relative !important; /* 保持相对定位 */
  padding-bottom: 0 !important; /* 展开状态下不需要底部padding */
  border-radius: 0 0 0 0 !important; /* 展开状态：无底部圆角，与按钮完美对齐 */
  z-index: 1 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* 展开按钮 - 收起时覆盖在代码块底部 */
.code-expand-btn {
  position: absolute !important; /* 使用绝对定位，便于控制覆盖和分离 */
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 30px !important; /* 增加高度从40px到48px，提供更多交互空间 */
  background: linear-gradient(
    to bottom,
    rgba(248, 249, 250, 0) 0%,
    rgba(248, 249, 250, 0.4) 10%,
    rgba(248, 249, 250, 0.65) 30%,
    rgba(248, 249, 250, 0.8) 50%,
    rgba(248, 249, 250, 0.9) 70%,
    rgba(248, 249, 250, 0.9) 85%,
    rgba(248, 249, 250, 1) 100%
  ) !important;
  border-radius: 0 0 12px 12px !important; /* 收起状态：完整底部圆角 */
  text-align: center !important;
  font-size: 0.85em !important;
  cursor: pointer !important;
  border: none !important;
  backdrop-filter: none !important; /* 完全禁用模糊效果 */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  z-index: 10 !important; /* 确保在代码块之上显示 */
  margin: 0 !important;
  box-shadow: none !important;
}

/* 展开状态下，按钮被移出包装器，显示在代码块下方 */
.code-expand-btn.expanded {
  position: relative !important; /* 使用相对定位，作为正常流式元素 */
  bottom: auto !important;
  left: auto !important;
  margin: -1px 0 0 0 !important; /* 与代码块无缝连接 */
  background: var(--anzhiyu-background, #f6f8fa) !important;
  border: 1px solid var(--anzhiyu-card-border, #e1e8ed) !important; /* 完整边框 */
  border-top: none !important; /* 顶部无边框，与代码块连接 */
  border-radius: 0 0 12px 12px !important; /* 展开状态：只有底部圆角，顶部直角 */
  z-index: auto !important; /* 重置z-index */
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08) !important; /* 与包装器一致的阴影 */
  height: 30px !important; /* 与收起状态一致的高度 */
}

/* 展开按钮在figure元素内的样式（当被移出包装器时） */
figure.shiki > .code-expand-btn.expanded {
  display: block !important; /* 确保作为块级元素显示 */
  width: 100% !important;
  margin: -1px 0 0 0 !important; /* 确保与上方元素无缝连接 */
  position: relative !important;
}

@keyframes expandButtonPulse {
  0% {
    opacity: 0.7;
  }
  50% {
    opacity: 0.4;
  }
  100% {
    opacity: 0.7;
  }
}

.code-expand-btn i {
  display: inline-block;
  padding: 10px 0;
  color: #6b7280;
  font-size: 14px;
}

.code-expand-btn:hover i {
  color: #374151;
}

/* 展开状态下的hover效果 */
.code-expand-btn.expanded:hover {
  background: var(--anzhiyu-main, #49b1f5) !important;
  color: #fff;
  transition: none !important;
}

.code-expand-btn.expanded i {
  transform: rotate(180deg);
  color: #374151;
}

.code-expand-btn.expanded:hover i {
  color: #fff;
}

/* 收起状态的hover效果 */
.code-expand-btn:not(.expanded):hover {
  background: var(--anzhiyu-main, #49b1f5) !important;
  color: #fff;
  transition: none !important;
}

/* codeblock */
figure.shiki div.codeblock {
  margin: 0 !important;
  display: flex !important;
  overflow: auto !important;
  overflow-x: auto !important; /* 水平滚动，垂直不滚动 */
  overflow-y: hidden !important; /* 防止垂直滚动条 */
  border: none !important;
  border-radius: inherit !important; /* 继承父容器圆角 */
  background: transparent !important; /* 透明背景，使用父容器背景 */
  padding-bottom: 0 !important;
  position: relative !important; /* 为展开按钮提供定位上下文 */
  min-height: fit-content !important; /* 确保内容高度正确 */
  width: 100% !important;
  max-width: 100% !important;
}

/* 确保pre元素不会溢出圆角 */
figure.shiki div.codeblock pre {
  background: var(--hl-code-bg, #f8f9fa) !important; /* pre元素提供背景 */
  margin: 0 !important;
  border-radius: inherit !important; /* 继承圆角 */
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important; /* pre内容不应该被裁剪，让父容器处理滚动 */
  width: auto !important; /* 让pre根据内容自动调整宽度 */
  min-width: 100% !important; /* 最小宽度为容器宽度 */
  flex: 1 !important; /* 让pre占据可用空间 */
}

/* 展开状态下，pre元素也应该没有底部圆角 */
figure.shiki .code-block-wrapper.expanded .codeblock pre {
  border-radius: inherit !important; /* 继承父级的无圆角设置 */
}

/* 强制移除所有可能影响代码块背景的内联样式 */
figure.shiki [style],
figure.shiki * [style] {
  background-color: transparent !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* 确保代码块内所有元素都使用透明背景 */
figure.shiki pre *,
figure.shiki code *,
figure.shiki .code * {
  background-color: transparent !important;
  background: transparent !important;
  background-image: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
}

/* 当有展开按钮且为收起状态时，确保代码块与包装器圆角一致 */
figure.shiki .code-block-wrapper.collapsed .codeblock {
  border-radius: 0 0 12px 12px !important; /* 收起状态：明确设置完整底部圆角 */
}

/* 没有包装器的代码块（旧实现）应该保持底部圆角 */
figure.shiki > .codeblock:not(.code-block-wrapper .codeblock) {
  border-radius: 0 0 12px 12px !important;
}

figure.shiki div.codeblock div {
  padding: 0;
  border: none;
}

figure.shiki .gutter pre {
  border-right: none !important;
  border-radius: inherit !important; /* 继承圆角 */
  padding-right: 12px !important;
  padding-left: 12px !important;
  margin-right: 0 !important;
  background-color: var(
    --hl-code-bg,
    #f8f8fa
  ) !important; /* 稍微不同的背景色 */
  color: var(#6e7681) !important;
  text-align: right !important;
  user-select: none !important;
  font-size: var(--code-font-size, 14px);
  line-height: 1.5;
}

figure.shiki pre {
  font-size: var(--code-font-size, 14px) !important;
  margin: 0 !important;
  padding: 6px 20px !important; /* 增加上下内边距 */
  border: none !important;
  border-radius: inherit !important; /* 继承父容器圆角 */
  line-height: 1.5 !important;
  background: var(--hl-code-bg, #f8f9fa) !important; /* 确保有背景 */
  overflow: visible !important; /* pre内容不应该被裁剪 */
  width: auto !important; /* 让pre根据内容自动调整宽度 */
  min-width: 100% !important; /* 最小宽度为容器宽度 */
  white-space: pre !important; /* 保持代码格式，不换行 */
  word-wrap: normal !important; /* 禁止自动换行 */
  overflow-wrap: normal !important; /* 禁止自动换行 */
}

figure.shiki pre code {
  background: none !important;
  background-color: transparent !important;
  padding: 0 !important;
  font-size: var(--code-font-size, 14px) !important;
  line-height: 1.5 !important;
  text-indent: 0 !important;
  margin-left: 0 !important;
  transform: none !important;
  box-shadow: none !important;
  border: none !important;
  white-space: inherit !important; /* 继承pre的white-space设置 */
  word-wrap: inherit !important; /* 继承pre的换行设置 */
  overflow-wrap: inherit !important; /* 继承pre的换行设置 */
  display: block !important;
  width: auto !important;
  min-width: 100% !important;
}

/* 强制移除所有代码元素的内联背景样式 */
figure.shiki pre code *,
figure.shiki .code pre *,
figure.shiki .code * {
  background: none !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border: none !important;
  text-shadow: none !important;
}

/* 移除所有可能产生背景的样式 */
figure.shiki [style*="background"] {
  background: transparent !important;
  background-color: transparent !important;
}

/* 强制确保所有代码块元素的圆角一致性 - 排除文本内容元素 */
figure.shiki .codeblock,
figure.shiki pre,
figure.shiki code {
  border-radius: inherit !important;
}

/* 只对结构性元素应用圆角继承，明确排除所有文本内容 */
figure.shiki .codeblock > div:not(.code):not(.gutter),
figure.shiki .codeblock > pre {
  border-radius: inherit !important;
}

/* 明确排除所有文本内容元素的圆角继承 */
figure.shiki .codeblock *,
figure.shiki pre *,
figure.shiki code *,
figure.shiki .code *,
figure.shiki .gutter *,
figure.shiki .line *,
figure.shiki span *,
figure.shiki span * * {
  border-radius: 0 !important;
}

/* 收起状态下的特殊圆角处理 */
figure.shiki .code-block-wrapper.collapsed .codeblock {
  border-radius: 0 0 12px 12px !important; /* 收起状态：完整底部圆角 */
}

figure.shiki .code-block-wrapper.collapsed .codeblock pre {
  border-radius: 0 0 12px 12px !important; /* 收起状态：明确设置完整底部圆角 */
}

/* 展开状态下的特殊圆角处理 */
figure.shiki .code-block-wrapper.expanded,
figure.shiki .code-block-wrapper.expanded .codeblock,
figure.shiki .code-block-wrapper.expanded .codeblock pre {
  border-radius: 0 !important; /* 展开状态下没有底部圆角 */
}

/* 展开按钮的圆角不继承父级，保持自己的设置 */
figure.shiki .code-expand-btn,
figure.shiki > .code-expand-btn {
  border-radius: 0 0 12px 12px !important;
}

/* 工具栏关闭时，自己承担完整的圆角 */
figure.shiki .shiki-tools.closed {
  border-radius: 12px !important;
}

/* 确保代码内容不会溢出容器 */
figure.shiki .code,
figure.shiki .code *,
figure.shiki .gutter,
figure.shiki .gutter *,
figure.shiki pre *,
figure.shiki code *,
figure.shiki .codeblock * {
  overflow-x: visible !important;
  white-space: pre !important;
  word-wrap: normal !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
}

/* 修复文本选择圆角问题 - 使用最精确的选择器，只影响代码内容区域 */
figure.shiki .codeblock .code span::selection,
figure.shiki .codeblock .code span *::selection,
figure.shiki .codeblock pre span::selection,
figure.shiki .codeblock pre span *::selection,
figure.shiki .codeblock .line span::selection,
figure.shiki .codeblock .line span *::selection {
  background: var(--anzhiyu-selection-bg, #3b82f6) !important;
  color: var(--anzhiyu-selection-color, #ffffff) !important;
  text-shadow: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-decoration-break: clone !important;
  -webkit-box-decoration-break: clone !important;
}

/* Firefox 特殊处理 */
figure.shiki .codeblock .code span::-moz-selection,
figure.shiki .codeblock .code span *::-moz-selection,
figure.shiki .codeblock pre span::-moz-selection,
figure.shiki .codeblock pre span *::-moz-selection,
figure.shiki .codeblock .line span::-moz-selection,
figure.shiki .codeblock .line span *::-moz-selection {
  background: var(--anzhiyu-selection-bg, #3b82f6) !important;
  color: var(--anzhiyu-selection-color, #ffffff) !important;
  text-shadow: none !important;
  border-radius: 0 !important;
  outline: none !important;
  box-decoration-break: clone !important;
  -webkit-box-decoration-break: clone !important;
}

/* 专门处理行号和代码内容的布局 */
figure.shiki .gutter {
  flex-shrink: 0 !important;
  min-width: fit-content !important;
}

figure.shiki .code {
  flex: 1 !important;
  min-width: 0 !important; /* 允许收缩但不换行 */
  overflow-x: visible !important;
}

figure.shiki .codeblock pre * {
  font-size: var(--code-font-size, 14px);
  font-family: var(
    --code-font-family,
    'Consolas, "Fira Code", "Fira Mono", Menlo, "DejaVu Sans Mono", monospace, 宋体'
  );
  overflow: auto !important;
  line-height: 1.5;
}

figure.shiki .code pre {
  padding-right: 20px !important;
  padding-left: 0px !important;
  width: 100% !important;
  background: none !important;
  line-height: 1.5;
}

/* 全屏模式样式 */
figure.shiki.code-fullpage {
  background: var(--hl-bg);
  color: var(--hl-color);
  border-radius: 0 !important;
}

figure.shiki.code-fullpage .shiki-tools {
  border-radius: 0 !important;
}

/* 退出全屏按钮 */
.exit-fullpage-button {
  position: fixed;
  top: 70px;
  right: 20px;
  z-index: 10000;
  cursor: pointer;
  background: rgba(240, 240, 240, 0.95);
  color: #333;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.exit-fullpage-button:hover {
  background: rgba(225, 225, 225, 1);
  transform: scale(1.05);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

.exit-fullpage-button i {
  font-size: 16px;
}