@charset "utf-8";
/* ============================================================================
   Bootstrap 3 → 5 相容性補丁 (bs3-compat.css)
   ----------------------------------------------------------------------------
   用途:
   本站原以 Bootstrap 3.2.0 開發,升級至 Bootstrap 5.3.8 後,BS5 移除或改變了
   一批 BS3 的預設樣式與 class。網站原有 CSS(base.css / style.css / *_rwd.css)
   當年是「依賴 BS3 提供這些預設值」而撰寫的,並未重複定義,升級後這些預設值消失,
   導致版面錯亂。

   本檔的作用是把「BS5 移除掉、但本站 HTML 仍在使用」的 BS3 行為補回來,
   讓既有的數十個 PHP 頁面不必逐一修改 class 名稱(降低漏改與改壞的風險)。

   載入順序(重要):
       bootstrap.min.css  →  [本檔]  →  base.css / style.css / *_rwd.css
   本檔必須在 Bootstrap 之後(才能覆蓋 BS5 預設值),
   且在網站自訂 CSS 之前(讓網站原有設計樣式維持最高優先權)。

   建立日期: 2026/08/24  (重切版 Part 2:升級 Bootstrap 3 → 5)
   ========================================================================== */


/* --------------------------------------------------------------------------
   1. 連結底線
   BS5 的 reboot 將 a 預設改為 text-decoration: underline;
   BS3 預設為 none。本站設計全站皆無底線。
   -------------------------------------------------------------------------- */
a {
	text-decoration: none;
}


/* --------------------------------------------------------------------------
   [已移除] .navbar / .navbar-nav / .dropdown / .list-inline / .form-inline

   導覽列(navbar)區塊已於 2026/08/24 改用 Bootstrap 5 原生寫法重做:
     - .navbar 加上 .navbar-expand-xl(桌機水平展開、手機自動隱藏 toggler)
     - .navbar-toggle → .navbar-toggler
     - <li> 加 .nav-item .dropdown、<a> 加 .nav-link
     - 下拉選項改用 .dropdown-item(不再依賴 .dropdown-menu > li > a)
     - .list-inline 的 <li> 補上 .list-inline-item
     - .form-inline → .d-flex / .d-inline-flex 工具類
     - <select> 改用 .form-select
     - 移除 .caret,改用 BS5 的 .dropdown-toggle::after 原生箭頭
     - hover 展開改為在 .dropdown-menu 上加 .show(BS5 的展開狀態 class)
   對應的版面樣式已寫入 style.css / style_rwd.css,故此處不再需要相容規則。

   其餘尚未改寫的區塊(內容區、側欄、頁尾等)仍暫時依賴以下相容規則,
   待各區塊逐一改為 BS5 原生寫法後,對應規則即可一併移除。
   -------------------------------------------------------------------------- */


/* --------------------------------------------------------------------------
   .form-group / .control-label(BS5 已移除,內容區表單仍在使用)
   -------------------------------------------------------------------------- */
.form-group {
	margin-bottom: 15px;
}

.control-label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 5px;
	font-weight: 700;
}


/* --------------------------------------------------------------------------
   按鈕:.btn-default / .btn-xs(BS5 已移除)
   本站多處使用 .btn-default;style.css 對 .header .navbar .btn-default 另有
   自訂配色,會在本檔之後載入而覆蓋此處,屬預期行為。
   -------------------------------------------------------------------------- */
.btn-default {
	color: #333;
	background-color: #fff;
	border-color: #ccc;
}

.btn-default:hover,
.btn-default:focus,
.btn-default:active {
	color: #333;
	background-color: #e6e6e6;
	border-color: #adadad;
}

.btn-xs {
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	border-radius: 3px;
}


/* --------------------------------------------------------------------------
   8. 顯示/隱藏工具類(BS5 已移除 .hidden / .visible-* / .hidden-*)
   本站多處使用 class="hidden" 控制側欄等元素顯示。
   -------------------------------------------------------------------------- */
.hidden {
	display: none !important;
}

/* 註:此處刻意「不」定義 .show。
   BS3 的 .show 與 BS5 的 .show 意義不同 —— BS5 用 .show 表示 collapse/dropdown/modal
   的展開狀態,若在此加上 .show{display:block!important} 會強制覆蓋 BS5 元件的顯示邏輯
   (例如 .fade.show 是控制 opacity、.dropdown-menu.show 由 BS5 自行處理),
   反而造成下拉選單、手風琴行為異常。 */

.invisible {
	visibility: hidden;
}

.center-block {
	display: block;
	margin-right: auto;
	margin-left: auto;
}

.pull-right {
	float: right !important;
}

.pull-left {
	float: left !important;
}

.img-circle {
	border-radius: 50%;
}

.img-rounded {
	border-radius: 6px;
}

/* BS3 響應式顯示工具類 */
@media (max-width: 767px) {
	.hidden-xs { display: none !important; }
	.visible-xs { display: block !important; }
}

@media (min-width: 768px) and (max-width: 991px) {
	.hidden-sm { display: none !important; }
	.visible-sm { display: block !important; }
}

@media (min-width: 992px) and (max-width: 1199px) {
	.hidden-md { display: none !important; }
	.visible-md { display: block !important; }
}

@media (min-width: 1200px) {
	.hidden-lg { display: none !important; }
	.visible-lg { display: block !important; }
}


/* --------------------------------------------------------------------------
   9. .embed-responsive(BS5 改為 .ratio)
   本站影音專區 YouTube 嵌入、編輯器內容自動包裝皆使用此 class,
   eZHeadPageRes.php 的 JS 也會動態產生這組結構。
   -------------------------------------------------------------------------- */
.embed-responsive {
	position: relative;
	display: block;
	width: 100%;
	padding: 0;
	overflow: hidden;
}

.embed-responsive::before {
	display: block;
	content: "";
}

.embed-responsive-16by9::before {
	padding-top: 56.25%;
}

.embed-responsive-4by3::before {
	padding-top: 75%;
}

.embed-responsive .embed-responsive-item,
.embed-responsive iframe,
.embed-responsive embed,
.embed-responsive object,
.embed-responsive video {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: 0;
}


/* --------------------------------------------------------------------------
   10. .panel / .well(BS5 已移除)
   本站搜尋側欄手風琴使用 .panel 系列 class,style.css 已有完整自訂外觀,
   此處僅補最基本的結構性樣式,避免與自訂設計衝突。
   -------------------------------------------------------------------------- */
.panel {
	margin-bottom: 20px;
	background-color: #fff;
	border: 1px solid transparent;
	border-radius: 4px;
	/* 搜尋篩選側欄各選項之間的淡灰分隔線,即由此陰影構成
	   (並非 border);少了它,選項之間會失去分隔而連成一片。 */
	box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

/* 位於 .panel-group 內的 panel 改用較小的間距(BS3 預設值),
   否則會沿用上方的 margin-bottom:20px,使選項間距過大。 */
.panel-group .panel {
	margin-bottom: 0;
	border-radius: 4px;
}

.panel-group .panel + .panel {
	margin-top: 5px;
}

.panel-heading {
	padding: 10px 15px;
	border-bottom: 1px solid transparent;
}

.panel-body {
	padding: 15px;
}

.panel-title {
	margin-top: 0;
	margin-bottom: 0;
	font-size: 16px;
}

.panel-group {
	margin-bottom: 20px;
}

.well {
	min-height: 20px;
	padding: 19px;
	margin-bottom: 20px;
	background-color: #f5f5f5;
	border: 1px solid #e3e3e3;
	border-radius: 4px;
}


/* --------------------------------------------------------------------------
   11. .nav / .nav-tabs(BS3 的 <li><a> 結構)
   BS5 改為 .nav-link,本站沿用 BS3 結構。
   -------------------------------------------------------------------------- */
.nav {
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
}

.nav > li {
	position: relative;
	display: block;
}

.nav > li > a {
	position: relative;
	display: block;
	padding: 10px 15px;
}


/* --------------------------------------------------------------------------
   12. .thumbnail(BS5 已移除,BS4 起改為 .card)
   -------------------------------------------------------------------------- */
.thumbnail {
	display: block;
	padding: 4px;
	margin-bottom: 20px;
	line-height: 1.42857143;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 4px;
}
