@charset "UTF-8";
/* =========================================================================
   a11y.css - 無障礙（WCAG 2.1 AA）修正樣式

   引用方式（網頁定義）：webMain.aspx?sys=510&x=2398&funid=a11ycss
   本檔案必須是每個頁面 head 中「最後一個」載入的樣式表，
   以便覆寫 sb-admin-2 與各頁面 inline style 的設定。

   對應檢測項目：
     1.4.3  對比值(最小)   GN2140300E
     1.4.10 流動排版       CS2141007E
     1.4.11 非文字對比
     2.4.7  焦點看得見
     4.1.2  名稱、角色和值 GN1410200E
   ========================================================================= */

/* -------------------------------------------------------------------------
   1.4.3 主色系：#4e73df 於白底僅 4.34:1、於 #f8f9fc 僅 4.12:1
   改為 #2e59d9 → 白底 5.92:1、#f8f9fc 底 5.62:1
   ------------------------------------------------------------------------- */
.text-primary {
  color: #2e59d9 !important;
}

a.text-primary:hover,
a.text-primary:focus {
  color: #1f3fa8 !important;
}

.btn-primary {
  background-color: #2e59d9;
  border-color: #2e59d9;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.focus,
.btn-primary:not(:disabled):not(.disabled):active,
.btn-primary:not(:disabled):not(.disabled).active,
.show > .btn-primary.dropdown-toggle {
  background-color: #1f3fa8;
  border-color: #1f3fa8;
}

.btn-primary.disabled,
.btn-primary:disabled {
  background-color: #2e59d9;
  border-color: #2e59d9;
  opacity: 1;
}

.btn-outline-primary,
.btn-link {
  color: #2e59d9;
}

.btn-outline-primary {
  border-color: #2e59d9;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:not(:disabled):not(.disabled):active,
.show > .btn-outline-primary.dropdown-toggle {
  color: #fff;
  background-color: #2e59d9;
  border-color: #2e59d9;
}

.btn-link:hover,
.btn-link:focus {
  color: #1f3fa8;
}

/* 各頁 inline style 定義的「查詢步驟」按鈕外框 */
.btn-outline-primary-border {
  border: 0.2rem solid #2e59d9 !important;
}

.border-left-primary {
  border-left-color: #2e59d9 !important;
}

/* -------------------------------------------------------------------------
   1.4.3 成功（查詢）按鈕：白字於 #1cc88a 僅 2.17:1
   改為 #0f7a55 → 白字 5.34:1
   ------------------------------------------------------------------------- */
.text-success {
  color: #0f7a55 !important;
}

.btn-success,
.badge-success,
.bg-success {
  background-color: #0f7a55 !important;
  border-color: #0f7a55 !important;
  color: #fff !important;
}

.btn-success:hover,
.btn-success:focus,
.btn-success.focus,
.btn-success:not(:disabled):not(.disabled):active,
.btn-success:not(:disabled):not(.disabled).active,
.show > .btn-success.dropdown-toggle {
  background-color: #0b5c40 !important;
  border-color: #0b5c40 !important;
  color: #fff !important;
}

.btn-success.disabled,
.btn-success:disabled {
  opacity: 1;
}

/* btn-icon-split 左側圖示區塊（原為半透明白，對比不足） */
.btn-success .icon.text-white-50,
.btn-danger .icon.text-white-50,
.btn-primary .icon.text-white-50,
.btn-info .icon.text-white-50,
.btn-warning .icon.text-white-50 {
  color: #fff !important;
}

/* -------------------------------------------------------------------------
   1.4.3 危險（刪除）按鈕：白字於 #e74a3b 僅 3.86:1
   改為 #c0281a → 白字 5.90:1
   ------------------------------------------------------------------------- */
.text-danger {
  color: #c0281a !important;
}

.btn-danger,
.badge-danger,
.bg-danger {
  background-color: #c0281a !important;
  border-color: #c0281a !important;
  color: #fff !important;
}

.btn-danger:hover,
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:not(:disabled):not(.disabled):active,
.btn-danger:not(:disabled):not(.disabled).active,
.show > .btn-danger.dropdown-toggle {
  background-color: #97200f !important;
  border-color: #97200f !important;
  color: #fff !important;
}

.border-left-danger {
  border-left-color: #c0281a !important;
}

/* -------------------------------------------------------------------------
   1.4.3 資訊 / 警告
   #36b9cc 白字僅 2.34:1 → #1d707c；#f6c23e 白底僅 1.65:1 → #8a6300
   ------------------------------------------------------------------------- */
.text-info {
  color: #1d707c !important;
}

.btn-info,
.badge-info,
.bg-info {
  background-color: #1d707c !important;
  border-color: #1d707c !important;
  color: #fff !important;
}

.btn-info:hover,
.btn-info:focus,
.btn-info:not(:disabled):not(.disabled):active,
.show > .btn-info.dropdown-toggle {
  background-color: #15545d !important;
  border-color: #15545d !important;
  color: #fff !important;
}

.border-left-info {
  border-left-color: #1d707c !important;
}

.text-warning {
  color: #8a6300 !important;
}

.btn-warning,
.badge-warning {
  background-color: #8a6300 !important;
  border-color: #8a6300 !important;
  color: #fff !important;
}

.border-left-warning {
  border-left-color: #8a6300 !important;
}

/* 各頁 inline style 的 .text-yellow（#fed71a 於白底僅 1.40:1） */
.text-yellow {
  color: #8a6300 !important;
}

/* 深色底（#27758D / #003D79）上的 .text-yellow 對比足夠，維持原色 */
.main-color .text-yellow,
.sidebar .text-yellow {
  color: #fed71a !important;
}

/* 各頁 inline style 的 .text-blue（#0095ab 白底 3.57:1 → #00707f 5.79:1） */
.text-blue {
  color: #00707f !important;
}

/* -------------------------------------------------------------------------
   1.4.3 灰階文字：#b7b9cc(1.94:1)、#858796(3.56:1) 於白底皆不足
   ------------------------------------------------------------------------- */
.text-gray-400,
.text-gray-500 {
  color: #6e707e !important;
}

.text-gray-600,
.text-muted {
  color: #666877 !important;
}

.topbar .nav-item .nav-link,
.topbar.navbar-light .navbar-nav .nav-item .nav-link {
  color: #666877;
}

.topbar .nav-item .nav-link:hover,
.topbar .nav-item .nav-link:focus,
.topbar.navbar-light .navbar-nav .nav-item .nav-link:hover,
.topbar.navbar-light .navbar-nav .nav-item .nav-link:focus {
  color: #3a3b45;
}

/* -------------------------------------------------------------------------
   1.4.3 左側深色選單（背景 #27758D）
   rgba(255,255,255,.8) 混色後為 #D3E3E8，對比僅 3.97:1
   改為純白 #fff → 5.23:1
   ------------------------------------------------------------------------- */
.sidebar-dark .nav-item .nav-link,
.sidebar-dark .nav-item .nav-link i,
.sidebar-dark .nav-item .nav-link[data-toggle="collapse"]::after,
.sidebar-dark .sidebar-heading,
.sidebar-dark #sidebarToggle::after,
.sidebar-dark.toggled #sidebarToggle::after {
  color: #fff;
}

/* 展開後的白底子選單維持深色字 */
.sidebar-dark .nav-item .collapse .collapse-inner .collapse-item,
.sidebar-dark .nav-item .collapsing .collapse-inner .collapse-item,
.sidebar-dark .nav-item .collapse .collapse-inner .collapse-header,
.sidebar-dark .nav-item .collapsing .collapse-inner .collapse-header,
.sidebar-dark .nav-item .collapse .collapse-inner .sidebar-heading,
.sidebar .collapse-inner .form-check-label {
  color: #3a3b45;
}

.sidebar .nav-item .collapse .collapse-inner .collapse-item.active,
.sidebar .nav-item .collapsing .collapse-inner .collapse-item.active {
  color: #2e59d9;
}

/* -------------------------------------------------------------------------
   1.4.11 非文字對比：輪播索引圓點
   ------------------------------------------------------------------------- */
.circle {
  border: 1px solid #6e707e;
}

.circle[aria-current="true"] {
  border-color: #003d79;
}

/* -------------------------------------------------------------------------
   2.4.7 焦點看得見（原 .circle:focus{outline:none} 會移除焦點框）
   ------------------------------------------------------------------------- */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
summary:focus,
[tabindex]:focus,
[role="button"]:focus,
[role="tab"]:focus,
.circle:focus,
.tabindex:focus {
  outline: 3px solid #c1121f !important;
  outline-offset: 2px !important;
}

/* 深色底（#27758D）上改用白色焦點框，確保看得見 */
.sidebar-dark a:focus,
.sidebar-dark button:focus,
.sidebar-dark [tabindex]:focus {
  outline-color: #fff !important;
}

/* 但摺疊展開後的子選單是白底，白色焦點框會完全看不見（會被誤判成 Tab 不到），
   這些元素必須改回深色焦點框 */
.sidebar-dark .collapse-inner a:focus,
.sidebar-dark .collapse-inner button:focus,
.sidebar-dark .collapse-inner input:focus,
.sidebar-dark .collapse-inner select:focus,
.sidebar-dark .collapse-inner textarea:focus,
.sidebar-dark .collapse-inner [tabindex]:focus,
.sidebar-dark .bg-white a:focus,
.sidebar-dark .bg-white button:focus,
.sidebar-dark .bg-white input:focus,
.sidebar-dark .bg-white select:focus,
.sidebar-dark .bg-white [tabindex]:focus {
  outline-color: #c1121f !important;
}

/* 子選單項目左右各只有 0.5rem 邊距，焦點框貼齊即可，避免被裁切 */
.sidebar .collapse-inner a:focus,
.sidebar .collapse-inner button:focus,
.sidebar .collapse-inner [tabindex]:focus {
  outline-offset: -1px !important;
}

/* -------------------------------------------------------------------------
   1.4.10 流動排版：「跳到主要內容區塊」快速連結
   原樣式 position:absolute + opacity:0 + pointer-events:none，
   放大至 400% 時內容會超出可視範圍且滑鼠無法點選。
   改為標準 skip-link：平時以 clip 隱藏，取得焦點時固定於左上並限制寬度換行。
   ------------------------------------------------------------------------- */
.accesskey {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  border: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

.accesskey:focus,
.accesskey:active {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 2000 !important;
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0.5rem 0.75rem !important;
  overflow: visible !important;
  clip: auto !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-wrap: break-word !important;
  box-sizing: border-box !important;
  background-color: #fff !important;
  color: #003d79 !important;
  border: 2px solid #003d79 !important;
  border-radius: 0 0 0.25rem 0 !important;
  font-size:1.143em  !important;
  text-decoration: underline;
}

/* 主要內容容器以程式移入焦點時不顯示多餘外框 */
#content:focus {
  outline: none !important;
}

/* -------------------------------------------------------------------------
   1.4.10 流動排版：放大至 400% 時避免產生橫向捲軸／內容被截斷
   ------------------------------------------------------------------------- */
img {
  max-width: 100%;
  height: auto;
}

video {
  max-width: 100%;
}

.table-title-name,
.carousel-card,
.carousel-card-hide-left,
.carousel-card-hide-right,
.list-group-item-text {
  overflow-wrap: break-word;
  word-wrap: break-word;
}

@media (max-width: 991.98px) {
  .table-title-name {
    white-space: normal;
  }
}

/* -------------------------------------------------------------------------
   2.1.2 漢堡選單收合（width:0）時，選單內連結不得仍可被 Tab 聚焦
   ------------------------------------------------------------------------- */
@media (max-width: 767.98px) {
  .sidebar.toggled {
    visibility: hidden;
  }
}

/* -------------------------------------------------------------------------
   2.1.1 / 2.2.2 / 4.1.2 輪播（精選重點統計指標）
   ------------------------------------------------------------------------- */
.carousel-card-link {
  display: block;
  width: 100%;
  height: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  text-align: inherit;
  font: inherit;
  text-decoration: none;
}

.carousel-card-link:hover .carousel-card,
.carousel-card-link:focus .carousel-card {
  box-shadow: 0 0 0 0.2rem rgba(0, 61, 121, 0.55);
}

.carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
}

.carousel-playpause {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2rem;
  padding: 0.25rem 0.75rem;
  margin-right: 0.75rem;
  border: 1px solid #003d79;
  border-radius: 1rem;
  background-color: #fff;
  color: #003d79;
  font-size:1.086em ;
  line-height: 1.4;
  cursor: pointer;
}

.carousel-playpause:hover {
  background-color: #003d79;
  color: #fff;
}

/* -------------------------------------------------------------------------
   2.4.3 頁籤（全部／考選／銓敘…）
   ------------------------------------------------------------------------- */
.btn-newtitlelist[aria-selected="true"] {
  background-color: #003d79;
  border-color: #003d79;
  color: #fff !important;
}

.btn-newtitlelist[aria-selected="true"] .text-md,
.btn-newtitlelist[aria-selected="true"] span {
  color: #fff !important;
}

/* -------------------------------------------------------------------------
   4.1.2 字級切換按鈕（小／中／大）
   ------------------------------------------------------------------------- */
.fontsize-group {
  display: inline-flex;
  align-items: center;
}

.fontsize-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.2rem;
  margin: 0 0.15rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  background: none;
  line-height: 0;
  cursor: pointer;
}

.fontsize-btn[aria-pressed="true"] {
  border-color: #003d79;
  background-color: #e6eef7;
}

/* 圖示以 rem 定尺寸，才會跟著「字級小／中／大」與瀏覽器縮放一起放大。
   （原本 sb-admin 的 .img-profile 給的是 2rem，改成 button 後遺失，
     圖會退回 PNG 原生 26px 固定大小，選字級大時看起來特別小） */
.fontsize-btn img {
  display: block;
  width: 2.25rem;
  height: 2.25rem;
  max-width: none;
  vertical-align: middle;
}

/* -------------------------------------------------------------------------
   僅供螢幕閱讀器讀取的文字
   ------------------------------------------------------------------------- */
.a11y-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* -------------------------------------------------------------------------
   4.1.2 首頁指標清單：原為 li + click，改為 li > button 後維持原外觀
   ------------------------------------------------------------------------- */
.datalist-item-btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.datalist-item-btn .list-group-item-text {
  display: block;
}

/* -------------------------------------------------------------------------
   1.4.3 全站基礎文字與連結顏色
   sb-admin-2 預設 body/table 文字 #858796 於白底僅 3.56:1，
   預設連結 #4e73df 於白底僅 4.34:1，兩者皆未達 4.5:1。
   ------------------------------------------------------------------------- */
body {
  color: #5a5c69;
}

.table,
.list-group-item,
.dropdown-item,
.card-body,
.form-check-label,
.custom-control-label,
label {
  color: #5a5c69;
}

a {
  color: #2e59d9;
}

a:hover,
a:focus {
  color: #1f3fa8;
}

/* 深色底與自訂顏色的連結不受影響 */
.sidebar-dark a,
.sidebar-dark .nav-item .nav-link,
a.text-white,
.text-white a,
.btn a,
a.btn {
  color: inherit;
}

.sidebar-dark .nav-item .nav-link {
  color: #fff;
}

a.text-gray-800 {
  color: #5a5c69 !important;
}

a.text-newblue,
.text-newblue {
  color: #003d79;
}

/* 表格表頭 */
.table thead th,
.table th {
  color: #3a3b45;
}

/* -------------------------------------------------------------------------
   1.4.11 非文字對比：單表查詢左側樹狀資料夾圖示
   #36b9cc 於白底僅 2.34:1，未達圖形介面元件所需的 3:1
   ------------------------------------------------------------------------- */
.text-color3 {
  color: #1d707c !important;
}

/* -------------------------------------------------------------------------
   1.4.3 四個主要查詢按鈕（綠／藍／紫／黃）
   底色上的文字一律使用 #003d79，對比 4.5:1 以上
   ------------------------------------------------------------------------- */
.btn-green,
.btn-blue,
.btn-purple,
.btn-yellow {
  color: #003d79;
}

.btn-green:hover,
.btn-blue:hover,
.btn-purple:hover,
.btn-yellow:hover,
.btn-green:focus,
.btn-blue:focus,
.btn-purple:focus,
.btn-yellow:focus {
  color: #003d79;
}

/* hover / focus / active 時改用較淺的同色系底色，維持 #003d79 文字 4.5:1 以上
   （原本 hover 加深底色會讓對比降到約 3:1） */
.btn-green:not(:disabled):not(.disabled).active,
.btn-green:not(:disabled):not(.disabled):active,
.show > .btn-green.dropdown-toggle,
.btn-green:hover,
.btn-green:focus {
  background-color: #5fd0b8;
  border-color: #2aa385;
}

.btn-blue:not(:disabled):not(.disabled).active,
.btn-blue:not(:disabled):not(.disabled):active,
.show > .btn-blue.dropdown-toggle,
.btn-blue:hover,
.btn-blue:focus {
  background-color: #9cc4f4;
  border-color: #4a89dc;
}

.btn-purple:not(:disabled):not(.disabled).active,
.btn-purple:not(:disabled):not(.disabled):active,
.show > .btn-purple.dropdown-toggle,
.btn-purple:hover,
.btn-purple:focus {
  background-color: #c9b9f5;
  border-color: #967adc;
}

.btn-yellow:not(:disabled):not(.disabled).active,
.btn-yellow:not(:disabled):not(.disabled):active,
.show > .btn-yellow.dropdown-toggle,
.btn-yellow:hover,
.btn-yellow:focus {
  background-color: #ffb866;
  border-color: #e67c05;
}

/* -------------------------------------------------------------------------
   左側「相關統計查詢網」子選單：改為語意化清單後的間距與換行
   （各頁 inline style 的 .collapse-item{white-space:pre-line!important}
     是給單表查詢樹狀項目用的，此處需要正常換行）
   ------------------------------------------------------------------------- */
.sidebar .collapse-inner > ul {
  margin: 0;
  padding-left: 0;
  list-style: none;
}

.sidebar .collapse-inner > ul > li {
  margin: 0;
}

#collapseUtilities .collapse-item {
  white-space: normal !important;
  overflow-wrap: break-word;
  word-wrap: break-word;
  line-height: 1.5;
}

#collapseUtilities .collapse-header {
  white-space: normal;
}