/* ==========================================================================
   课程详情页 · 主体件样式（DetailBodyWidget v2 · 白卡 + 手风琴分节）
   --------------------------------------------------------------------------
   落点：web/static/portal/course-detail.css（仅 details 页引用）
   P2-1 重设计 v2（2026-10-12 用户口径：参考学银在线课程页截图重新设计，参考不照抄）：
     吸收 = 白卡分节（6px 圆角 + 柔影）/ 分节标题带 2px 下划线指示（与页签同一套语言）/
            教学团队**单列纵表**（60px 圆头像 + 姓名职称 + 简介全文）/ 纯留白分区；
     不照抄 = 学银用 JS 切 tab（同时只显一节），本件用**原生 `<details>` 手风琴**（零 JS、
              可折叠、首节默认展开）；团队**不用轮播**（用户硬性禁令）；配色走门户 token。
   ⚠ 本件**不依赖** bootstrap / layer / SuperSlide / 旧共享 CSS。
   ========================================================================== */

/* ── 主白卡 ── */
.cd-card{
    margin-top:var(--sp-4, 16px);
    margin-bottom:var(--sp-6, 32px);
    padding:0 var(--sp-5, 24px);
    background-color:var(--c-surface, #fff);
    border-radius:var(--radius-sm, 6px);
    box-shadow:var(--shadow-card);
    box-sizing:border-box;
}

/* ── 分节（原生 details 手风琴）──
   展开态标题：主色文字 + 2px 主色下划线（与页签高亮同一套视觉语言），右侧 ＋/－ 指示。 */
.cd-sec{ border-bottom:1px solid var(--c-divider, #eee); }
.cd-sec:last-child{ border-bottom:0; }
.cd-sec__h{
    display:flex;
    align-items:center;
    gap:var(--sp-3, 12px);
    padding:var(--sp-4, 16px) 0;
    cursor:pointer;
    list-style:none;
    font-size:var(--fs-lg, 16px);
    font-weight:var(--fw-semibold, 600);
    color:var(--c-text, #333);
    border-bottom:2px solid transparent;
    transition:color var(--dur-fast, .14s) var(--ease-out, ease);
}
.cd-sec__h::-webkit-details-marker{ display:none; }
.cd-sec__h > span:first-child{ flex:none; }
/* 计数/说明（右侧，弱化） */
.cd-sec__n{
    margin-left:auto;
    font-size:var(--fs-xs, 12px);
    font-weight:var(--fw-normal, 400);
    color:var(--c-text-tertiary, #999);
}
/* ＋/－ 指示器（放在最右，与计数并列） */
.cd-sec__h::after{
    content:'＋';
    flex:none;
    font-weight:var(--fw-normal, 400);
    color:var(--c-text-tertiary, #999);
    font-size:var(--fs-lg, 16px);
    line-height:1;
}
.cd-sec[open] > .cd-sec__h::after{ content:'－'; }
/* 展开态：标题主色 + 2px 主色下划线（tab 同语言） */
.cd-sec[open] > .cd-sec__h{
    color:var(--c-primary-text);
    border-bottom-color:var(--c-primary);
}
.cd-sec__body{ padding:0 0 var(--sp-5, 24px); }

/* ── 通用文字块 ── */
.cd__label{
    font-size:var(--fs-xs, 12px);
    font-weight:var(--fw-medium, 500);
    color:var(--c-text-tertiary, #999);
    letter-spacing:.02em;
    margin-bottom:var(--sp-1, 4px);
}
.cd__rich{
    max-width:78ch;
    font-size:var(--fs-sm, 14px);
    line-height:1.9;
    color:var(--c-text-secondary, #666);
    text-align:justify;
    word-wrap:break-word;
}
.cd__rich p{ margin:0 0 8px; }
.cd__rich img{ max-width:100%; height:auto; }
.cd__rich--empty{ color:var(--c-text-tertiary, #999); }
.cd__link{ color:var(--c-text-secondary, #666); }
.cd__link:hover{ color:var(--c-primary-text); }

/* 学习进度 */
.cd__prog{
    display:flex;
    flex-wrap:wrap;
    gap:var(--sp-2, 8px) var(--sp-6, 32px);
    margin:var(--sp-2, 8px) 0 0;
}
.cd__prog > div{ display:flex; align-items:baseline; gap:var(--sp-2, 8px); }
.cd__prog .k{ font-size:var(--fs-xs, 12px); color:var(--c-text-tertiary, #999); }
.cd__prog .v{
    font-size:var(--fs-xl, 22px);
    font-weight:var(--fw-semibold, 600);
    color:var(--c-text, #333);
    font-variant-numeric:tabular-nums;
    letter-spacing:-.01em;
}
.cd__prog .v--sm{ font-size:var(--fs-sm, 14px); font-weight:var(--fw-medium, 500); }
.cd__bar{
    margin-top:var(--sp-3, 12px);
    height:6px;
    border-radius:var(--radius-pill, 999px);
    background-color:var(--c-surface-2, #f1f4f9);
    overflow:hidden;
}
.cd__bar i{
    display:block;
    height:100%;
    background-color:var(--c-primary-solid, var(--c-primary));
    border-radius:inherit;
    transition:width var(--dur-slow, .38s) var(--ease-out, ease);
}

/* ── 章节目录（行表）── */
.cd__catalog{ margin-top:var(--sp-1, 4px); }
.cd__chap{ padding:var(--sp-2, 8px) 0; }
.cd__chap-h{
    display:flex;
    align-items:baseline;
    gap:var(--sp-3, 12px);
    padding:6px 0;
    font-size:var(--fs-sm, 14px);
    font-weight:var(--fw-semibold, 600);
    color:var(--c-text, #333);
}
.cd__chap-h .n{
    flex:none;
    min-width:26px;
    color:var(--c-primary-text);
    font-variant-numeric:tabular-nums;
}
.cd__row{
    display:flex;
    align-items:center;
    gap:var(--sp-3, 12px);
    padding:7px 10px 7px 26px;
    border-radius:var(--radius-sm, 6px);
    font-size:var(--fs-sm, 14px);
    color:var(--c-text-secondary, #666);
    transition:background-color var(--dur-fast, .14s) var(--ease-out, ease);
}
.cd__row:hover{ background-color:var(--c-surface-2, #f1f4f9); }
.cd__row .dot{
    width:8px;
    height:8px;
    flex:none;
    border-radius:50%;
    border:1px solid var(--c-border-strong, #ccc);
    background-color:var(--c-surface, #fff);
}
.cd__row .dot.done{ background-color:var(--c-success, #15803d); border-color:var(--c-success, #15803d); }
.cd__row .dot.half{ background:linear-gradient(90deg, var(--c-success, #15803d) 50%, var(--c-surface, #fff) 50%); }
.cd__row .num{
    flex:none;
    min-width:34px;
    color:var(--c-text-tertiary, #999);
    font-variant-numeric:tabular-nums;
}
.cd__row .nm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cd__row .cd__go{
    flex:none;
    display:none;
    padding:2px 12px;
    font-size:var(--fs-xs, 12px);
    color:var(--c-primary-text);
    border:1px solid var(--c-primary-border);
    border-radius:var(--radius-pill, 999px);
    background-color:var(--c-primary-softer);
    cursor:pointer;
}
.cd__row:hover .cd__go{ display:inline-block; }
[data-start-learn]{ cursor:pointer; }

/* ── 教学团队（单列纵表：60px 圆头像 + 姓名职称 + 简介全文）── */
.cd-team{ margin:0; padding:0; list-style:none; }
.cd-member{
    padding:var(--sp-4, 16px) 0;
    border-top:1px dashed var(--c-divider, #eee);
}
.cd-member:first-child{ border-top:0; padding-top:var(--sp-1, 4px); }
.cd-member__head{ display:flex; align-items:center; gap:var(--sp-3, 12px); }
.cd-member__av{
    flex:none;
    width:60px;
    height:60px;
    border-radius:50%;
    overflow:hidden;
    display:inline-block;
    background-color:var(--c-surface-2, #f1f4f9);
    border:1px solid var(--c-border, #e6ebf3);
}
.cd-member__av img{ width:100%; height:100%; object-fit:cover; display:block; }
.cd-member__who{ min-width:0; }
.cd-member__name{
    font-size:var(--fs-base, 14px);
    font-weight:var(--fw-semibold, 600);
    color:var(--c-text, #333);
}
a.cd-member__name:hover{ color:var(--c-primary-text); }
.cd-member__rank{
    margin-left:var(--sp-2, 8px);
    font-size:var(--fs-xs, 12px);
    color:var(--c-primary-text);
}
.cd-member__bio{
    margin:var(--sp-2, 8px) 0 0;
    font-size:var(--fs-sm, 14px);
    line-height:1.85;
    color:var(--c-text-secondary, #666);
    text-align:justify;
}

/* ── 页内展开区块（教学计划 / 课程资料 / 考核标准 / 结业证书）── */
.cd-fold{ border-top:1px solid var(--c-divider, #eee); }
.cd-fold > summary{
    display:flex;
    align-items:center;
    gap:var(--sp-2, 8px);
    padding:var(--sp-4, 16px) 0;
    cursor:pointer;
    list-style:none;
    font-size:var(--fs-lg, 16px);
    font-weight:var(--fw-semibold, 600);
    color:var(--c-text, #333);
}
.cd-fold > summary::-webkit-details-marker{ display:none; }
.cd-fold > summary::after{
    content:'＋';
    margin-left:auto;
    font-weight:var(--fw-normal, 400);
    color:var(--c-text-tertiary, #999);
    font-size:var(--fs-lg, 16px);
    line-height:1;
}
.cd-fold[open] > summary::after{ content:'－'; }
.cd-fold[open] > summary{ padding-bottom:var(--sp-1, 4px); color:var(--c-primary-text); }
.cd-fold[open]{ padding-bottom:var(--sp-4, 16px); }

/* 教学计划 */
.cd__plan{ margin:0 0 var(--sp-4, 16px); padding:0; list-style:none; font-size:var(--fs-sm, 14px); color:var(--c-text-secondary, #666); }
.cd__plan > li{ display:flex; flex-wrap:wrap; gap:var(--sp-3, 12px); padding:8px 0; border-top:1px dashed var(--c-divider, #eee); }
.cd__plan > li:first-child{ border-top:0; }
.cd__plan .n{ flex:none; min-width:34px; color:var(--c-text-tertiary, #999); font-variant-numeric:tabular-nums; }
.cd__plan b{ font-weight:var(--fw-medium, 500); color:var(--c-text, #333); }
.cd__plan-sub{ width:100%; margin:0; padding:0 0 0 46px; list-style:none; font-size:var(--fs-xs, 12px); color:var(--c-text-tertiary, #999); }
.cd__plan-sub li{ padding:2px 0; }

/* 资料 / 成绩表（细线表，不套卡片） */
.cd__mats{ width:100%; border-collapse:collapse; font-size:var(--fs-sm, 14px); margin-bottom:var(--sp-4, 16px); }
.cd__mats th{
    padding:6px 8px;
    font-size:var(--fs-xs, 12px);
    font-weight:var(--fw-medium, 500);
    color:var(--c-text-tertiary, #999);
    text-align:left;
    border-bottom:1px solid var(--c-divider, #eee);
}
.cd__mats td{
    padding:10px 8px;
    max-width:260px;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    color:var(--c-text-secondary, #666);
    border-bottom:1px solid var(--c-divider, #eee);
}
.cd__mats td.sc{ text-align:center; }
.cd__mats td a{ color:var(--c-primary-text); }
.cd__mats td a:hover{ text-decoration:underline; }

/* 考核权重 */
.cd__exam{ padding-bottom:var(--sp-4, 16px); }
.cd__weights{ margin:var(--sp-2, 8px) 0 0; padding:0; list-style:none; font-size:var(--fs-sm, 14px); }
.cd__weights li{ display:flex; align-items:baseline; gap:var(--sp-3, 12px); padding:8px 0; border-top:1px dashed var(--c-divider, #eee); }
.cd__weights li:first-child{ border-top:0; }
.cd__weights span{ flex:none; min-width:72px; color:var(--c-text-secondary, #666); }
.cd__weights b{ flex:none; min-width:48px; color:var(--c-primary-text); font-variant-numeric:tabular-nums; }
.cd__weights em{ font-style:normal; font-size:var(--fs-xs, 12px); color:var(--c-text-tertiary, #999); }

/* 证书 */
.cd__cert-tip{ margin:0; max-width:78ch; font-size:var(--fs-sm, 14px); line-height:1.8; color:var(--c-text-secondary, #666); }
.cd__cert{
    display:block;
    width:100%;
    max-width:560px;
    margin:var(--sp-3, 12px) 0 var(--sp-4, 16px);
    border:1px solid var(--c-border, #e6ebf3);
    border-radius:var(--radius-sm, 6px);
}

/* ── 响应式 ── */
@media (max-width:640px){
    .cd-card{ padding:0 var(--sp-4, 16px); }
    .cd__row{ padding-left:10px; }
    .cd__row .nm{ white-space:normal; }
    .cd-member__av{ width:48px; height:48px; }
}