/* =========================================
   Mac-Style Dark Theme for Markdown Code Blocks
   ========================================= */

/* S1: 代码块根容器 - 圆角与阴影 */
.markdown-body pre {
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
    border: 1px solid rgba(255, 255, 255, 0.08);
    margin-bottom: 1.5em;
    overflow: hidden; /* 确保子元素不溢出圆角 */
}

/* S3: 头部栏 - 深色背景与底部边框 */
.markdown-body pre > div > div.flex.justify-between.h-8 {
    background-color: #21252b !important; /* 深色头部 */
    border-bottom: 1px solid #181a1f !important; /* 覆盖内联边框颜色 */
    padding-left: 12px;
    position: relative;
}

/* Mac Traffic Lights (红绿灯装饰) */
.markdown-body pre > div > div.flex.justify-between.h-8::before {
    content: '';
    display: block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #ff5f56; /* 红 */
    box-shadow: 
        15px 0 0 #ffbd2e, /* 黄 */
        30px 0 0 #27c93f; /* 绿 */
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 15px;
    z-index: 10;
}

/* S4: 语言标签 - 右移避让红绿灯 & 字体优化 */
.markdown-body pre > div > div.flex.justify-between > div.text-\[13px\] {
    margin-left: 50px; /* 为红绿灯留出空间 */
    color: #abb2bf !important;
    font-family: 'JetBrains Mono', 'Fira Code', monospace;
    font-weight: 600;
    font-size: 12px;
    opacity: 0.8;
}

/* S9: 代码内容区 - R4 内联样式覆盖 */
.markdown-body pre > div > div[node] {
    background-color: #282c34 !important; /* One Dark 背景 */
    color: #abb2bf !important; /* 默认文字颜色 */
    font-family: 'JetBrains Mono', 'Fira Code', Consolas, monospace;
    font-size: 14px;
    line-height: 1.6;
    padding: 16px !important;
}

/* =========================================
   R3 CRITICAL: 复制按钮联动处理
   ========================================= */

/* S7: 复制按钮外层 - 默认态 */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] {
    background-color: rgba(255, 255, 255, 0.05) !important; /* 微透深色背景 */
    border: 1px solid rgba(255, 255, 255, 0.1);
    transition: all 0.2s ease;
}

/* S7: 复制按钮外层 - Hover态 */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"]:hover {
    background-color: rgba(255, 255, 255, 0.15) !important; /* 提亮 */
    border-color: rgba(255, 255, 255, 0.3);
}

/* S8: 复制图标 - 反色处理 (适配深色背景) */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] > div {
    filter: invert(1) brightness(2); /* 将黑色图标转为白色 */
    opacity: 0.7;
}

/* S8: 复制图标 - Hover态 (R3强制: 必须使用background-color) */
.markdown-body pre div[data-tooltip-id^="copy-tooltip"] > div:hover {
    background-color: transparent !important; /* 图标本身不需背景，由外层wrapper处理 */
    opacity: 1;
}

/* =========================================
   滚动条美化
   ========================================= */
.markdown-body pre > div > div[node]::-webkit-scrollbar {
    height: 10px;
    width: 10px;
}

.markdown-body pre > div > div[node]::-webkit-scrollbar-thumb {
    background-color: #4b5263;
    border-radius: 5px;
    border: 2px solid #282c34; /* 制造padding效果 */
}

.markdown-body pre > div > div[node]::-webkit-scrollbar-track {
    background-color: #282c34;
}

/* S11: 简单的语法高亮修正 (可选，增强对比度) */
.markdown-body pre code[class^="language-"] > span {
    filter: brightness(1.2); /* 稍微提亮原有高亮颜色 */
}