/**
 * st-admcore CSS Variables
 * 基礎變數定義 - 根據 layout-design.md Issue 6
 */

:root {
  /* ===== 佈局尺寸 ===== */

  /* Sidebar */
  --st-admcore-sidebar-width: 256px;
  --st-admcore-sidebar-width-condensed: 64px;
  --st-admcore-sidebar-width-hidden: 0;
  --st-admcore-sidebar-brand-height: 60px;

  /* Topbar */
  --st-admcore-topbar-height: 52px;

  /* Footer */
  --st-admcore-footer-height: 48px;

  /* Content（各斷點 padding，0 = 由頁面內部自行控制） */
  --st-admcore-content-padding: 0;

  /* ===== Z-Index 層級 ===== */
  --st-admcore-z-sidebar: 1000;
  --st-admcore-z-toggle-btn: 1010;
  --st-admcore-z-topbar: 1020;
  --st-admcore-z-dropdown: 1030;
  --st-admcore-z-modal: 1060;
  --st-admcore-z-toast: 1070;

  /* ===== 動畫參數 ===== */
  --st-admcore-transition-duration: 0.3s;
  --st-admcore-transition-easing: cubic-bezier(0.4, 0, 0.2, 1);

  /* ===== 陰影系統 ===== */
  --st-admcore-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --st-admcore-shadow-md: 0 2px 4px rgba(0, 0, 0, 0.08);
  --st-admcore-shadow-lg: 0 4px 8px rgba(0, 0, 0, 0.12);

  /* ===== 圓角 ===== */
  --st-admcore-radius-sm: 4px;
  --st-admcore-radius-md: 6px;
  --st-admcore-radius-lg: 8px;

  /* ===== 顏色系統（預設值，會被主題覆蓋） ===== */

  /* Sidebar */
  --st-admcore-sidebar-bg: #2d3748;
  --st-admcore-sidebar-text: rgba(255, 255, 255, 0.8);
  --st-admcore-sidebar-text-hover: #ffffff;
  --st-admcore-sidebar-text-active: #ffffff;
  --st-admcore-sidebar-item-bg-hover: rgba(255, 255, 255, 0.15);
  --st-admcore-sidebar-item-bg-active: rgba(66, 153, 225, 0.22);
  --st-admcore-sidebar-divider: rgba(255, 255, 255, 0.1);

  /* Topbar */
  --st-admcore-topbar-bg: #ffffff;
  --st-admcore-topbar-text: #4f5d73;
  --st-admcore-topbar-text-hover: #2c3e50;
  --st-admcore-topbar-border: #e5e7eb;
  --st-admcore-topbar-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);

  /* GlobalTab */
  --st-admcore-tab-bg: transparent;
  --st-admcore-tab-bg-hover: rgba(66, 153, 225, 0.06);
  --st-admcore-tab-bg-active: #f7fafc;
  --st-admcore-tab-text: rgba(var(--st-admcore-page-title-accent-rgb, 66, 153, 225), 0.5);
  --st-admcore-tab-text-hover: var(--st-admcore-page-title-accent, #4299e1);
  --st-admcore-tab-text-active: var(--st-admcore-page-title-accent, #4299e1);
  --st-admcore-tab-border-active: var(--st-admcore-page-title-accent, #4299e1);

  /* Content */
  --st-admcore-content-bg: #f7fafc;

  /* Footer */
  --st-admcore-footer-bg: #ffffff;
  --st-admcore-footer-text: #6b7280;
  --st-admcore-footer-border: #e5e7eb;

  /* Toggle Button */
  --st-admcore-toggle-btn-bg: #ffffff;
  --st-admcore-toggle-btn-color: #4f5d73;
  --st-admcore-toggle-btn-border: #e5e7eb;
  --st-admcore-toggle-btn-shadow: var(--st-admcore-shadow-md);
}

/* ===== 表單元件主題色覆蓋 ===== */

/* 全域 accent-color（影響原生 select option、checkbox、date/time picker 等） */
:root {
  accent-color: var(--st-admcore-page-title-accent, #4f46e5);
}

/* 原生 date/time picker 主題色 */
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
input[type="week"] {
  accent-color: var(--st-admcore-page-title-accent, #4f46e5);
  color-scheme: light;
}

::-webkit-calendar-picker-indicator {
  filter: opacity(0.6);
  cursor: pointer;
}

::-webkit-calendar-picker-indicator:hover {
  filter: opacity(1);
}

/* 輸入框 focus 狀態 */
.form-control:focus,
.form-select:focus {
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25);
}

/* Checkbox / Radio 選取狀態 */
.form-check-input:checked {
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
}

.form-check-input:focus {
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25);
}

/* Switch 開關 */
.form-switch .form-check-input:checked {
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
}

/* Range 滑桿 */
.form-range:focus::-webkit-slider-thumb {
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25);
}

.form-range::-webkit-slider-thumb {
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
}

.form-range::-moz-range-thumb {
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
}

/* Select2 下拉選項 highlight */
/* --selected 先定義，--highlighted 後定義，使兩者同時存在時 --highlighted 優先 */
.select2-container--bootstrap-5 .select2-results__option--selected {
  background-color: rgba(var(--st-admcore-page-title-accent-rgb, 66, 153, 225), 0.12) !important;
  color: var(--st-admcore-page-title-accent, #4299e1) !important;
}

.select2-container--bootstrap-5 .select2-results__option--highlighted {
  background-color: var(--st-admcore-page-title-accent, #4299e1) !important;
  color: #fff !important;
}

/* Select2 focus 邊框 */
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.select2-container--bootstrap-5.select2-container--open .select2-selection {
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25) !important;
}

/* Select2 下拉選單容器邊框 */
.select2-container--bootstrap-5 .select2-dropdown {
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
}

/* Select2 下拉選單內搜尋框 */
.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field {
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
}

.select2-container--bootstrap-5 .select2-search--dropdown .select2-search__field:focus {
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25) !important;
}

/* Select2 多選 tag */
.select2-container--bootstrap-5 .select2-selection--multiple .select2-selection__choice {
  background-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.1);
  border-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.3);
  color: var(--st-admcore-page-title-accent, #4f46e5);
}

/* DataTables 分頁按鈕 - 預設文字色 */
.dt-paging-button .page-link,
.page-item .page-link {
  color: var(--st-admcore-page-title-accent, #4f46e5) !important;
}

/* DataTables 分頁按鈕 - active */
.dt-paging-button.active .page-link,
.page-item.active > .page-link {
  background-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  color: #fff !important;
}

/* DataTables 分頁按鈕 - hover */
.dt-paging-button:not(.disabled):not(.active) .page-link:hover,
.page-item:not(.disabled):not(.active) .page-link:hover {
  background-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.08) !important;
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
}

/* DataTables 分頁按鈕 - disabled */
.dt-paging-button.disabled .page-link,
.page-item.disabled .page-link {
  color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  opacity: 0.5;
}

/* DataTables 分頁按鈕 - focus */
.dt-paging-button .page-link:focus {
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.25);
}

/* 原生 dropdown-item active */
.dropdown-menu .dropdown-item.active,
.dropdown-menu .dropdown-item:active {
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
}

/* Flatpickr 主題色覆蓋 */
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: var(--st-admcore-page-title-accent, #4f46e5) !important;
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  color: #fff !important;
}

.flatpickr-day.inRange {
  background: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.12) !important;
  border-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.12) !important;
  box-shadow: -5px 0 0 rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.12),
               5px 0 0 rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.12) !important;
}

.flatpickr-day.today {
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
}

.flatpickr-day.today:hover,
.flatpickr-day.today:focus {
  background: var(--st-admcore-page-title-accent, #4f46e5) !important;
  border-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  color: #fff !important;
}

.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekdays,
span.flatpickr-weekday {
  background: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.06);
}

/* ===== 按鈕 hover/active 強化 ===== */

.btn:hover {
  filter: brightness(0.92);
}

.btn:active,
.btn.active {
  filter: brightness(0.85);
  transform: translateY(1px);
}

.btn:active:focus-visible {
  box-shadow: none;
}

/* ===== Table 主題色 thead ===== */

.st-table-themed-header thead {
  background-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.08);
}

.st-table-themed-header thead th {
  color: var(--st-admcore-page-title-accent, #4f46e5);
  border-bottom-color: rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.2);
}

/* ===== Badge 主題色 ===== */

.bg-theme {
  background-color: var(--st-admcore-page-title-accent, #4f46e5) !important;
  color: #fff !important;
}

/* ===== 主題色按鈕（跟隨主題配色） ===== */

.btn-theme {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
}

.btn-theme:hover {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  filter: brightness(0.9);
}

.btn-theme:active,
.btn-theme.active {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  filter: brightness(0.85);
  transform: translateY(1px);
}

.btn-theme:disabled {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  opacity: 0.65;
}

.btn-theme:focus-visible {
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.5);
}

.btn-outline-theme {
  color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
  background-color: transparent;
}

.btn-outline-theme:hover {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  border-color: var(--st-admcore-page-title-accent, #4f46e5);
}

.btn-outline-theme:active,
.btn-outline-theme.active {
  color: #fff;
  background-color: var(--st-admcore-page-title-accent, #4f46e5);
  filter: brightness(0.85);
  transform: translateY(1px);
}

.btn-outline-theme:focus-visible {
  box-shadow: 0 0 0 0.25rem rgba(var(--st-admcore-page-title-accent-rgb, 79, 70, 229), 0.5);
}