/*
 * 文档中心（docs.php）：页头、首页分区卡片、三栏布局（侧栏 · 正文 · 本页目录）、侧栏分组、搜索框与结果、
 * 草稿 / 英文兜底横幅、正文里的 .doc-meta / .doc-note / .doc-warn / .doc-tbd、移动端「目录」面板。
 * 正文排版复用 css/article.css 的 .a-prose，本页目录复用 .a-toc；token 见 css/tokens-docs.css。
 * 整页深色（与法律文本页一致），结构靠 1px 细线，不用色块分区。
 */

/* ---------- 页头 ---------- */
.a-page .d-head {
    padding-bottom: var(--space-10);
    border-bottom: var(--line-width) solid var(--line);
}

.d-head__title { margin-top: var(--space-4); max-width: var(--a-head-max); }
.d-head__search { max-width: var(--d-head-search-max); margin-top: var(--space-8); }
.d-head .a-crumbs [aria-current] { color: var(--fg-secondary); }

.a-page .d-body {
    padding-block: var(--space-12) var(--a-section-y);
    background-color: var(--bg);
    color: var(--fg);
}

/* ---------- 首页：分区卡片 ---------- */
.d-cards {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(var(--d-card-min), 1fr));
    gap: var(--space-4);
    list-style: none;
}

.d-card {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    height: 100%;
    min-height: var(--d-card-min-h);
    padding: var(--space-6);
    border: var(--line-width) solid var(--line);
    border-radius: var(--radius-lg);
    transition: border-color var(--dur-base) var(--ease-out), background-color var(--dur-base) var(--ease-out);
}

.d-card:hover { border-color: var(--line-strong); background: var(--a-surface-hover); }
.d-card__title { font-size: var(--fs-lg); font-weight: var(--fw-bold); color: var(--fg); }
.d-card__summary { font-size: var(--fs-sm); line-height: var(--lh-body); color: var(--fg-secondary); }

.d-card__foot {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    margin-top: auto;
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    color: var(--fg-muted);
}

.d-card__arrow { margin-left: auto; transition: transform var(--dur-base) var(--ease-out); }
.d-card:hover .d-card__arrow { color: var(--brand-blue); transform: translateX(var(--space-1)); }

.d-badge {
    padding: 0 var(--space-2);
    border: var(--line-width) solid var(--line-strong);
    border-radius: var(--radius-full);
    color: var(--fg-secondary);
}

.d-empty { color: var(--fg-muted); }

/* ---------- 三栏布局 ---------- */
.d-layout {
    display: grid;
    grid-template-columns: var(--d-side-w) minmax(0, var(--a-prose-max)) var(--a-toc-w);
    justify-content: space-between;
    align-items: start;
    gap: var(--d-col-gap);
}

.d-layout--no-toc { grid-template-columns: var(--d-side-w) minmax(0, var(--a-prose-max)); justify-content: start; }

.d-side { position: sticky; top: var(--d-sticky-top); }

.d-side__panel {
    display: grid;
    gap: var(--space-6);
    max-height: var(--d-sticky-max-h);
    overflow-y: auto;
    overscroll-behavior: contain;
}

.d-side__toggle { display: none; }

.d-side__sections {
    display: grid;
    gap: var(--space-1);
    padding-bottom: var(--space-5);
    border-bottom: var(--line-width) solid var(--line);
    font-size: var(--fs-sm);
}

.d-side__section {
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-sm);
    color: var(--fg-muted);
}

.a-page .d-side__section:hover { color: var(--fg); }
.a-page .d-side__section[aria-current] { color: var(--fg); background: var(--a-surface-hover); }

.d-side__nav { display: grid; gap: var(--space-4); font-size: var(--fs-sm); }

.d-group__title {
    display: flex;
    justify-content: space-between;
    list-style: none;
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    letter-spacing: var(--a-tracking-wide);
    text-transform: uppercase;
    color: var(--fg-muted);
    cursor: pointer;
}

.d-group__title::-webkit-details-marker { display: none; }
.d-group__title::after { content: "+"; }
.d-group[open] > .d-group__title::after { content: "−"; }

.d-group__list {
    display: grid;
    margin-top: var(--space-2);
    border-left: var(--line-width) solid var(--line);
    list-style: none;
}

.d-group__link {
    display: block;
    margin-left: calc(var(--line-width) * -1);
    padding: var(--space-1) 0 var(--space-1) var(--space-4);
    border-left: var(--line-width) solid transparent;
    line-height: var(--lh-normal);
    color: var(--fg-secondary);
    transition: color var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out);
}

.a-page .d-group__link:hover { color: var(--fg); }
.a-page .d-group__link[aria-current] { border-left-color: var(--brand-blue); color: var(--brand-blue); }

/* ---------- 搜索 ---------- */
.d-search { position: relative; }

.d-search__input {
    width: 100%;
    height: var(--d-search-h);
    padding: 0 var(--space-4);
    border: var(--line-width) solid var(--line-strong);
    border-radius: var(--radius-md);
    background: transparent;
    font: inherit;
    font-size: var(--fs-sm);
    color: var(--fg);
}

.d-search__input::placeholder { color: var(--fg-muted); }
.a-page .d-search__input:focus { outline: none; border-color: var(--brand-blue); }

.d-search__results {
    position: absolute;
    z-index: var(--z-overlay);
    top: calc(100% + var(--space-2));
    left: 0;
    right: 0;
    max-height: var(--d-search-results-max-h);
    overflow-y: auto;
    padding: var(--space-2);
    border: var(--line-width) solid var(--d-search-shadow-line);
    border-radius: var(--radius-md);
    background: var(--bg-elevated);
    list-style: none;
}

/* 侧栏里空间窄：结果列表与侧栏同宽向右展开，不压住正文太多 */
.d-side .d-search__results { right: auto; width: max(100%, var(--d-card-min)); }

.d-search__item a {
    display: grid;
    gap: var(--space-1);
    padding: var(--space-2) var(--space-3);
    border-radius: var(--radius-sm);
}

.d-search__item.is-active a,
.d-search__item a:hover { background: var(--d-search-hit-bg); }

.d-search__title { font-size: var(--fs-sm); font-weight: var(--fw-medium); color: var(--fg); }
.d-search__meta { font-family: var(--font-mono); font-size: var(--fs-xs); color: var(--fg-muted); }
.d-search__snippet { font-size: var(--fs-xs); line-height: var(--lh-normal); color: var(--fg-secondary); }
.d-search__item mark { background: transparent; color: var(--brand-blue); }
.d-search__status { padding: var(--space-2) var(--space-3); font-size: var(--fs-sm); color: var(--fg-muted); }

/* ---------- 横幅：草稿 / 英文兜底 ---------- */
.d-banner {
    margin-bottom: var(--space-8);
    padding: var(--space-3) var(--space-4);
    border: var(--line-width) solid var(--line-strong);
    border-left-color: var(--d-warn-line);
    border-radius: var(--radius-md);
    font-size: var(--fs-sm);
    color: var(--fg-secondary);
}

.d-banner--fallback { border-left-color: var(--d-note-line); }
.d-banner + .d-banner { margin-top: calc(var(--space-6) * -1); }

/* ---------- 正文：元信息行、提示框、表格 ---------- */
.d-prose .doc-meta { font-family: var(--font-mono); font-size: var(--fs-sm); color: var(--fg-muted); }

.d-prose .doc-note,
.d-prose .doc-warn {
    padding: var(--space-4) var(--space-5);
    border-left: var(--line-width) solid var(--d-note-line);
    border-radius: var(--radius-sm);
    background: var(--d-note-bg);
    color: var(--fg);
}

.d-prose .doc-warn { border-left-color: var(--d-warn-line); background: var(--d-warn-bg); }
.d-prose .doc-note > * + *,
.d-prose .doc-warn > * + * { margin-top: var(--space-3); }

/* 「待定」徽标：标出尚未定稿的取值，写法与侧栏 .d-badge 一致，但用小圆角以区别于状态胶囊 */
.d-prose .doc-tbd {
    display: inline-block;
    padding: 0 var(--space-2);
    border: var(--line-width) solid var(--line-strong);
    border-radius: var(--radius-sm);
    font-family: var(--font-mono);
    font-size: var(--fs-xs);
    color: var(--fg-secondary);
    white-space: nowrap;
}

/* 表格在正文栏里通常放得下，恢复正常表格布局，窄屏再横向滚动 */
.d-prose table { display: table; }
.a-page .d-prose :is(p, li, td, figcaption, blockquote) a:hover { color: var(--brand-blue-hover); }

/* ---------- 响应式 ---------- */
@media (max-width: 1279.98px) {
    .d-layout,
    .d-layout--no-toc { grid-template-columns: var(--d-side-w) minmax(0, 1fr); }
    /* 中等宽度放不下第三栏：本页目录隐藏 */
    .d-toc { display: none; }
}

@media (max-width: 1023.98px) {
    .d-layout,
    .d-layout--no-toc { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); }

    .d-side { position: static; }
    .d-side__toggle { display: inline-flex; }

    .d-side__panel {
        display: none;
        max-height: var(--d-panel-max-h);
        margin-top: var(--space-3);
        padding: var(--space-5);
        border: var(--line-width) solid var(--line-strong);
        border-radius: var(--radius-md);
        background: var(--d-panel-bg);
    }

    .d-side.is-open .d-side__panel { display: grid; }
    .d-side .d-search__results { width: auto; right: 0; }
}

@media (max-width: 768px) {
    .d-prose table { display: block; }
}