/*
 * Markdown 排版样式
 * 作用域：.wzc-main（普通文章）和 .detail-content（项目课程详情）
 * 仅在文章勾选"Markdown 解析"时加载
 * 主题色：#ee7800 橙 / #fb3b3b 红 / #5a5a5a 正文灰
 */


/* ===== 标题 ===== */
.wzc-main h1,
.detail-content h1 {
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.4;
    margin: 30px 0 16px;
    color: #333;
    border-bottom: 2px solid #ee7800;
    padding-bottom: 10px;
}

.wzc-main h2,
.detail-content h2 {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.4;
    margin: 26px 0 14px;
    color: #333;
    border-bottom: 1px solid #f0f0f0;
    padding-bottom: 8px;
}

.wzc-main h3,
.detail-content h3 {
    font-size: 1.8rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 22px 0 12px;
    color: #ee7800;
}

.wzc-main h4,
.detail-content h4 {
    font-size: 1.7rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 18px 0 10px;
    color: #555;
}

.wzc-main h5,
.detail-content h5 {
    font-size: 1.6rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 16px 0 8px;
    color: #555;
    border-left: 3px solid #ee7800;
    padding-left: 8px;
}

.wzc-main h6,
.detail-content h6 {
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 1.5;
    margin: 14px 0 8px;
    color: #777;
}


/* ===== 段落 ===== */
.wzc-main p,
.detail-content p {
    margin: 12px 0;
    line-height: 200%;
    font-size: 1.6rem;
    color: #5a5a5a;
}

/* 首段文字可稍大，提升阅读体验 */
.wzc-main > p:first-child,
.detail-content > p:first-child {
    /* 保持统一即可 */
}


/* ===== 链接 ===== */
.wzc-main a,
.detail-content a {
    color: #ee7800;
    text-decoration: none;
    border-bottom: 1px solid rgba(238, 120, 0, 0.3);
    transition: border-color 0.2s, color 0.2s;
}

.wzc-main a:hover,
.detail-content a:hover {
    color: #fb3b3b;
    border-bottom-color: #fb3b3b;
}


/* ===== 强调 ===== */
.wzc-main strong,
.detail-content strong,
.wzc-main b,
.detail-content b {
    font-weight: 700;
    color: #333;
}

.wzc-main em,
.detail-content em {
    font-style: italic;
    color: #555;
}

.wzc-main del,
.detail-content del,
.wzc-main s,
.detail-content s {
    color: #999;
    text-decoration: line-through;
}


/* ===== 无序列表 ===== */
.wzc-main ul,
.detail-content ul {
    list-style: disc;
    padding-left: 24px;
    margin: 12px 0;
}

.wzc-main ul li,
.detail-content ul li {
    list-style: disc;
    margin: 6px 0;
    line-height: 180%;
    font-size: 1.6rem;
    color: #5a5a5a;
}

/* 嵌套无序列表 */
.wzc-main ul ul,
.detail-content ul ul {
    list-style: circle;
    margin: 6px 0;
}

.wzc-main ul ul ul,
.detail-content ul ul ul {
    list-style: square;
}


/* ===== 有序列表 ===== */
.wzc-main ol,
.detail-content ol {
    list-style: decimal;
    padding-left: 24px;
    margin: 12px 0;
}

.wzc-main ol li,
.detail-content ol li {
    list-style: decimal;
    margin: 6px 0;
    line-height: 180%;
    font-size: 1.6rem;
    color: #5a5a5a;
}

.wzc-main ol ol,
.detail-content ol ol {
    list-style: lower-alpha;
    margin: 6px 0;
}

.wzc-main ol ol ol,
.detail-content ol ol ol {
    list-style: lower-roman;
}


/* ===== 任务列表 (GFM) ===== */
.wzc-main ul li input[type="checkbox"],
.detail-content ul li input[type="checkbox"] {
    margin-right: 6px;
    vertical-align: middle;
    transform: scale(1.2);
}


/* ===== 引用块 ===== */
.wzc-main blockquote,
.detail-content blockquote {
    margin: 16px 0;
    padding: 12px 20px;
    border-left: 4px solid #ee7800;
    background: #fffbf0;
    color: #666;
    font-size: 1.6rem;
    line-height: 180%;
    border-radius: 0 6px 6px 0;
}

.wzc-main blockquote p,
.detail-content blockquote p {
    margin: 8px 0;
    color: #666;
}

.wzc-main blockquote blockquote,
.detail-content blockquote blockquote {
    margin: 10px 0;
    border-left-color: #fb3b3b;
    background: #fff5f5;
}


/* ===== 行内代码 ===== */
.wzc-main code,
.detail-content code {
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.9em;
    background: #fff3e0;
    color: #c73333;
    padding: 2px 6px;
    border-radius: 3px;
    word-wrap: break-word;
}

/* 代码块内的 code 不加行内样式 */
.wzc-main pre code,
.detail-content pre code {
    background: none;
    color: inherit;
    padding: 0;
    border-radius: 0;
    font-size: 1.4rem;
}


/* ===== 代码块 ===== */
.wzc-main pre,
.detail-content pre {
    background: #2d2d2d;
    color: #e8e8e8;
    padding: 16px 20px;
    margin: 16px 0;
    border-radius: 6px;
    overflow-x: auto;
    line-height: 1.6;
    font-size: 1.4rem;
    -webkit-overflow-scrolling: touch;
}

.wzc-main pre code,
.detail-content pre code {
    display: block;
    white-space: pre;
    word-wrap: normal;
}


/* ===== 表格 ===== */
.wzc-main table,
.detail-content table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
    font-size: 1.5rem;
    overflow-x: auto;
    display: block;
}

.wzc-main thead,
.detail-content thead {
    background: #f8f8f8;
}

.wzc-main th,
.detail-content th {
    font-weight: 600;
    color: #333;
    text-align: left;
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    background: #f8f8f8;
}

.wzc-main td,
.detail-content td {
    padding: 10px 12px;
    border: 1px solid #e0e0e0;
    color: #5a5a5a;
    line-height: 1.6;
}

/* 斑马纹 */
.wzc-main tbody tr:nth-child(even),
.detail-content tbody tr:nth-child(even) {
    background: #fafafa;
}

.wzc-main tbody tr:hover,
.detail-content tbody tr:hover {
    background: #fff8ee;
}


/* ===== 分隔线 ===== */
.wzc-main hr,
.detail-content hr {
    border: none;
    height: 2px;
    background: linear-gradient(to right, transparent, #ee7800, transparent);
    margin: 24px 0;
}


/* ===== 图片 ===== */
.wzc-main img,
.detail-content img {
    max-width: 100%;
    height: auto;
    margin: 12px auto;
    display: block;
    border-radius: 4px;
}

/* 带链接的图片去掉下划线 */
.wzc-main a img,
.detail-content a img {
    border-bottom: none;
}


/* ===== 上下标 ===== */
.wzc-main sup,
.detail-content sup {
    font-size: 0.75em;
    vertical-align: super;
}

.wzc-main sub,
.detail-content sub {
    font-size: 0.75em;
    vertical-align: sub;
}


/* ===== 定义列表（部分 Markdown 扩展支持） ===== */
.wzc-main dl,
.detail-content dl {
    margin: 12px 0;
    padding-left: 20px;
}

.wzc-main dt,
.detail-content dt {
    font-weight: 600;
    color: #333;
    margin-top: 10px;
}

.wzc-main dd,
.detail-content dd {
    margin-left: 20px;
    color: #5a5a5a;
    line-height: 180%;
}


/* ===== 响应式适配 ===== */
@media screen and (max-width: 768px) {
    /* 标题字号缩小 */
    .wzc-main h1, .detail-content h1 { font-size: 2rem; }
    .wzc-main h2, .detail-content h2 { font-size: 1.8rem; }
    .wzc-main h3, .detail-content h3 { font-size: 1.7rem; }
    .wzc-main h4, .detail-content h4 { font-size: 1.6rem; }
    .wzc-main h5, .detail-content h5 { font-size: 1.5rem; }
    .wzc-main h6, .detail-content h6 { font-size: 1.4rem; }

    /* 段落和列表字号 */
    .wzc-main p, .detail-content p,
    .wzc-main ul li, .detail-content ul li,
    .wzc-main ol li, .detail-content ol li {
        font-size: 1.5rem;
    }

    /* 引用块 */
    .wzc-main blockquote, .detail-content blockquote {
        padding: 10px 14px;
        font-size: 1.5rem;
    }

    /* 代码块 */
    .wzc-main pre, .detail-content pre {
        padding: 12px 14px;
        font-size: 1.3rem;
    }

    /* 表格 */
    .wzc-main table, .detail-content table {
        font-size: 1.4rem;
    }

    .wzc-main th, .detail-content th,
    .wzc-main td, .detail-content td {
        padding: 8px 10px;
    }

    /* 列表缩进 */
    .wzc-main ul, .detail-content ul,
    .wzc-main ol, .detail-content ol {
        padding-left: 20px;
    }

    /* 标题间距缩小 */
    .wzc-main h1, .detail-content h1 { margin: 20px 0 12px; }
    .wzc-main h2, .detail-content h2 { margin: 18px 0 10px; }
    .wzc-main h3, .detail-content h3 { margin: 16px 0 8px; }
}