/* ============================================================
 * Ebook Cloud · 详情页目录树（浮动弹窗 · 默认常驻展开）
 * 固定定位、浮在最上层（高 z-index），始终可见、不占内容空间。
 * 默认即展开；目录右缘贴「电子书内容页最左边」、间距 3px，且垂直居中
 * （顶距 = 底距）。窄屏无足够留白时回退到视口最左 3px 以保证可见。
 * 用户可点「目录」按钮或 × 收起 / 再展开。
 * ============================================================ */

.ebook-body {
	/* 悬浮按钮 / 弹窗宽度与顶部偏移（顶部偏移仍用于锚点滚动避让固定头部） */
	--es-toc-w: 160px;
	--es-toc-offset: 88px;
	--es-toc-brand: #4338ca;
	--es-toc-ink: #1f2430;
	--es-toc-muted: #5b6472;
	--es-toc-line: #eceef3;
	/* 内容区左缘：.es-container(max-width:1200px;margin:0 auto;padding:0 22px)
	   在宽屏时居中、窄屏时满宽，二者取较大值即为内容最左边。 */
	--es-content-left: max(22px, calc((100vw - 1200px) / 2 + 22px));
}

/* 悬浮容器：固定定位，脱离文档流，不占内容空间，始终可见。
   右侧与「电子书内容页最左边」保持 3px 间距；整体垂直居中（顶距=底距）。 */
.ebook-body__toc {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	left: max(3px, calc(var(--es-content-left) - var(--es-toc-w) - 3px));
	z-index: 9999;
	opacity: 0.5;
	transition: opacity .15s ease;
}

/* 鼠标悬停时恢复不透明，保证可读性 */
.ebook-body__toc:hover {
	opacity: 1;
}

/* 触屏设备（手机/平板）没有 hover 态，若保持 50% 会显得「看不见」。
   因此在无 hover 能力的设备上直接全不透明。 */
@media (hover: none) {
	.ebook-body__toc {
		opacity: 1;
	}
}

/* 触发按钮（始终可见，悬浮在左上角） */
.es-toc__toggle {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	background: #fff;
	color: var(--es-toc-brand);
	border: 1px solid var(--es-toc-line);
	border-radius: 999px;
	padding: 9px 16px;
	font-size: 13px;
	font-weight: 600;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 8px 22px -12px rgba(15, 23, 42, .5);
	transition: transform .15s ease, box-shadow .15s ease;
}

.es-toc__toggle::before {
	content: "";
	width: 15px;
	height: 15px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M4 6h16M4 12h16M4 18h16'/></svg>") center / 15px no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M4 6h16M4 12h16M4 18h16'/></svg>") center / 15px no-repeat;
}

.es-toc__toggle:hover {
	transform: translateY(-1px);
	box-shadow: 0 12px 26px -12px rgba(15, 23, 42, .55);
}

.es-toc__toggle[aria-expanded="true"] {
	background: var(--es-toc-brand);
	color: #fff;
	border-color: var(--es-toc-brand);
}

/* 弹窗面板（默认展开常驻；点 × / 触发按钮收起时加 [hidden]）
   宽度固定 160px；高度随内容自适应（content 撑开），
   max-height 作为超矮视口下的兜底，超出则面板内部滚动。 */
.es-toc__panel {
	margin-top: 10px;
	width: var(--es-toc-w);
	height: auto;
	max-width: calc(100vw - 32px);
	max-height: calc(100vh - 80px);
	overflow-y: auto;
	overscroll-behavior: contain;
	background: #fff;
	border: 1px solid var(--es-toc-line);
	border-radius: 14px;
	padding: 4px 0;
	box-shadow: 0 22px 48px -18px rgba(15, 23, 42, .5);
}

.es-toc__panel[hidden] {
	display: none;
}

/* 标题行（在可滚动面板内吸顶） */
.es-toc__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 11px 14px;
	border-bottom: 1px solid var(--es-toc-line);
	position: sticky;
	top: 0;
	background: #fff;
	border-radius: 14px 14px 0 0;
	z-index: 1;
}

.es-toc__title {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
	color: var(--es-toc-ink);
}

.es-toc__count {
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	color: #fff;
	background: var(--es-toc-brand);
	border-radius: 999px;
	padding: 3px 8px;
	min-width: 20px;
	text-align: center;
}

.es-toc__close {
	border: none;
	background: transparent;
	color: var(--es-toc-muted);
	font-size: 22px;
	line-height: 1;
	cursor: pointer;
	padding: 0 2px;
}

.es-toc__close:hover {
	color: var(--es-toc-ink);
}

/* 目录树 */
.es-toc__list {
	padding: 4px 8px 8px;
}

/* 下载地址入口：面板底部的品牌色 CTA，点击跳转到页面下载区(#es-download) */
.es-toc__download {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 6px 10px 10px;
	padding: 10px 12px;
	background: var(--es-toc-brand);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	text-decoration: none;
	border-radius: 10px;
	box-shadow: 0 10px 22px -12px rgba(67, 56, 202, .7);
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}

.es-toc__download:hover {
	transform: translateY(-1px);
	background: #3730a3;
	box-shadow: 0 14px 26px -12px rgba(67, 56, 202, .75);
}

.es-toc__download-ico {
	font-size: 15px;
	line-height: 1;
}

.es-toc__download.is-active {
	outline: 2px solid rgba(67, 56, 202, .35);
	outline-offset: 2px;
}

.es-toc__tree,
.es-toc__tree ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.es-toc__tree ul {
	padding-left: 12px;
	margin-left: 6px;
	border-left: 1px solid var(--es-toc-line);
}

.es-toc__link {
	display: flex;
	align-items: baseline;
	gap: 6px;
	padding: 6px 8px;
	border-radius: 8px;
	font-size: 13px;
	line-height: 1.45;
	color: var(--es-toc-muted);
	text-decoration: none;
	cursor: pointer;
	transition: background .15s ease, color .15s ease;
}

.es-toc__link:hover {
	background: rgba(67, 56, 202, .07);
	color: var(--es-toc-ink);
}

.es-toc__num {
	flex: 0 0 auto;
	font-size: 11px;
	font-variant-numeric: tabular-nums;
	font-weight: 600;
	color: var(--es-toc-brand);
	opacity: .7;
	min-width: 1.4em;
	text-align: right;
}

.es-toc__text {
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* 激活项（滚动高亮） */
.es-toc__link.is-active {
	background: rgba(67, 56, 202, .12);
	color: var(--es-toc-brand);
	font-weight: 600;
}

.es-toc__link.is-active .es-toc__num {
	opacity: 1;
}

/* 锚点跳转时不被固定头部遮挡 */
.ebook-body__main h2,
.ebook-body__main h3,
.ebook-body__main h4,
.ebook-body__main h5,
.ebook-body__main h6 {
	scroll-margin-top: calc(var(--es-toc-offset) + 12px);
}

/* 垂直居中 + max(3px, …) 已覆盖各尺寸；无需单独 top 覆盖。 */

/* ============================================================
 * 移动端 / 平板（≤980px）：目录由「悬浮覆盖」改为「内容区内联折叠块」
 * 原因：窄屏（≤980px）正文为单列满宽，160px 的悬浮面板会盖住封面与正文，
 *      影响阅读（见移动端反馈截图）。
 * 方案：目录变成正文上方一条整宽「目录」折叠条，默认收起，点击展开；
 *      展开后为整宽列表，不再遮挡任何内容。桌面端（>980px）保持悬浮常驻展开。
 * ============================================================ */
@media (max-width: 980px) {
	.ebook-body__toc {
		position: static;
		top: auto;
		left: auto;
		transform: none;
		opacity: 1;
		grid-column: 1 / -1;
		width: 100%;
		margin: 0 0 2px;
	}
	.es-toc__toggle {
		width: 100%;
		justify-content: center;
		padding: 12px 16px;
		border-radius: 12px;
		font-size: 14px;
		box-shadow: 0 6px 16px -12px rgba(15, 23, 42, .45);
	}
	/* 展开态：整宽内联面板（不再固定 160px），长目录内部滚动 */
	.es-toc__panel {
		width: 100%;
		max-width: none;
		max-height: min(56vh, 420px);
		margin-top: 8px;
	}
	/* 折叠条本身即开关，移动端隐藏面板内的 × 以减少噪声、避免误触 */
	.es-toc__close {
		display: none;
	}
}
