@charset "utf-8";
/* WCAG 1.4.1 / CS1140101E — 鍵盤焦點須有明顯可辨識的呈現方式 */

/* 滑鼠點擊不顯示焦點框（支援 :focus-visible 的瀏覽器） */
a:focus:not(:focus-visible),
button:focus:not(:focus-visible),
input:focus:not(:focus-visible),
select:focus:not(:focus-visible),
textarea:focus:not(:focus-visible),
[tabindex]:focus:not(:focus-visible),
summary:focus:not(:focus-visible) {
	outline: none;
}

/* 鍵盤焦點 — 通用連結與可聚焦元素 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
summary:focus-visible {
	outline: 3px dotted #b9261e;
	outline-offset: 2px;
}

/* 不支援 :focus-visible 的瀏覽器 fallback */
@supports not selector(:focus-visible) {
	a:focus,
	button:focus,
	input:focus,
	select:focus,
	textarea:focus,
	[tabindex]:focus,
	summary:focus {
		outline: 3px dotted #b9261e;
		outline-offset: 2px;
	}
}

/* 主導覽列（紫色背景需高對比） */
.menu a:focus,
.menu a:focus-visible,
#header .menu a:focus,
#header .menu a:focus-visible {
	outline: 3px dotted #ffffff !important;
	outline-offset: 2px;
	background-color: rgba(255, 255, 255, 0.25) !important;
	color: #ffffff !important;
	text-decoration: underline;
}

/* 頁首輔助導覽 */
.nav a:focus,
.nav a:focus-visible,
#header .nav a:focus,
#header .nav a:focus-visible {
	outline: 3px dotted #ffffff;
	outline-offset: 2px;
	background-color: rgba(0, 118, 160, 0.2);
}

/* 最新消息／志工故事側欄導覽 */
.news-menu a:focus,
.news-menu a:focus-visible {
	outline: 3px dotted #172a88;
	outline-offset: 2px;
	color: #fff !important;
	background-color: #172a88 !important;
	text-decoration: none;
}

/* 頁尾導覽（深色／藍色背景） */
.farfooter-nav a:focus,
.farfooter-nav a:focus-visible,
.footer-mian-menu a:focus,
.footer-mian-menu a:focus-visible,
.footer-menu a:focus,
.footer-menu a:focus-visible {
	outline: 3px dotted #ffffff;
	outline-offset: 2px;
	color: #ffffff !important;
}

/* 字級／分享等頂部工具列 */
.web2 a:focus,
.web2 a:focus-visible,
.search-btn a:focus,
.search-btn a:focus-visible {
	outline: 3px dotted #ffffff;
	outline-offset: 2px;
	box-shadow: 0 0 0 2px #fff;
}

/* Bootstrap 按鈕（覆寫 outline:0，保留 box-shadow 並加強外框） */
.btn:focus-visible,
.btn.focus {
	outline: 3px dotted #0076a0 !important;
	outline-offset: 2px;
	box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.35) !important;
}

/* 自訂色塊按鈕 */
.orange-btn:focus-visible,
.purple-btn:focus-visible,
.green-btn2:focus-visible,
.Pink-btn:focus-visible,
.search-btn:focus-visible,
.td-pink-btn a:focus-visible {
	outline: 3px dotted #ffffff;
	outline-offset: 2px;
	box-shadow: 0 0 0 2px #fff;
}

/* 分頁籤 */
.nav-tabs > li > a:focus-visible {
	outline: 3px dotted #0076a0;
	outline-offset: 2px;
	background-color: #eee;
}

.vac-tabs .nav-tabs > li > a:focus-visible {
	outline: 3px dotted #ffffff;
	outline-offset: 2px;
}

/* 無障礙快速鍵（維持既有顯示邏輯並加強） */
.accesskey:focus-visible,
#header .accesskey:focus-visible {
	opacity: 1;
	border: 2px dotted #b9261e;
	outline: 3px dotted #b9261e;
	outline-offset: 2px;
	z-index: 2;
}

/* a11y migration overrides: <a> → <button> swaps for in-page controls (audit GN1410200E).
   原本選擇器是 .owl-prev a / .index_prev a 等；改成 <button> 後保留所有既有尺寸/邊框規則，
   只在這裡把 <button> 預設的灰底、padding、字型等系統樣式清掉。 */
.owl-prev button,
.owl-next button,
.index_prev button,
.index_next button {
	background: transparent;
	padding: 0;
	font: inherit;
	color: inherit;
	cursor: pointer;
}

/* 漢堡選單觸發鈕：完全等同原本 <a href="#" title="選單"> 的視覺 */
.hamburger-btn {
	background: transparent;
	border: 0;
	padding: 0;
	margin: 0;
	color: inherit;
	font: inherit;
	cursor: pointer;
}

/* 字級切換鈕：原本 <a role="button"> 沒視覺背景，<button> 預設有 → 清掉 */
.font_t ~ button[onclick^="font"],
button[onclick^="font1"],
button[onclick^="font2"],
button[onclick^="font3"] {
	background: transparent;
	border: 0;
	padding: 0 4px;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
button[onclick^="font"][aria-pressed="true"] {
	text-decoration: underline;
	font-weight: bold;
}