/*!
 * SimpleLearn Site — 固定頁首（0.5.0；0.5.1 修正頁首變矮造成的閃爍）
 * 只在「設定 → SimpleLearn → 固定頁首」勾選時載入。
 * body class：sls-sticky-on（開關）、sls-hdr-scrolled（已捲動，頁首變矮）、sls-hdr-hidden（往下捲，頁首收起）。
 * --sls-ab：登入時 WordPress 工具列高度；--sls-top：目前畫面上方被固定元素佔用的高度（由 JS 更新）。
 */
.sls-sticky-on { --sls-ab: 0px; }
.admin-bar.sls-sticky-on { --sls-ab: 32px; }
@media (max-width: 782px) { .admin-bar.sls-sticky-on { --sls-ab: 46px; } }
@media (max-width: 600px) { .admin-bar.sls-sticky-on { --sls-ab: 0px; } } /* 小螢幕的 WordPress 工具列不固定 */

.sls-sticky-on #header {
	position: sticky; top: var(--sls-ab); z-index: 60;
	transition: transform .28s ease, box-shadow .2s ease, margin-bottom .2s ease;
}
.sls-sticky-on #header [data-row="middle"] > .ct-container { transition: min-height .2s ease; }
.sls-sticky-on.sls-hdr-scrolled #header { box-shadow: 0 10px 24px -18px rgba(28, 42, 54, .45); }

/* 捲動後頁首變矮：電腦版 80 → 64px、手機 70 → 56px。
   以同樣大小的下邊距補回高度差，頁面內容不會跟著上移（避免瀏覽器自動修正捲動位置，誤觸發頁首出現）。 */
.sls-sticky-on.sls-hdr-scrolled #header [data-device="desktop"] [data-row="middle"] { --height: 64px !important; }
.sls-sticky-on.sls-hdr-scrolled #header [data-device="mobile"] [data-row="middle"] { --height: 56px !important; }
@media (min-width: 1000px) { .sls-sticky-on.sls-hdr-scrolled #header { margin-bottom: 16px; } }
@media (max-width: 999.98px) { .sls-sticky-on.sls-hdr-scrolled #header { margin-bottom: 14px; } }
.sls-sticky-on.sls-hdr-scrolled #header [data-device="desktop"] .site-logo-container img { max-height: 34px; width: auto; }

/* 往下捲：收起（連同工具列高度一起移出畫面）；大選單面板跟著關閉 */
.sls-sticky-on.sls-hdr-hidden #header { transform: translateY(calc(-100% - var(--sls-ab))); box-shadow: none; }
.sls-sticky-on.sls-hdr-hidden .sls-mega { visibility: hidden !important; opacity: 0 !important; }

/* 閱讀進度條（單篇文章，JS 插入在頁首下緣） */
.sls-progress {
	position: absolute; left: 0; right: 0; bottom: -1px; height: 3px; pointer-events: none;
	background: #0e7378; transform-origin: 0 50%; transform: scaleX(var(--sls-p, 0));
}

/* 其他固定元素避開頁首 */
@media (min-width: 1100px) {
	.sls-sticky-on .sl-toc-side,
	.admin-bar.sls-sticky-on .sl-toc-side {
		top: calc(var(--sls-top, 0px) + 24px); max-height: calc(100vh - var(--sls-top, 0px) - 48px);
		transition: top .28s ease;
	}
}
.sls-sticky-on :is(.sl-site, .sl-ftr) .sl-prose .sl-jumpnav,
.admin-bar.sls-sticky-on :is(.sl-site, .sl-ftr) .sl-prose .sl-jumpnav { top: var(--sls-top, 0px); transition: top .28s ease; }
/* 錨點跳轉時標題不被頁首蓋住（以變矮後的頁首高度計算） */
.sls-sticky-on .sl-prose :where(h2, h3, h4) { scroll-margin-top: calc(var(--sls-ab) + 88px); }
.sls-sticky-on :is(.sl-site, .sl-ftr) .sl-prose:has(.sl-jumpnav) h2 { scroll-margin-top: calc(var(--sls-ab) + 140px); }

@media (prefers-reduced-motion: reduce) {
	.sls-sticky-on #header,
	.sls-sticky-on #header [data-row="middle"] > .ct-container,
	.sls-sticky-on .sl-toc-side,
	.sls-sticky-on .sl-jumpnav { transition: none !important; }
}
@media print {
	.sls-sticky-on #header { position: static; transform: none; box-shadow: none; }
	.sls-progress { display: none; }
}
