/* ==========================================================================
   Hugo Mac Style Code Block - Alignment Fix v4
   ========================================================================== */

/* 1. 容器核心：确保黑底高对比度 */
.highlight {
    position: relative !important;
    background: #282c34 !important;
    border-radius: 8px;
    margin: 20px 0;
    overflow: hidden;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.4);
    /* 统一设置基础属性，确保继承 */
    font-family: 'Fira Code', Consolas, Monaco, monospace !important;
    font-size: 14px !important;
    line-height: 1.6 !important; 
}

/* 2. 标题栏 */
.highlight::before {
    content: "";
    display: block;
    height: 38px;
    background: #21252b;
    width: 100%;
}

.mac-dots {
    position: absolute;
    top: 13px;
    left: 15px;
    z-index: 10;
    display: flex;
    gap: 8px;
}
.mac-dots span {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    display: inline-block;
}
.dot-red { background: #ff5f56; }
.dot-yellow { background: #ffbd2e; }
.dot-green { background: #27c93f; }

/* 3. 核心对齐逻辑：确保表格两列完全对称 */
.highlight table {
    border-collapse: collapse !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}

.highlight td {
    padding: 0 !important;
    border: none !important;
    vertical-align: top !important; /* 确保顶部对齐 */
}

/* 强制行号和代码的 pre 标签拥有完全一样的内边距和行高 */
.highlight .lntd:first-child pre,
.highlight .lntd:last-child pre,
.highlight > pre {
    margin: 0 !important;
    padding: 15px 0 !important; /* 统一上下边距 */
    line-height: 1.6 !important; /* 统一行高 */
    font-size: 14px !important;  /* 统一字号 */
    background: transparent !important;
    white-space: pre !important;
}

/* 行号列微调 */
.highlight .lntd:first-child {
    width: 1%; 
}

.highlight .lnt {
    display: block;
    padding: 0 15px 0 20px !important; /* 行号的左右间距 */
    color: #495162 !important;
    text-align: right;
    user-select: none;
}

/* 代码内容列微调 */
.highlight .lntd:last-child {
    padding-left: 5px !important; /* 代码距离行号的间隙 */
}

.highlight .lntd:last-child pre {
    padding-left: 0 !important;
    overflow-x: auto !important;
}

/* 4. 语法高亮恢复 (One Dark) */
.highlight code { color: #abb2bf; }
.highlight .k, .highlight .kd, .highlight .kr { color: #c678dd !important; }
.highlight .s, .highlight .s2, .highlight .sa, .highlight .sb, .highlight .sc, .highlight .s1 { color: #98c379 !important; }
.highlight .c, .highlight .c1 { color: #7f848e !important; font-style: italic; }
.highlight .f, .highlight .nf, .highlight .fm { color: #61afef !important; }
.highlight .nc, .highlight .no, .highlight .kt { color: #e5c07b !important; }
.highlight .m, .highlight .mi, .highlight .mf { color: #d19a66 !important; }
.highlight .o, .highlight .p { color: #56b6c2 !important; }
.highlight .n, .highlight .na, .highlight .nb, .highlight .nv { color: #e06c75 !important; }

/* 5. 功能按钮 */
.code-lang {
    position: absolute;
    top: 10px;
    left: 50%;
    transform: translateX(-50%);
    color: #6a7382;
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}
.copy-btn {
    position: absolute;
    top: 7px;
    right: 10px;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.1);
    color: #a0a8b7;
    padding: 3px 10px;
    font-size: 11px;
    border-radius: 4px;
    cursor: pointer;
    z-index: 10;
}