/* 單元講義區（Minach_Handout）。卡片、輪播箭頭、放大檢視沿用主題課程頁的 .minach-handout-* 樣式。 */

/* 單元頁區塊格線沒鎖寬，橫向輪播會把整欄撐開 */
body.single-lesson .minach-lesson-sections__body { grid-template-columns: minmax(0, 1fr); }
body.single-lesson .minach-lesson-panel--handout { min-width: 0; max-width: 100%; }
/* 本檔只在開啟新版講義的單元載入；舊講義文字先藏起來，避免網頁慢時先閃一下舊畫面（主題的單元圖橫幅照常顯示） */
body.single-lesson .minach-lesson-panel--handout > :not(.minach-section-heading):not(.mh-handout):not(.mh-strip-wrap):not(.minach-course-visual--handout-banner) { display: none; }

.mh-handout { margin-top: 18px; min-width: 0; max-width: 100%; overflow: hidden; scroll-margin-top: 84px; }
body.single-lesson #handout a.minach-btn, body.single-lesson #handout .mh-btn { color: #fff !important; }

/* 主題 lesson-f.css 把內容區所有文字強制成 --f-ink2（!important），深底與指定色的字要用 #handout 拉回來 */
body.single-lesson #handout .minach-handout-carousel__arrow,
body.single-lesson #handout .mh-stack__text,
body.single-lesson #handout .mh-stack__text *,
body.single-lesson #handout .mh-unlock,
body.single-lesson #handout .mh-unlock * { color: #fff !important; }
body.single-lesson #handout .mh-unlock .mh-unlock__title em { color: #FFD9A8 !important; }
body.single-lesson #handout .mh-unlock .mh-unlock__sub { color: rgba(255, 255, 255, .82) !important; }
body.single-lesson #handout .mh-lock { color: #875053 !important; }
body.single-lesson .mh-entry a:not(#mh-none) { color: #A85A2E !important; } /* :not(#id) 只為了提高優先權，壓過主題規則 */
.mh-handout .minach-handout-card__caption { display: grid; gap: 2px; }
.mh-handout .minach-handout-card__caption b { font-size: clamp(17px, 1.5vw, 21px) !important; }
.mh-lock { font-size: 13px; font-weight: 700; color: #875053; }
.mh-gold .minach-handout-card__media { outline: 3px solid #BD7B16; outline-offset: -3px; }

.mh-stack { display: block; background: #2b2320; }
.mh-stack__sheet { position: absolute; width: 78%; aspect-ratio: 16 / 9; border-radius: 10px; background-size: 300% 100%;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .35); }
.mh-stack__sheet:nth-child(1) { left: 4%; top: 12%; transform: rotate(-5deg); }
.mh-stack__sheet:nth-child(2) { left: 11%; top: 8%; transform: rotate(2deg); }
.mh-stack__sheet:nth-child(3) { left: 18%; top: 14%; transform: rotate(6deg); }
.mh-stack__text { position: absolute; inset: auto 0 0 0; padding: 14px; text-align: center; color: #fff; font-size: 15px;
	background: linear-gradient(transparent, rgba(30, 22, 20, .9)); }
.mh-stack__text b { display: block; font-size: 24px; }

.mh-push { display: grid; justify-items: center; gap: 8px; margin-top: 18px; padding: 20px; border-radius: 18px; background: #fff;
	border: 1px solid rgba(55, 45, 38, .1); text-align: center; }
.mh-push__title { font-size: 20px; }
.mh-push p { margin: 0; color: #4A423B; font-size: 15px; }
.mh-btn { display: inline-block; padding: 14px 30px; border-radius: 999px; background: #C75432; font-weight: 800; font-size: 18px;
	text-decoration: none; box-shadow: 0 12px 26px rgba(169, 64, 40, .22); }
.mh-btn:hover { background: #A94028; }
body.single-lesson #handout .mh-btn { background: #C75432; }
body.single-lesson #handout .mh-btn:hover { background: #A94028; }

.mh-unlock { position: relative; overflow: hidden; width: 100%; display: grid; justify-items: center; gap: 6px; padding: 20px 16px 18px;
	border-radius: 18px; color: #fff; background: linear-gradient(125deg, #382b27, #74443f 55%, #C75432); }
.mh-unlock:after { content: ""; position: absolute; inset: 0; transform: translateX(-100%);
	background: linear-gradient(100deg, transparent 30%, rgba(255, 255, 255, .22) 50%, transparent 70%); animation: mh-shine 3.8s ease-in-out 1s infinite; }
.mh-unlock__badge { padding: 5px 14px; border-radius: 999px; background: rgba(255, 255, 255, .16); font-size: 14px; font-weight: 800;
	letter-spacing: .06em; animation: mh-pop 3.8s ease-in-out infinite; }
.mh-unlock__title { font-size: clamp(22px, 2.6vw, 30px) !important; line-height: 1.3; color: #fff; }
.mh-unlock__title em { font-style: normal; font-size: 1.45em; color: #FFD9A8; padding: 0 2px; }
.mh-unlock .mh-unlock__sub { color: rgba(255, 255, 255, .82); font-size: 15px; }
.mh-handout .mh-nw { white-space: nowrap; }
.mh-unlock__covers { display: flex; justify-content: center; margin-top: 8px; padding-left: 22px; max-width: 100%; }
.mh-unlock__covers img { width: clamp(76px, 12vw, 128px); aspect-ratio: 16 / 9; object-fit: cover; margin-left: -22px; border-radius: 8px;
	border: 2px solid rgba(255, 255, 255, .85); box-shadow: 0 6px 16px rgba(0, 0, 0, .3); opacity: 0; transform: translateY(14px) rotate(-4deg); }
.mh-unlock.is-in .mh-unlock__covers img { animation: mh-in .5s cubic-bezier(.2, .8, .3, 1.2) forwards; animation-delay: calc(var(--i) * 90ms); }
@keyframes mh-in { to { opacity: 1; transform: translateY(0) rotate(0); } }
@keyframes mh-shine { 0% { transform: translateX(-100%); } 45%, 100% { transform: translateX(100%); } }
@keyframes mh-pop { 0%, 80%, 100% { transform: scale(1); } 88% { transform: scale(1.08); } }
@media (prefers-reduced-motion: reduce) {
	.mh-unlock:after, .mh-unlock__badge { animation: none; }
	.mh-unlock__covers img { opacity: 1; transform: none; animation: none !important; }
}

.mh-entry { margin: 12px 0; padding: 10px 14px; border-radius: 12px; background: #F8E9DF; text-align: center; }
.mh-entry a { color: #A85A2E; font-weight: 800; text-decoration: none; }

/* 輪播箭頭：電腦、手機都壓在卡片左右，圓圈底色全透明、去掉陰影，白框與白箭頭外加 1px 半透明深咖啡描邊
   （電腦版 Boss 11/13 Q1、Q2 方案 A；手機改回同一套 Boss 11/14 Q4 方案 A）。大小照主題：電腦 48、手機 44。
   第一張不顯示「‹」、最後一張不顯示「›」由 JS 控制，報名卡（永遠最後一張）的條列字不會被「›」蓋到 */
body.single-lesson #handout .minach-handout-carousel__arrow { background: transparent; box-shadow: 0 0 0 1px rgba(60, 35, 25, .68), inset 0 0 0 1px rgba(60, 35, 25, .68);
	text-shadow: 1px 0 0 rgba(60, 35, 25, .68), -1px 0 0 rgba(60, 35, 25, .68), 0 1px 0 rgba(60, 35, 25, .68), 0 -1px 0 rgba(60, 35, 25, .68); }

/* 卡上不放「點擊放大」浮標：手機改框下一顆按鈕（跟著目前那張換字），電腦改一行小字（Boss 11/14 Q2、Q4 方案 A） */
.mh-zoom-btn { display: none; }
.mh-zoom-hint { margin: 2px 0 0; text-align: center; font-size: 14px; }
body.single-lesson #handout .mh-zoom-hint { color: #6F6861 !important; }
@media (max-width: 640px) {
	.mh-zoom-hint { display: none; }
	.mh-zoom-btn { display: flex; align-items: center; justify-content: center; box-sizing: border-box; width: min(100%, 300px); min-height: 48px; margin: 2px auto 0;
		padding: 10px 20px; border: 2px solid #3C2319; border-radius: 999px; background: #fff; font-size: 17px; font-weight: 800; text-decoration: none;
		-webkit-tap-highlight-color: transparent; }
	body.single-lesson #handout .mh-zoom-btn { color: #3C2319 !important; }
	.mh-zoom-btn--buy { border-color: #C75432; background: #C75432; box-shadow: 0 10px 22px rgba(169, 64, 40, .22); }
	body.single-lesson #handout .mh-zoom-btn--buy { color: #fff !important; }
}

/* ── A-1（Boss 11/13）：講義標題正下方一條＋底部滑上的認證視窗 ── */
/* 主題把內容區文字強制成深色（!important）：條上的字色用 .mh-strip-wrap 拉回來 */
.mh-strip-wrap { display: grid; gap: 8px; margin: 12px 0 4px; scroll-margin-top: 130px; }
.mh-strip { display: flex; align-items: center; gap: 12px; width: 100%; min-height: 64px; padding: 10px 10px 10px 16px; border-radius: 16px;
	border: 2px solid #C75432; background: #FBF3EA; text-align: left; font: inherit; cursor: pointer; box-shadow: 0 6px 18px rgba(60, 35, 25, .1); }
.mh-strip--dl { border-color: #2F9E6B; background: #F1FAF5; cursor: default; }
.mh-strip__text { flex: 1; min-width: 0; display: grid; gap: 2px; line-height: 1.35; }
body.single-lesson .mh-strip-wrap .mh-strip__text b { font-size: 16px; }
body.single-lesson .mh-strip-wrap .mh-strip__text b, body.single-lesson .mh-strip-wrap .mh-strip__text b * { color: #3C2319 !important; }
body.single-lesson .mh-strip-wrap .mh-strip__text small { font-size: 13px; color: #6F6861 !important; }
.mh-strip__btn { flex: none; padding: 11px 22px; border-radius: 999px; background: #C75432; font-weight: 800; font-size: 16px; text-decoration: none; }
.mh-strip--dl .mh-strip__btn { background: #2F9E6B; }
body.single-lesson .mh-strip-wrap .mh-strip__btn { color: #fff !important; }
.mh-strip--dl .mh-strip__btn:hover { background: #24805A; }
.mh-strip--claim:hover .mh-strip__btn { background: #A94028; }
.mh-strip__more { display: block; padding: 8px 14px; border-radius: 12px; background: #fff; text-align: center; text-decoration: none; font-size: 14px;
	box-shadow: 0 2px 8px rgba(60, 35, 25, .08); }
body.single-lesson .mh-strip-wrap .mh-strip__more, body.single-lesson .mh-strip-wrap .mh-strip__more span { color: #875053 !important; }
body.single-lesson .mh-strip-wrap .mh-strip__more b { color: #C75432 !important; }
.mh-strip__ios { margin: 0; font-size: 12px; text-align: center; }
body.single-lesson .mh-strip-wrap .mh-strip__ios { color: #6F6861 !important; }
.mh-strip-wrap .mh-nw { white-space: nowrap; }
/* 電腦版下載條：標題和「儲存到電腦，可隨時翻閱！」排同一行，右邊不空（Boss 11/14 施工單 6）。
   寬度不夠就自然換到第二行；「下載」按鈕不縮（flex: none），不會被擠。手機維持兩行 */
@media (min-width: 641px) {
	.mh-strip--dl .mh-strip__text { display: flex; flex-wrap: wrap; align-items: baseline; column-gap: 16px; row-gap: 2px; }
}
.mh-strip.is-flash { animation: mh-flash 1.4s ease-out 2; }
@keyframes mh-flash { 0% { box-shadow: 0 0 0 0 rgba(47, 158, 107, .55); } 100% { box-shadow: 0 0 0 14px rgba(47, 158, 107, 0); } }

.mh-sheet-backdrop { position: fixed; inset: 0; z-index: 100000; background: rgba(30, 20, 15, 0); transition: background .2s; }
.mh-sheet-backdrop.is-open { background: rgba(30, 20, 15, .55); }
.mh-sheet { position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto; max-width: 480px; overflow-y: auto; padding: 10px 20px calc(22px + env(safe-area-inset-bottom, 0px));
	border-radius: 22px 22px 0 0; background: #fff; color: #3C2319; box-shadow: 0 -10px 40px rgba(0, 0, 0, .25); transform: translateY(105%);
	transition: transform .22s ease-out; font-size: 15px; line-height: 1.5; }
.mh-sheet-backdrop.is-open .mh-sheet { transform: translateY(0); }
@media (min-width: 641px) { .mh-sheet { bottom: 50% !important; transform: translateY(60%); border-radius: 22px; } .mh-sheet-backdrop.is-open .mh-sheet { transform: translateY(50%); } }
@media (prefers-reduced-motion: reduce) { .mh-sheet, .mh-sheet-backdrop { transition: none; } }
.mh-sheet__grab { width: 44px; height: 5px; margin: 0 auto 10px; border-radius: 9px; background: #D8CFC6; }
.mh-sheet__close { position: absolute; top: 10px; right: 12px; width: 34px; height: 34px; border: 0; border-radius: 50%; background: #F1EAE3; color: #6F6861;
	font-size: 16px; cursor: pointer; }
.mh-sheet__body { display: grid; gap: 12px; }
.mh-sheet__row { display: flex; gap: 12px; align-items: center; padding-right: 30px; }
.mh-sheet__cover { width: 76px; height: 96px; flex: none; object-fit: cover; object-position: top; border-radius: 8px; box-shadow: 0 2px 8px rgba(0, 0, 0, .2); }
.mh-sheet__title { margin: 0 0 2px; font-size: 20px; line-height: 1.35; color: #3C2319; }
.mh-sheet__tip { margin: 0; font-size: 13px; color: #6F6861; }
.mh-sheet__limit { margin: 4px 0 0; font-size: 13px; font-weight: 700; color: #A94028; }
.mh-sheet .mh-nw { white-space: nowrap; }
.mh-sheet__form { display: grid; gap: 10px; }
.mh-sheet__form input { width: 100%; box-sizing: border-box; padding: 12px 14px; border: 2px solid #D8CFC6; border-radius: 12px; font-size: 16px; color: #3C2319; background: #fff; }
.mh-sheet__form input:focus { outline: none; border-color: #C75432; }
.mh-sheet__submit { width: 100%; padding: 13px 18px; border: 0; border-radius: 999px; background: #C75432; color: #fff; font-size: 17px; font-weight: 800; cursor: pointer; }
.mh-sheet__submit:disabled { opacity: .7; cursor: wait; }
.mh-sheet__submit--go { background: #2F9E6B; }
/* 認證結果訊息一律水平置中，跟上面滿版的「解鎖講義」按鈕對齊（Boss 11/14 施工單 5） */
.mh-sheet__msg { margin: 0; color: #A94028; font-weight: 700; font-size: 14px; text-align: center; }
.mh-sheet__msg:empty { display: none; }
.mh-sheet__msg a { color: #A94028; text-decoration: underline; text-underline-offset: 3px; }
/* 逾期句：只用深藍色粗體字，不要底色、不要框（Boss 11/14 施工單 6），和橘色「解鎖講義」按鈕明顯不同；滑鼠移上去加底線（白底對比 6.7） */
.mh-sheet__msg a.mh-sheet__again { color: #1E5BA8; font-size: 16px; font-weight: 800; text-decoration: none; }
.mh-sheet__msg a.mh-sheet__again:hover, .mh-sheet__msg a.mh-sheet__again:focus-visible { text-decoration: underline; text-underline-offset: 3px; }
/* 被擋與提醒的字（Boss 11/14 施工單 7）：逗號後分段，電腦一行、手機兩行，不會有單一個字掉到下一行 */
.mh-sheet__msg .mh-sheet__line { display: block; }
.mh-sheet__msg .mh-seg { white-space: nowrap; }
@media (max-width: 640px) { .mh-sheet__msg .mh-seg { display: block; } }
.mh-sheet__msg a.mh-sheet__buy, .mh-sheet__msg a.mh-sheet__go { display: inline-block; margin-top: 10px; padding: 10px 24px; border-radius: 999px;
	font-size: 16px; font-weight: 800; text-decoration: none; }
.mh-sheet__msg a.mh-sheet__buy { background: #C75432; color: #fff; }
.mh-sheet__msg a.mh-sheet__buy:hover { background: #A94028; }
.mh-sheet__msg a.mh-sheet__go { padding: 8px 22px; border: 2px solid #C75432; background: #fff; color: #C75432; }
.mh-sheet__msg a.mh-sheet__go:hover { background: #FDF1EC; }
.mh-sheet__challenge { display: flex; justify-content: center; margin-top: 4px; }
/* 驗證方框上方那行（Stitch 11/14 核准）：字色、大小比照「需在留言後 1 天內認證領取」，置中一行 */
.mh-sheet__msg .mh-sheet__click { display: block; font-size: 13px; font-weight: 700; color: #A94028; white-space: nowrap; }
.mh-sheet__alt { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; padding-top: 12px; border-top: 1px dashed #D8CFC6; font-size: 15px; }
.mh-sheet__alt a, .mh-sheet__look { font: inherit; color: #A85A2E; font-weight: 700; text-decoration: none; background: none; border: 0; padding: 0; cursor: pointer; }
.mh-sheet__done { display: grid; justify-items: center; gap: 10px; padding: 8px 0 6px; text-align: center; }
.mh-sheet__check { font-size: 44px; line-height: 1; }