/* ==========================================================================
   跟書學東方宣紙手稿與排版組件正典美學覆寫層 (Joe Parchment & Ink Component Skin)
   版本: v1.0.0
   定位: 全面確立溫潤宣紙白(#FAF7F2)、古籍松煙墨(#2A2421)、沉香金(#9E7A36)案頭典籍美學。
   ========================================================================== */

/* --------------------------------------------------------------------------
   一、 正文文字節律與大標題排版 (Headings, Leading & Hierarchy)
   -------------------------------------------------------------------------- */
.joe_detail__article {
	font-size: 16px !important;
	line-height: 1.8 !important;
	color: #2A2421 !important;
}

/* 標題行高與案頭典雅層級 */
.joe_detail__article h1,
.joe_detail__article h2,
.joe_detail__article h3,
.joe_detail__article h4 {
	color: #1A1614 !important;
	font-weight: 600 !important;
	position: relative;
}

.joe_detail__article h1 {
	font-size: 24px !important;
	line-height: 1.35 !important;
	margin-top: 36px !important;
	margin-bottom: 20px !important;
	padding-left: 0 !important;
}
.joe_detail__article h1::before {
	display: none !important;
}

/* H2 標題：沉香金豎線裝飾，健康黃金行高 */
.joe_detail__article h2 {
	font-size: 20px !important;
	line-height: 1.4 !important;
	margin-top: 32px !important;
	margin-bottom: 16px !important;
	padding-left: 14px !important;
}
.joe_detail__article h2::before {
	content: '' !important;
	position: absolute !important;
	top: 15% !important;
	bottom: 15% !important;
	left: 0 !important;
	width: 4px !important;
	border-radius: 2px !important;
	background: #9E7A36 !important;
}

/* H3 標題：雅致小豎線 */
.joe_detail__article h3 {
	font-size: 17px !important;
	line-height: 1.45 !important;
	margin-top: 24px !important;
	margin-bottom: 12px !important;
	padding-left: 12px !important;
}
.joe_detail__article h3::before {
	content: '' !important;
	position: absolute !important;
	top: 10% !important;
	bottom: 10% !important;
	left: 0 !important;
	width: 3px !important;
	border-radius: 1.5px !important;
	background: #9E7A36 !important;
}

/* H4 標題：東方直角引號改為沉香金 */
.joe_detail__article h4 {
	font-size: 15px !important;
	line-height: 1.5 !important;
	margin-top: 18px !important;
	margin-bottom: 10px !important;
}
.joe_detail__article h4::before,
.joe_detail__article h4::after {
	color: #9E7A36 !important;
	font-weight: 600 !important;
}

/* H5/H6 文本樣式純化 */
.joe_detail__article h5::before,
.joe_detail__article h6::before {
	display: none !important;
}
.joe_detail__article h5,
.joe_detail__article h6 {
	padding-left: 0 !important;
	color: #554D47 !important;
}

/* 正文段落呼吸 */
.joe_detail__article p {
	line-height: 1.85 !important;
	margin-bottom: 18px !important;
	color: #2A2421 !important;
}

/* 金句下劃線 */
.joe_detail__article u {
	text-decoration: none !important;
	border-bottom: 2px solid rgba(158, 122, 54, 0.45) !important;
	padding-bottom: 1px !important;
	color: #1A1614 !important;
}

/* --------------------------------------------------------------------------
   二、 引用塊與行內標記 (Blockquote & Code)
   -------------------------------------------------------------------------- */

/* 引用框典籍手記風格 */
.joe_detail__article blockquote {
	background: rgba(158, 122, 54, 0.05) !important;
	border: 1px solid rgba(158, 122, 54, 0.2) !important;
	border-left: 4px solid #9E7A36 !important;
	border-radius: 4px !important;
	color: #38312C !important;
	padding: 12px 18px !important;
	line-height: 1.75 !important;
	margin: 20px 0 !important;
}
.joe_detail__article blockquote p {
	color: #38312C !important;
	margin-bottom: 0 !important;
}

/* 行內代碼柔和標記 */
.joe_detail__article code:not([class]) {
	background: rgba(42, 36, 33, 0.05) !important;
	color: #7D3E2B !important;
	border: 1px solid rgba(158, 122, 54, 0.15) !important;
	border-radius: 3px !important;
	padding: 2px 6px !important;
	font-size: 13px !important;
	font-family: inherit !important;
}

/* 正文超鏈接古董赭石色 */
.joe_detail__article a:not([class]) {
	color: #7D3E2B !important;
	text-decoration: none !important;
	border-bottom: 1px dotted rgba(125, 62, 43, 0.4) !important;
	transition: color 0.25s, border-bottom-color 0.25s !important;
}
.joe_detail__article a:not([class]):hover {
	color: #9E7A36 !important;
	border-bottom: 1px solid #9E7A36 !important;
}
.joe_detail__article a:not([class])::after {
	display: none !important;
}

/* --------------------------------------------------------------------------
   三、 核心短代碼組件覆寫 (Shortcodes Modernization)
   -------------------------------------------------------------------------- */

/* 1. 原生手風琴折疊 ({collapse}) */
.joe_collapse {
	line-height: 1.75 !important;
	margin: 20px 0 !important;
}
.joe_collapse__item {
	margin-bottom: 12px !important;
	border: 1px solid rgba(158, 122, 54, 0.2) !important;
	border-radius: 6px !important;
	overflow: hidden !important;
	background: #FAF7F2 !important;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02) !important;
}
.joe_collapse__item-head {
	background: rgba(158, 122, 54, 0.04) !important;
	padding: 12px 16px !important;
	color: #1A1614 !important;
	font-weight: 500 !important;
	font-size: 15px !important;
	transition: background 0.25s !important;
}
.joe_collapse__item-head:hover {
	background: rgba(158, 122, 54, 0.08) !important;
}
.joe_collapse__item-head--icon {
	fill: #9E7A36 !important;
}
.joe_collapse__item-wrapper--content {
	padding: 14px 18px !important;
	background: #FAF7F2 !important;
	color: #2A2421 !important;
	font-size: 15px !important;
	line-height: 1.8 !important;
	border-top: 1px solid rgba(158, 122, 54, 0.12) !important;
}

/* 2. 翡翠時光軸 ({timeline}) */
.joe_timeline {
	margin: 22px 0 !important;
	line-height: 1.75 !important;
}
.joe_timeline__item-tail {
	border-left: 2px solid rgba(158, 122, 54, 0.22) !important;
	left: 5px !important;
}
.joe_timeline__item-circle {
	width: 12px !important;
	height: 12px !important;
	border: 2px solid #5A8F76 !important;
	background-color: #FAF7F2 !important;
	left: 0 !important;
	top: 5px !important;
}
.joe_timeline__item-content {
	padding-left: 26px !important;
	color: #2A2421 !important;
	font-size: 15px !important;
}

/* 3. 宣紙名牌卡 ({card-describe}) */
.joe_card__describe {
	border: 1px solid rgba(158, 122, 54, 0.3) !important;
	border-radius: 6px !important;
	background: #FAF7F2 !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
	margin: 24px 0 !important;
	position: relative !important;
}
.joe_card__describe-title {
	background: #FAF7F2 !important;
	color: #9E7A36 !important;
	font-weight: 600 !important;
	font-size: 14px !important;
	padding: 0 8px !important;
	max-width: none !important;
	white-space: normal !important;
	text-overflow: clip !important;
	border-left: 3px solid #9E7A36 !important;
	left: 12px !important;
}
.joe_card__describe-content {
	padding: 18px 16px 14px !important;
	color: #2A2421 !important;
	line-height: 1.8 !important;
	font-size: 15px !important;
}

/* 4. 選項卡 ({tabs}) */
.joe_tabs {
	border: 1px solid rgba(158, 122, 54, 0.22) !important;
	border-radius: 6px !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02) !important;
	background: #FAF7F2 !important;
	margin: 22px 0 !important;
}
.joe_tabs__head {
	background: rgba(158, 122, 54, 0.05) !important;
	border-bottom: 1px solid rgba(158, 122, 54, 0.15) !important;
}
.joe_tabs__head-item {
	color: #554D47 !important;
	font-weight: 500 !important;
}
.joe_tabs__head-item.active {
	color: #9E7A36 !important;
	font-weight: 600 !important;
}
.joe_tabs__head-item::after {
	background: #9E7A36 !important;
	height: 2px !important;
}
.joe_tabs__body-item {
	padding: 16px 18px !important;
	color: #2A2421 !important;
	line-height: 1.8 !important;
}

/* 5. 書籤批註 ({callout}) */
.joe_callout {
	border-radius: 4px !important;
	border: 1px solid rgba(158, 122, 54, 0.2) !important;
	border-left-width: 4px !important;
	background: rgba(158, 122, 54, 0.04) !important;
	color: #2A2421 !important;
	margin: 20px 0 !important;
	padding: 14px 18px !important;
	line-height: 1.8 !important;
}

/* 6. 綜合檔案卡 ({card-default}) */
.joe_card__default {
	border: 1px solid rgba(158, 122, 54, 0.25) !important;
	border-radius: 6px !important;
	background: #FAF7F2 !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.02) !important;
	margin: 22px 0 !important;
}
.joe_card__default-title {
	background: rgba(158, 122, 54, 0.06) !important;
	color: #1A1614 !important;
	font-weight: 600 !important;
	border-bottom: 1px solid rgba(158, 122, 54, 0.15) !important;
	padding: 10px 16px !important;
}
.joe_card__default-content {
	padding: 14px 16px !important;
	color: #2A2421 !important;
	line-height: 1.8 !important;
}

/* 7. 導流按鈕 ({abtn}) */
.joe_detail__article-abtn {
	background: #9E7A36 !important;
	color: #FFFFFF !important;
	border-radius: 4px !important;
	padding: 10px 22px !important;
	font-weight: 500 !important;
	box-shadow: 0 2px 8px rgba(158, 122, 54, 0.25) !important;
	text-decoration: none !important;
	display: inline-block !important;
	transition: background 0.25s, transform 0.25s !important;
}
.joe_detail__article-abtn:hover {
	background: #7D3E2B !important;
	transform: translateY(-2px) !important;
	color: #FFFFFF !important;
}

/* 8. 插圖優雅邊界與典藏感 */
.joe_detail__article img:not([class]) {
	border-radius: 4px !important;
	border: 1px solid rgba(0, 0, 0, 0.06) !important;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.03) !important;
	margin: 20px auto !important;
}