/**
 * Prism.js Theme: Visual Studio Code (Light+)
 * 特点：色彩丰富，语义区分明显，适合长时间阅读
 * 包含：右上角语言标签 + 左上角复制按钮
 */

/* =========================================
   1. 基础排版 (字号、间距)
   ========================================= */
code[class*="language-"],
pre[class*="language-"] {
    color: #333333; /* 主体文字颜色 */
    font-family: "Consolas", "Monaco", "Courier New", monospace;
    direction: ltr;
    text-align: left;
    white-space: pre;
    word-spacing: normal;
    word-break: normal;
    
    /* 优化阅读体验的字号 */
    font-size: 13.5px; 
    line-height: 1.3;
    
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-hyphens: none;
    -moz-hyphens: none;
    -ms-hyphens: none;
    hyphens: none;
}

/* 代码块容器 */
pre[class*="language-"] {
    padding: 16px 20px;
    margin: 1em 0;
    overflow: auto;
    border: 1px solid #e1e4e8; /* 更柔和的边框 */
    border-radius: 6px;        /* 圆角 */
    background-color: #ffffff;
    
    /* 关键：设置为相对定位，为了让标签绝对定位 */
    position: relative; 
}

/* 内联代码 (文章中间的 `code`) */
:not(pre) > code[class*="language-"] {
    padding: 2px 6px;
    background-color: #f6f8fa;
    border-radius: 4px;
    color: #476582;
}

/* =========================================
   2. 现代 VS Code Light+ 配色方案 (核心修改)
   ========================================= */

/* 注释：绿色 */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
    color: #008000;
    font-style: italic;
}

/* 标点符号：深灰 */
.token.punctuation {
    color: #333333;
}

/* 属性/变量：默认黑色，特定环境下变色 */
.token.namespace {
    opacity: .7;
}

/* 字符串：砖红色 */
.token.string,
.token.attr-value {
    color: #a31515;
}

/* 数字、布尔值：薄荷绿/深绿 */
.token.number,
.token.boolean {
    color: #098658;
}

/* 关键字 (int, return, if)：蓝色 */
.token.keyword,
.token.tag {
    color: #0000ff;
}

/* 类名、接口、类型 (如 vector, string)：青色/蓝绿色 */
.token.class-name,
.token.constant,
.token.symbol {
    color: #267f99; 
}

/* 函数名 (如 main, printf)：金黄色/土黄色 —— 这是 VS Code 的标志性颜色 */
.token.function {
    color: #795e26;
}

/* 宏定义、装饰器、正则：紫色 */
.token.macro,
.token.entity,
.token.url,
.token.variable.special,
.token.important,
.token.regex {
    color: #af00db;
}

/* 运算符：深灰 */
.token.operator {
    color: #333333;
    background: none;
}

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

.token.italic {
    font-style: italic;
}

/* =========================================
   3. 右上角语言标签 (Language Badge)
   ========================================= */
pre[class*="language-"]::after {
    position: absolute;
    top: 0;
    right: 0;
    padding: 3px 12px;
    font-size: 11px;
    font-weight: 700;
    color: #5c5c5c;
    background: #f3f3f3; /* 浅灰底色 */
    border-left: 1px solid #e1e4e8;
    border-bottom: 1px solid #e1e4e8;
    border-bottom-left-radius: 6px;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
    content: "Code"; 
}

/* 语言映射 */
pre.language-cpp::after     { content: "C++"; }
pre.language-c::after       { content: "C"; }
pre.language-bash::after    { content: "Bash"; }
pre.language-python::after  { content: "Python"; }
pre.language-html::after    { content: "HTML"; }
pre.language-css::after     { content: "CSS"; }
pre.language-js::after,
pre.language-javascript::after { content: "JavaScript"; }

/* =========================================
   4. 左上角复制按钮 (Copy Button)
   ========================================= */
button.copy-button {
    right: auto !important; /* 覆盖默认 */
    left: 12px !important; 
    top: 12px !important; 
    
    background: #ffffff !important;
    color: #586069 !important;
    border: 1px solid #d1d5da !important;
    border-radius: 4px !important;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
    font-size: 11px !important;
    line-height: 16px !important;
    padding: 3px 10px !important;
    transition: all 0.2s cubic-bezier(0.3, 0, 0.5, 1) !important;
    cursor: pointer !important;
}

button.copy-button:hover {
    background-color: #f3f4f6 !important;
    border-color: #24292e !important;
    color: #24292e !important;
}

/* 复制成功后的状态 */
button.copy-button:active {
    background-color: #e6ffed !important;
    border-color: #34d058 !important;
    color: #22863a !important;
}