@charset "UTF-8";
/*!
 * WPKit Pro Shop · 文档中心版式（左侧目录树 + 正文 + 上一篇/下一篇）
 */

.wk-docs {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: 34px;
	align-items: start;
	padding: 34px 0 60px;
}

/* ---- 左栏目录树 ---- */

.wk-docs__aside {
	position: sticky;
	top: 18px;
	max-height: calc(100vh - 40px);
	overflow-y: auto;
}

.wk-docs__search {
	margin-bottom: 16px;
}

.wk-docs__search input {
	width: 100%;
	height: 40px;
	border: 1px solid var(--wk-line);
	border-radius: 9px;
	padding: 0 12px;
	font-size: 14px;
	font-family: inherit;
	color: var(--wk-ink);
	background: #fff;
}

.wk-docs__search input:focus {
	outline: none;
	border-color: var(--wk-blue);
	box-shadow: 0 0 0 3px rgba(37, 99, 235, .12);
}

.wk-docs__nav {
	list-style: none;
	margin: 0;
	padding: 0;
	font-size: 14px;
}

.wk-docs__group {
	margin-bottom: 14px;
}

.wk-docs__group-title {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--wk-muted);
	text-transform: uppercase;
	margin-bottom: 6px;
	padding-left: 10px;
}

.wk-docs__nav a {
	display: block;
	padding: 7px 12px;
	border-radius: 8px;
	color: var(--wk-ink-2) !important;
	text-decoration: none !important;
	line-height: 1.5;
	border-left: 2px solid transparent;
}

.wk-docs__nav a:hover {
	background: #f5f7fb;
	color: var(--wk-ink) !important;
}

.wk-docs__nav a.is-on {
	background: #eff4ff;
	color: var(--wk-blue) !important;
	border-left-color: var(--wk-blue);
	font-weight: 600;
}

.wk-docs__nav a.is-hidden { display: none; }

/* ---- 正文 ---- */

.wk-docs__main {
	min-width: 0;
	background: #fff;
	border: 1px solid var(--wk-line);
	border-radius: 16px;
	padding: 34px 38px;
}

.wk-docs__crumb {
	font-size: 13px;
	color: var(--wk-muted);
	margin-bottom: 10px;
}

.wk-docs__main h1 {
	font-size: 27px;
	margin-bottom: 6px;
}

.wk-docs__meta {
	font-size: 13px;
	color: var(--wk-muted);
	padding-bottom: 16px;
	border-bottom: 1px solid var(--wk-line-2);
	margin-bottom: 24px;
}

.wk-docs__content { font-size: 15px; color: var(--wk-ink-2); }

.wk-docs__content h2 {
	font-size: 20px;
	margin: 30px 0 12px;
	padding-left: 11px;
	border-left: 4px solid var(--wk-blue);
	color: var(--wk-ink);
	scroll-margin-top: 20px;
}

.wk-docs__content h3 {
	font-size: 16.5px;
	margin: 22px 0 8px;
	color: var(--wk-ink);
	scroll-margin-top: 20px;
}

.wk-docs__content p { margin: 10px 0; }

.wk-docs__content ul,
.wk-docs__content ol { margin: 10px 0 10px 22px; }

.wk-docs__content li { margin: 5px 0; }

.wk-docs__content code {
	background: #f3f4f6;
	border-radius: 5px;
	padding: 1px 6px;
	font-size: 13.2px;
	font-family: Consolas, Monaco, monospace;
	color: #b91c1c;
}

.wk-docs__content pre {
	background: #1f2937;
	color: #e5e7eb;
	border-radius: 10px;
	padding: 16px 18px;
	overflow-x: auto;
	font-size: 13px;
	line-height: 1.7;
	margin: 14px 0;
}

.wk-docs__content pre code {
	background: none;
	color: inherit;
	padding: 0;
	font-size: inherit;
}

.wk-docs__content table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	margin: 14px 0;
}

.wk-docs__content th,
.wk-docs__content td {
	border: 1px solid var(--wk-line);
	padding: 9px 12px;
	text-align: left;
	vertical-align: top;
}

.wk-docs__content th { background: #f7f9fc; font-weight: 600; color: var(--wk-ink); }

.wk-docs__content blockquote {
	margin: 14px 0;
	padding: 12px 18px;
	background: #fffbeb;
	border-left: 4px solid #fbbf24;
	border-radius: 0 8px 8px 0;
	font-size: 14px;
	color: #92400e;
}

.wk-docs__content img { border-radius: 10px; margin: 14px 0; }

/* ---- 文档配图（P4） ---- */

.wk-doc-figure {
	margin: 22px 0;
	padding: 12px;
	background: var(--wk-bg-soft, #f8fafc);
	border: 1px solid var(--wk-line, #e2e8f0);
	border-radius: 12px;
}

.wk-doc-figure img {
	display: block;
	width: 100%;
	height: auto;
	margin: 0;
	background: #fff;
	border: 1px solid var(--wk-line, #e2e8f0);
	border-radius: 8px;
}

.wk-doc-figure figcaption {
	font-size: 13px;
	line-height: 1.7;
	color: var(--wk-muted, #64748b);
	margin: 10px 2px 0;
}

/* ---- 上一篇 / 下一篇 ---- */

.wk-docs__pager {
	display: flex;
	gap: 14px;
	margin-top: 34px;
	padding-top: 22px;
	border-top: 1px solid var(--wk-line-2);
}

.wk-docs__pager a {
	flex: 1 1 0;
	min-width: 0;
	border: 1px solid var(--wk-line);
	border-radius: 12px;
	padding: 13px 16px;
	text-decoration: none !important;
	transition: border-color .18s ease, background-color .18s ease;
}

.wk-docs__pager a:hover { border-color: #cfd9ea; background: #fbfcfd; }

.wk-docs__pager .dir {
	display: block;
	font-size: 12.5px;
	color: var(--wk-muted);
	margin-bottom: 3px;
}

.wk-docs__pager .ttl {
	display: block;
	font-size: 14.5px;
	font-weight: 600;
	color: var(--wk-ink);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.wk-docs__pager .next { text-align: right; }

/* ---- 文档索引页（归档） ---- */

.wk-docs-index {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 18px;
}

.wk-docs-index__group {
	background: #fff;
	border: 1px solid var(--wk-line);
	border-radius: 14px;
	padding: 20px;
}

.wk-docs-index__group h3 {
	font-size: 15.5px;
	margin: 0 0 10px;
	padding-bottom: 9px;
	border-bottom: 1px solid var(--wk-line-2);
}

.wk-docs-index__group ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.wk-docs-index__group li { margin: 0; }

.wk-docs-index__group a {
	display: block;
	padding: 5px 0;
	font-size: 14px;
	color: var(--wk-ink-2) !important;
	text-decoration: none !important;
}

.wk-docs-index__group a:hover { color: var(--wk-blue) !important; }

@media (max-width: 960px) {
	.wk-docs { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.wk-docs__aside { position: static; max-height: none; }
	.wk-docs__main { padding: 24px 20px; }
	.wk-docs__main h1 { font-size: 22px; }
}

@media (max-width: 640px) {
	.wk-docs__pager { flex-direction: column; }
	.wk-docs__pager .next { text-align: left; }
}

@media (max-width: 480px) {
	.wk-docs__main { padding: 18px 14px; }
	.wk-docs__main h1 { font-size: 20px; }
	.wk-docs__meta { font-size: 12.5px; }
	.wk-docs__aside { padding: 14px 13px; }
	.wk-docs-index__group { margin-bottom: 18px; }
	/* 正文里的表格与代码块在窄屏一律横向滚动，不撑破页面 */
	.wk-docs__content table,
	.wk-docs__content pre { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; }
	.wk-docs__content h2 { font-size: 18px; }
	.wk-docs__content h3 { font-size: 16px; }
	/* 配图：窄屏去掉外框留白，截图横向可滚 */
	.wk-doc-figure { padding: 8px; margin: 16px 0; }
	.wk-doc-figure img { overflow-x: auto; }
	.wk-doc-figure figcaption { font-size: 12.5px; }
}

/* ============================================================
   文档正文（.wk-docs__content）
   ------------------------------------------------------------
   教程原稿是独立落地页，自带一套 .wrap/.box/.step 样式。
   灌库时已把类名统一改写为 wk-doc-* 前缀，这里在正文容器内重新定义，
   既保证版式一致，又不会和父主题 RiPro 的 Bootstrap 同名类互相污染。
   ============================================================ */

.wk-docs__content h2 {
	font-size: 21px;
	margin: 30px 0 14px;
	padding-bottom: 8px;
	border-bottom: 1px solid var(--wk-line-2);
}

.wk-docs__content h2:first-child { margin-top: 4px; }

.wk-docs__content h3 {
	font-size: 17px;
	margin: 22px 0 10px;
}

.wk-docs__content p { margin: 0 0 12px; }

.wk-docs__content ul,
.wk-docs__content ol { margin: 0 0 14px; padding-left: 22px; }

.wk-docs__content li { margin-bottom: 6px; }

.wk-docs__content ul { list-style: disc; }
.wk-docs__content ol { list-style: decimal; }

.wk-docs__content a { color: var(--wk-blue) !important; text-decoration: none; }
.wk-docs__content a:hover { text-decoration: underline; }

/* 行内代码 */
.wk-docs__content code {
	background: var(--wk-bg-soft);
	border: 1px solid var(--wk-line);
	border-radius: 5px;
	padding: 1px 6px;
	font-family: Consolas, Monaco, "Courier New", monospace;
	font-size: .92em;
	color: #b91c1c;
	word-break: break-all;
}

/* 代码块：原稿里的 <pre> 多为命令行 / 配置片段 */
.wk-docs__content pre {
	background: #0f172a;
	color: #e2e8f0;
	border-radius: 10px;
	padding: 14px 16px;
	overflow-x: auto;
	font-family: Consolas, Monaco, "Courier New", monospace;
	font-size: 13px;
	line-height: 1.7;
	margin: 0 0 14px;
}

.wk-docs__content pre code {
	background: transparent;
	border: 0;
	padding: 0;
	color: inherit;
	font-size: inherit;
}

/* 表格 */
.wk-docs__content table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 16px;
	font-size: 13.8px;
	background: #fff;
	border: 1px solid var(--wk-line);
	border-radius: 10px;
	overflow: hidden;
}

.wk-docs__content th,
.wk-docs__content td {
	padding: 10px 13px;
	border-bottom: 1px solid var(--wk-line-2);
	text-align: left;
	vertical-align: top;
	line-height: 1.7;
}

.wk-docs__content th {
	background: var(--wk-bg-soft);
	font-weight: 700;
	color: var(--wk-ink);
	white-space: nowrap;
}

.wk-docs__content tr:last-child td { border-bottom: 0; }

/* 步骤块：原稿用 <div class="step"> 包一组「编号 + 说明」 */
.wk-doc-step {
	border-left: 3px solid var(--wk-blue);
	background: #f8faff;
	border-radius: 0 10px 10px 0;
	padding: 14px 18px;
	margin: 0 0 16px;
}

.wk-doc-step > h3 {
	margin-top: 0;
	color: var(--wk-blue-deep);
}

.wk-doc-step > :last-child { margin-bottom: 0; }

/* 步骤序号（原稿 h2 里的 <span class="step">） */
.wk-doc-step,
.wk-doc-step-num { position: relative; }

/* 提示条 */
.wk-doc-note {
	border-radius: 10px;
	padding: 13px 17px;
	margin: 0 0 16px;
	font-size: 13.8px;
	border: 1px solid var(--wk-line);
	background: var(--wk-bg-soft);
	color: var(--wk-ink-2);
	line-height: 1.8;
}

.wk-doc-note--warn   { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.wk-doc-note--ok     { background: #f0fdf4; border-color: #bbf7d0; color: #166534; }
.wk-doc-note--danger { background: #fef2f2; border-color: #fecaca; color: #991b1b; }

.wk-doc-note > :last-child { margin-bottom: 0; }

/* 原稿里直接写在正文中的 ok / warn / danger 段落 */
.wk-doc-ok     { color: #166534; font-weight: 600; }
.wk-doc-warn   { color: #92400e; font-weight: 600; }
.wk-doc-danger { color: #991b1b; font-weight: 600; }

/* 文末元信息 */
.wk-doc-meta {
	font-size: 12.5px;
	color: var(--wk-muted);
	margin: 20px 0 0;
	padding-top: 12px;
	border-top: 1px dashed var(--wk-line);
}

.wk-doc-wrap { display: block; }

.wk-doc-toc {
	background: var(--wk-bg-soft);
	border: 1px solid var(--wk-line);
	border-radius: 10px;
	padding: 12px 16px;
	font-size: 13.5px;
	color: var(--wk-ink-2);
	margin: 0 0 18px;
}
