/* 代码块语法高亮配色（配合 highlight.js 输出的 .hljs-* 类名）
   站点代码块底色为深色，故采用深色调色板，保证各类 token 对比度。 */

/* 只写单类选择器：若写成 .post-article pre code 这类后代选择器，
   特异性会高于 .hljs-string 等 token 类，关键字/字符串的颜色会被压掉 */
.hljs {
  color: #d9e5ff;
}

/* 注释 */
.hljs-comment,
.hljs-quote {
  color: #7189b0;
  font-style: italic;
}

/* 关键字 */
.hljs-keyword,
.hljs-selector-tag,
.hljs-literal,
.hljs-doctag,
.hljs-formula {
  color: #c792ea;
}

/* 字符串 */
.hljs-string,
.hljs-regexp,
.hljs-addition,
.hljs-attribute,
.hljs-meta .hljs-string {
  color: #7ee2a8;
}

/* 数字 / 变量 / 类型 */
.hljs-number,
.hljs-variable,
.hljs-template-variable,
.hljs-type,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
  color: #ffcb6b;
}

/* 函数名 / 标签名 / 章节 */
.hljs-title,
.hljs-section,
.hljs-name,
.hljs-selector-id {
  color: #82aaff;
}

/* 内置对象 / 属性 / 符号 */
.hljs-attr,
.hljs-built_in,
.hljs-symbol,
.hljs-bullet,
.hljs-link,
.hljs-meta {
  color: #89ddff;
}

.hljs-deletion {
  color: #ff9a9a;
}

.hljs-emphasis {
  font-style: italic;
}

.hljs-strong {
  font-weight: 600;
}

/* 代码块外层：承载右上角工具条（pre 自身横向滚动，工具条不能放进去） */
.code-block {
  position: relative;
}

/* 顶部留出工具条的位置，否则会压住第一行代码 */
.code-block pre {
  padding-top: 36px;
}

.code-bar {
  position: absolute;
  top: 6px;
  right: 8px;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 6px;
}

.code-lang {
  padding: 1px 9px;
  border-radius: 999px;
  font-family: "SFMono-Regular", Consolas, Menlo, "Courier New", monospace;
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #a9c0e8;
  background: rgba(6, 11, 22, .72);
  border: 1px solid rgba(255, 255, 255, .1);
  opacity: .75;
  pointer-events: none;
  user-select: none;
}

.code-block:hover .code-lang {
  opacity: 1;
}

/* 复制按钮 */
.code-copy {
  min-width: 52px;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, .14);
  background: rgba(30, 45, 80, .82);
  color: #cfdcf5;
  font-family: inherit;
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: .04em;
  cursor: pointer;
  opacity: .5;
  transition: opacity .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
}

.code-block:hover .code-copy,
.code-copy:focus-visible {
  opacity: 1;
}

.code-copy:hover {
  background: #e17938;
  border-color: #e17938;
  color: #fff;
}

.code-copy:active {
  transform: translateY(1px);
}

.code-copy.is-ok,
.code-copy.is-ok:hover {
  background: rgba(126, 226, 168, .16);
  border-color: rgba(126, 226, 168, .5);
  color: #7ee2a8;
  opacity: 1;
}

.code-copy.is-fail,
.code-copy.is-fail:hover {
  background: rgba(255, 154, 154, .16);
  border-color: rgba(255, 154, 154, .5);
  color: #ff9a9a;
  opacity: 1;
}

/* 触摸屏没有 hover，按钮常显 */
@media (hover: none) {
  .code-copy {
    opacity: 1;
  }
}

/* 窄屏：工具条与语言标签收小，避免挤压 */
@media (max-width: 640px) {
  .code-bar {
    top: 4px;
    right: 6px;
    gap: 4px;
  }
  .code-lang {
    padding: 1px 7px;
    font-size: 10px;
  }
  .code-copy {
    min-width: 46px;
    padding: 2px 8px;
    font-size: 10px;
  }
}
