
.admin-data-table-pagination[data-v-25d26425] {
  margin-top: 16px;
  display: flex;
  justify-content: flex-end;
}

/**
 * LINE 後台共用設計 token（對齊 Appier 風格）
 * 主色、卡片、標題、留白
 */
:root {
  --backend-primary: #E96D00;
  --backend-primary-hover: #d66100;
  --backend-bg: #f8f5f1;
  --backend-card-bg: #fff;
  --backend-card-radius: 14px;
  --backend-card-shadow: 0 3px 12px rgba(196,120,50,0.07);
  --backend-heading-color: #2e2823;
  --backend-text-color: #4a4138;
  --backend-muted: #8d8377;
  --backend-border: #efe7dd;
  --backend-nav-bg: #fff;
  --backend-nav-border: #efe7dd;
  --backend-nav-active-bg: rgba(233, 109, 0, 0.11);
  --backend-nav-active-color: #E96D00;
  --backend-stat-highlight: linear-gradient(160deg, #fff8f1, #fff2e6);
  --backend-content-max-width: 1920px;
  --backend-content-padding: 24px;
  --backend-sidebar-width: 220px;
  --backend-sidebar-collapsed-width: 56px;
}

/* 後台主內容區（由 mastermenu 包住的 router-view 使用） */
.backend-layout {
  min-height: 100vh;
  display: flex;
  flex-direction: row;
  background: var(--backend-bg);
}

/* 左側 Sidebar */
.backend-sidebar {
  width: var(--backend-sidebar-width);
  flex-shrink: 0;
  background: var(--backend-nav-bg);
  border-right: 1px solid var(--backend-nav-border);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  transition: width 0.2s ease;
}
.backend-layout.collapsed .backend-sidebar {
  width: var(--backend-sidebar-collapsed-width);
}
.backend-sidebar-header {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 12px;
  border-bottom: 1px solid var(--backend-nav-border);
  min-height: 56px;
  box-sizing: border-box;
}

/* 收合狀態：header 只剩 logo 置中 */
.backend-layout.collapsed .backend-sidebar-header {
  justify-content: center;
  padding: 14px 4px;
}
.backend-layout.collapsed .backend-sidebar-logo { height: 26px;
}
.backend-sidebar-logo {
  height: 28px;
  flex-shrink: 0;
}
.backend-sidebar-title {
  font-size: 15px;
  font-weight: 600;
  color: var(--backend-heading-color);
  margin: 0;
  flex: 1;
  line-height: 1.3;
  /* 讓中英混排可以斷字換行，220px-padding-logo 約剩 130px */
  white-space: normal;
  word-break: break-word;
}

/* Sidebar footer：toggle 永遠 stick 在最底，不跟 header 內容搶位 */
.backend-sidebar-footer {
  margin-top: auto;
  border-top: 1px solid var(--backend-nav-border);
  padding: 8px;
}
.backend-sidebar-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 10px 8px;
  border: none;
  background: transparent;
  color: #888;
  font-size: 13px;
  cursor: pointer;
  border-radius: 6px;
  transition: background 0.15s, color 0.15s;
}
.backend-sidebar-toggle:hover {
  background: var(--backend-nav-active-bg);
  color: var(--backend-nav-active-color);
}
.backend-sidebar-toggle-icon {
  font-size: 14px;
  font-weight: 600;
}
.backend-sidebar-links {
  display: flex;
  flex-direction: column;
  padding: 8px 6px;
  gap: 2px;
}
.backend-sidebar-links a {
  display: flex;
  align-items: center;
  position: relative;
  padding: 10px 14px;
  color: var(--backend-text-color);
  text-decoration: none;
  font-size: 14px;
  border-radius: 9px;
  white-space: nowrap;
  overflow: hidden;
  transition: background 0.15s, color 0.15s;
}
.backend-sidebar-links a:hover {
  background: var(--backend-nav-active-bg);
  color: var(--backend-nav-active-color);
}
.backend-sidebar-links a.thisPage {
  background: var(--backend-nav-active-bg);
  color: var(--backend-nav-active-color);
  font-weight: 700;
}

/* 當前項：橘色左條（收合模式下隱藏，見下方 .collapsed 規則） */
.backend-sidebar-links a.thisPage::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 3px;
  background: var(--backend-primary);
}

/* 收合狀態：隱藏文字，留 icon */
.backend-layout.collapsed .backend-sidebar-link-text { display: none;
}
.backend-layout.collapsed .backend-sidebar-link-icon { display: inline-block;
}
.backend-layout.collapsed .backend-sidebar-links a {
  justify-content: center;
  padding: 10px 8px;
}
/* 收合時左條會壓到置中 icon，隱藏之 */
.backend-layout.collapsed .backend-sidebar-links a.thisPage::before { display: none;
}

/* 預設展開：icon 隱藏 */
.backend-sidebar-link-icon {
  display: none;
  font-size: 14px;
  font-weight: 600;
}
.backend-main {
  flex: 1;
  min-width: 0;
  padding: var(--backend-content-padding);
  box-sizing: border-box;
  max-width: var(--backend-content-max-width);
}

/* 行動裝置：sidebar 自動以收合樣式呈現 */
@media (max-width: 768px) {
.backend-sidebar { width: var(--backend-sidebar-collapsed-width);
}
.backend-sidebar-header { justify-content: center; padding: 14px 4px;
}
.backend-sidebar-title { display: none;
}
.backend-sidebar-logo { height: 26px;
}
.backend-sidebar-link-text { display: none;
}
.backend-sidebar-link-icon { display: inline-block;
}
.backend-sidebar-links a { justify-content: center; padding: 10px 8px;
}
.backend-sidebar-links a.thisPage::before { display: none;
}
  /* 收合 toggle 在底部仍可顯示（窄寬度也保留功能） */
.backend-sidebar-toggle-text { display: none;
}
}

/* 卡片區塊 */
.backend-card {
  background: var(--backend-card-bg);
  border-radius: var(--backend-card-radius);
  box-shadow: var(--backend-card-shadow);
  padding: 20px;
  margin-bottom: 24px;
}
.backend-card-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--backend-heading-color);
  margin: 0 0 16px 0;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--backend-border);
}

/* 頁面標題 */
.backend-page-title {
  font-size: 22px;
  font-weight: 600;
  color: var(--backend-heading-color);
  margin: 0 0 20px 0;
}

/* 篩選列 */
.backend-filter-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  margin-bottom: 16px;
}

/**
 * 後台 Kendo Grid 寬螢幕填滿
 * --------------------------
 * Kendo Vue Grid 每個 column 多以 px 寫死寬度，加總後常常 < 容器寬度，
 * 寬螢幕下會出現「欄位擠在左邊、右側一片空白」。
 * 強制 grid 的 table 走 fixed layout + 100% 寬，瀏覽器會把原本的 px 比例
 * 等比例放大填滿容器，header 與 body 兩個 table 都套同一條規則維持對齊。
 *
 * 只 scope 到後台容器（.backend-card / .backend-page），不影響 LIFF 頁面。
 */
.backend-card .k-grid table,
.backend-page .k-grid table {
  width: 100% !important;
  table-layout: fixed !important;
}

/* KPI 卡片（儀表板用） */
.backend-stat-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 24px;
}
.backend-stat-card {
  background: var(--backend-card-bg);
  border-radius: var(--backend-card-radius);
  box-shadow: var(--backend-card-shadow);
  padding: 20px;
  text-align: center;
}
.backend-stat-number {
  font-size: 28px;
  font-weight: 700;
  color: var(--backend-primary);
  line-height: 1.2;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}

/* 第一張統計卡：暖橘強調（呼應風格 06 亮點卡） */
.backend-stat-cards .backend-stat-card:first-child {
  background: var(--backend-stat-highlight);
  border: 1px solid #f6dcc2;
}
.backend-stat-label {
  font-size: 13px;
  color: #888;
  margin-top: 6px;
}


.admin-container[data-v-6e47046b] { padding: 0;
}
.header-row[data-v-6e47046b] { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px;
}
.detail-grid[data-v-6e47046b] { display: flex; flex-direction: column; gap: 0;
}
.detail-row[data-v-6e47046b] { display: flex; padding: 10px 0; border-bottom: 1px solid var(--backend-border);
}
.detail-row label[data-v-6e47046b] { width: 180px; font-weight: 600; color: var(--backend-text-color); font-size: 14px; flex-shrink: 0;
}
.detail-row span[data-v-6e47046b] { font-size: 14px;
}
.empty-message[data-v-6e47046b] { text-align: center; color: #999; padding: 24px; margin: 0;
}

