/* ==========================================================
   白话 · 自定义样式
   ----------------------------------------------------------
   引入   由插件 CustomCSS 在 <head> 加载
   维护   只改这个文件，刷新即生效
   ========================================================== */


/* ========== 0. 变量 ========== */

:root {
    /* 二级菜单宽度：只改这一个值，居中位置会自动跟着算 */
    --dropdown-w: 11em;
}


/* ========== 1. 顶部导航（仅桌面 ≥992px） ========== */

@media screen and (min-width: 992px) {

    /* 1.1 导航左对齐，紧跟 logo */
    header > .container {
        justify-content: flex-start;
    }
    header > .container > .left {
        margin-right: 2.5em;
    }
    header > .container > .right {
        flex: 1;
        justify-content: space-between;
    }

    /* 1.2 二级菜单宽度与居中 */
    .nav-items > .item .nav-child-box {
        width: var(--dropdown-w);
        left: calc(50% - var(--dropdown-w) / 2);
    }

    /* 1.3 二级菜单文字左对齐
           选择器必须写到 .item a，否则会被主题的同名规则覆盖 */
    .nav-child-box .nav-child-items > .item a {
        text-align: left;
        white-space: nowrap;
        padding: 8px 12px;
        border-radius: 6px;
        transition: background-color .2s ease, color .2s ease, border-color .2s ease;
    }

    /* 1.4 下拉面板圆角，与站点卡片统一 */
    .nav-child-box .nav-child-items {
        border-bottom-left-radius: 8px;
        border-bottom-right-radius: 8px;
    }

}


/* ========== 2. 文章正文（全端通用） ========== */

/* 2.1 字号与行高：16px，行高 1.85（原 14px） */
.content.markdown {
    font-size: 16px;
    line-height: 1.85;
}

/* 2.2 段落间距 */
.content.markdown p {
    margin-bottom: 1.2em;
}

/* 2.3 列表 */
.content.markdown ul,
.content.markdown ol {
    margin-bottom: 1.2em;
    padding-left: 1.5em;
}
.content.markdown li {
    margin-bottom: .4em;
}

/* 2.4 图片留白 */
.content.markdown img {
    margin: 1.4em auto;
}

/* 2.5 代码块：字号小一档 */
.content.markdown pre {
    font-size: 14px;
    line-height: 1.6;
    margin: 1.2em 0;
}

/* 2.6 引用块 */
.content.markdown blockquote {
    margin: 1.2em 0;
    padding: .4em 1em;
    font-size: 15px;
}


/* ========== 3. 手机端微调（≤768px） ========== */

@media screen and (max-width: 768px) {

    .content.markdown {
        font-size: 15px;
        line-height: 1.8;
    }
    .content.markdown pre {
        font-size: 13px;
    }

}