/* ------------------------------------------------------------------ *
 * 建築師之路 — 單一課程頁（single course）深色面板
 *
 * 站台 body 是藏青底（#16223E）＋金色字，但 Tutor LMS 自己的卡片、
 * 側欄、彈窗仍是白底；再加上「外觀 → 額外 CSS」把 .tutor-color-black
 * 一律壓成 #e8eaed，白卡上的文字等於隱形（實測對比 1.11～1.87）。
 *
 * 這支樣式只把 Tutor 在課程頁上的「面」改成藏青系，讓那段既有的
 * 淺色文字設定站得住腳，並把連結／按鈕／進度條換成品牌金。
 * 全部包在 body.ar-cs 之下，其他 Tutor 頁面（控制台、我的課程）不受影響。
 * ------------------------------------------------------------------ */

body.ar-cs {
	--arc-navy: #16223e;
	--arc-surface: #1e2c4c;
	--arc-surface-2: #24345a;
	--arc-line: rgba(255, 255, 255, 0.11);
	--arc-line-gold: rgba(242, 177, 52, 0.32);
	--arc-text: #edeae3;
	--arc-muted: #a9b3c7;
	--arc-gold: #f2b134;
	--arc-gold-hover: #ffc457;
}

/* ------------------------------------------------------------------ *
 * 1. 面：所有淺色卡片／面板／彈窗改成藏青
 * ------------------------------------------------------------------ */

body.ar-cs .tutor-card,
body.ar-cs .tutor-sidebar-card,
body.ar-cs .tutor-course-details-instructors,
body.ar-cs .tutor-course-details-widget,
body.ar-cs .tutor-accordion-item,
body.ar-cs .tutor-course-content-list-item,
body.ar-cs .tutor-nav-more-list,
body.ar-cs .tutor-dropdown,
body.ar-cs .tutor-modal-content,
body.ar-cs .tutor-modal-content-white,
body.ar-cs .tutor-empty-state,
body.ar-cs .tutor-comments-list,
body.ar-cs .tutor-quiz-attempt-details {
	background-color: var(--arc-surface) !important;
	border-color: var(--arc-line) !important;
}

/* 卡片內層再深一階，保留原本的層次感 */
body.ar-cs .tutor-card-body,
body.ar-cs .tutor-accordion-item-header,
body.ar-cs .tutor-accordion-item-header.is-active {
	background-color: var(--arc-surface-2) !important;
	border-color: var(--arc-line) !important;
}

body.ar-cs .tutor-card-footer,
body.ar-cs .tutor-accordion-item-body {
	background-color: transparent !important;
	border-color: var(--arc-line) !important;
}

/* 課程大綱：每一列之間的分隔線 */
body.ar-cs .tutor-course-content-list-item {
	border-color: var(--arc-line) !important;
}

/* 內文區塊的 <pre>（原本是 #eee 灰底＋等寬字，黃字對比只有 1.30）
   改成金色左線的重點框，字體跟著內文走、長句可以換行 */
body.ar-cs .tutor-course-details-content pre {
	background-color: rgba(242, 177, 52, 0.1) !important;
	border: 0;
	border-left: 3px solid var(--arc-gold);
	border-radius: 6px;
	color: var(--arc-gold) !important;
	font-family: inherit;
	font-size: 1.05em;
	margin: 28px 0 14px;
	padding: 12px 18px;
	white-space: pre-wrap;
	word-break: break-word;
}

body.ar-cs .tutor-course-details-content blockquote {
	background-color: rgba(255, 255, 255, 0.05);
	border-left: 3px solid var(--arc-gold);
	border-radius: 6px;
	margin: 20px 0;
	padding: 14px 18px;
}

body.ar-cs .tutor-course-details-content blockquote p:last-child {
	margin-bottom: 0;
}

/* 分頁列（課程資訊／公告／更多）：原本是半透明白，落在藏青上會變成一條灰帶 */
body.ar-cs .tutor-course-details-tab .tutor-is-sticky {
	backdrop-filter: blur(6px);
	background-color: rgba(22, 34, 62, 0.92) !important;
	border-bottom: 1px solid var(--arc-line);
}

/* 提示框 */
body.ar-cs .tutor-alert,
body.ar-cs .tutor-alert-warning,
body.ar-cs .tutor-alert.tutor-warning {
	background-color: rgba(242, 177, 52, 0.12) !important;
	border-color: var(--arc-line-gold) !important;
	color: var(--arc-text) !important;
}

/* ------------------------------------------------------------------ *
 * 2. 字：把剩下幾處對比不足的補起來
 * ------------------------------------------------------------------ */

/* 安全網：Tutor 把容器的繼承色設成 #212327（近黑）。目前每一段文字都有
   自己的 .tutor-color-* 類別所以看不出來，但只要之後 Tutor 改版多出一段
   沒帶類別的文字，它就會是近黑字落在藏青底上。先把容器的繼承色換掉。 */
body.ar-cs .tutor-wrap,
body.ar-cs .tutor-card,
body.ar-cs .tutor-card-body,
body.ar-cs .tutor-course-content-list-item,
body.ar-cs .tutor-course-details-widget,
body.ar-cs .tutor-course-details-instructors,
body.ar-cs .tutor-accordion-item,
body.ar-cs .tutor-modal-content {
	color: var(--arc-text) !important;
}

body.ar-cs .tutor-color-black,
body.ar-cs .tutor-color-black *,
body.ar-cs .tutor-course-details-title,
body.ar-cs .tutor-accordion-item-header,
body.ar-cs .tutor-course-details-widget-title {
	color: var(--arc-text) !important;
}

body.ar-cs .tutor-color-secondary,
body.ar-cs .tutor-color-muted,
body.ar-cs .tutor-color-subdued,
body.ar-cs .tutor-course-details-info,
body.ar-cs .tutor-course-details-info *,
body.ar-cs .tutor-course-details-actions .tutor-btn-ghost,
body.ar-cs .tutor-course-content-list-item-duration {
	color: var(--arc-muted) !important;
}

/* 課程介紹本文：原本靠內文硬寫的 #ffcc00，改由這裡統一控色 */
body.ar-cs .tutor-course-details-content > .tutor-color-secondary,
body.ar-cs .tutor-course-details-content > .tutor-color-secondary p,
body.ar-cs .tutor-course-details-content > .tutor-color-secondary li,
body.ar-cs .tutor-course-details-content > .tutor-color-secondary span {
	color: var(--arc-text) !important;
}

body.ar-cs .tutor-course-details-content h1,
body.ar-cs .tutor-course-details-content h2,
body.ar-cs .tutor-course-details-content h3,
body.ar-cs .tutor-course-details-content h4,
body.ar-cs .tutor-course-details-content h5,
body.ar-cs .tutor-course-details-content h6 {
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-course-details-content > .tutor-color-secondary {
	line-height: 1.85;
}

body.ar-cs .tutor-course-details-content ol,
body.ar-cs .tutor-course-details-content ul {
	padding-left: 1.4em;
}

body.ar-cs .tutor-course-details-content li {
	margin-bottom: 10px;
}

/* 課程大綱的堂次連結 */
body.ar-cs .tutor-course-content-list-item a,
body.ar-cs .tutor-accordion-item-header a {
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-course-content-list-item a:hover,
body.ar-cs .tutor-accordion-item-header a:hover {
	color: var(--arc-gold-hover) !important;
}

/* 文字連結型按鈕（登入牆上的「立即註冊」—— 預設藍 #3E64DE 在藏青上只有 3.06）*/
body.ar-cs .tutor-btn-link,
body.ar-cs .tutor-login-wrap a {
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-btn-link:hover,
body.ar-cs .tutor-login-wrap a:hover {
	color: var(--arc-gold-hover) !important;
}

/* 分頁列連結 */
body.ar-cs .tutor-nav-link {
	color: var(--arc-muted) !important;
}

body.ar-cs .tutor-nav-link:hover {
	color: var(--arc-text) !important;
}

body.ar-cs .tutor-nav-link.is-active {
	border-bottom-color: var(--arc-gold) !important;
	color: var(--arc-gold) !important;
}

/* 價格與「已報名」提示 */
body.ar-cs .tutor-course-single-pricing,
body.ar-cs .tutor-course-sidebar-card-pricing .tutor-color-black {
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-color-success {
	color: #6fcf97 !important;
}

/* ------------------------------------------------------------------ *
 * 3. 元件：按鈕、進度條、表單
 * ------------------------------------------------------------------ */

body.ar-cs .tutor-btn-primary {
	background-color: var(--arc-gold) !important;
	border-color: var(--arc-gold) !important;
	color: var(--arc-navy) !important;
}

body.ar-cs .tutor-btn-primary:hover,
body.ar-cs .tutor-btn-primary:focus {
	background-color: var(--arc-gold-hover) !important;
	border-color: var(--arc-gold-hover) !important;
	color: var(--arc-navy) !important;
}

body.ar-cs .tutor-btn-outline-primary,
body.ar-cs .tutor-btn-ghost {
	background-color: transparent !important;
	border-color: var(--arc-line-gold) !important;
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-btn-outline-primary:hover,
body.ar-cs .tutor-btn-ghost:hover {
	background-color: rgba(242, 177, 52, 0.14) !important;
	border-color: var(--arc-gold) !important;
	color: var(--arc-gold-hover) !important;
}

body.ar-cs .tutor-course-details-actions .tutor-btn-ghost {
	border-color: transparent !important;
}

body.ar-cs .tutor-course-details-actions .tutor-btn-ghost:hover {
	color: var(--arc-gold) !important;
}

body.ar-cs .tutor-progress-bar {
	background-color: rgba(255, 255, 255, 0.14) !important;
}

body.ar-cs .tutor-progress-value {
	background-color: var(--arc-gold) !important;
}

body.ar-cs .tutor-form-control,
body.ar-cs .tutor-modal input[type="text"],
body.ar-cs .tutor-modal textarea {
	background-color: rgba(255, 255, 255, 0.06) !important;
	border-color: var(--arc-line) !important;
	color: var(--arc-text) !important;
}

body.ar-cs .tutor-modal-close,
body.ar-cs .tutor-modal-close-o {
	color: var(--arc-muted) !important;
}

/* 講師頭像的白框在深底上會突兀 */
body.ar-cs .tutor-avatar {
	background-color: var(--arc-surface-2) !important;
}