* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, "Noto Sans TC", "Microsoft JhengHei", sans-serif; }
.site-header { background: #08152A; color: #EAF0FA; padding: 12px 20px; }
.site-header .brand { color: #E4C67E; text-decoration: none; font-weight: 700; font-size: 17px; }
.site-main { padding: 20px; max-width: 960px; margin: 0 auto; }
.site-footer { padding: 16px 20px; color: #6C7C9B; font-size: 13px; text-align: center; }
.card { border-radius: 10px; padding: 20px; }
.muted { color: #9DACC6; }
.ok { color: #4FC08D; font-weight: 600; }
.fail { color: #E86A4E; font-weight: 600; }
code { background: #102647; color: #E4C67E; padding: 1px 5px; border-radius: 4px; }

/* ═══════════════════════════════════════════════════════════════
 * 深藍沉穩 × 金點綴主題（前台／會員端；後台在 admin.css 有同一組）。
 * style.css 元件全吃 CSS 變數，這裡重定義同組變數＝會員端換膚。
 * 色票同官網首頁定案稿：navy-900~600 分層、低彩度古銅金 #C9A24B。
 * ═══════════════════════════════════════════════════════════════ */
:root {
  --primary: #C9A24B;
  --primary-dark: #E4C67E;
  --primary-light: rgba(201, 162, 75, 0.12);
  --accent: #E4C67E;
  --accent-dark: #C9A24B;
  --accent-light: rgba(201, 162, 75, 0.12);
  --success: #4FC08D;
  --success-bg: rgba(79, 192, 141, 0.12);
  --danger: #E86A4E;
  --danger-bg: rgba(232, 106, 78, 0.12);
  --warning: #E6A93C;
  --warning-bg: rgba(230, 169, 60, 0.12);
  --text-primary: #EAF0FA;
  --text-secondary: #9DACC6;
  --text-muted: #6C7C9B;
  --border: rgba(148, 170, 205, 0.16);
  --bg: #060F1E;
  --surface: #0B1B33;
  --surface-soft: #102647;
  --white: #0B1B33;      /* 舊碼把 --white 當卡底用，對齊 --surface */
  --shadow: 0 14px 34px rgba(0, 0, 0, 0.45);
}
body { background: var(--bg); color: var(--text-primary); }

/* 導覽列：深色玻璃 + 金字品牌 */
.navbar {
  background: rgba(6, 15, 30, 0.88);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(201, 162, 75, 0.24);
}
.navbar-brand { color: #E4C67E; }
.nav-link { color: var(--text-secondary); }
.nav-link:hover, .nav-link.active { color: var(--text-primary); }

/* 登入狀態/逾時倒數條 */
.member-timeout-bar {
  background: #08152A;
  border-bottom: 1px solid var(--border);
  color: var(--text-secondary);
}
.member-timeout-bar strong { color: #E4C67E; }

/* 深色地上的按鈕：金底配深字。
   ★ 顏色走 --on-primary，不要再寫死（2026-08-01）：底色 --primary 是經銷商可以
     自訂的，文字卻停在為金色挑的 #241A05 —— 換成藍底就是一顆黑字看不清楚的
     「送出申請」，而客戶找不到它就送不出申請。--on-primary 由 atheme_on_color()
     依底色亮度算出深字或白字；沒設主題時 fallback 就是原本的值，全站不受影響。 */
.btn-primary, .filter-btn.active { color: var(--on-primary, #241A05); }
.btn-primary:hover { background: var(--primary-dark); color: var(--on-primary, #241A05); }
.btn:not(.btn-outline):not(.btn-danger):not(.btn-success):not(.btn-google) { color: var(--on-primary, #241A05); }
.btn-outline { color: var(--text-secondary); }
.btn-outline:hover { background: var(--primary-light); color: var(--text-primary); }
/* Google 登入鈕維持白底黑字（Google 品牌規範），深色地上反而更醒目 */

/* 表格 */
thead th { background: #08152A; color: var(--text-muted); }
tbody td { border-color: var(--border); }
tbody tr:hover td { background: rgba(201, 162, 75, 0.07); }

/* 輸入元件：金色聚焦光暈、原生控件深色、autofill 蓋回深底 */
.form-group input:focus, .form-group select:focus, .form-group textarea:focus {
  border-color: var(--primary);
  box-shadow: 0 0 0 3px rgba(201, 162, 75, 0.18);
}
input, select, textarea { color-scheme: dark; }
input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #0B1B33 inset;
  -webkit-text-fill-color: #EAF0FA;
  caret-color: #EAF0FA;
}

/* 徽章（原本亮色寫死） */
.badge-personal { background: rgba(47, 111, 228, 0.18); color: #9CC1F5; }
.badge-company { background: var(--success-bg); color: var(--success); }
.badge-active { background: rgba(79, 192, 141, 0.16); color: #6FD6A6; }
.badge-pending { background: var(--warning-bg); color: #EEC069; }
.badge-suspended { background: var(--danger-bg); color: #F09A86; }
.badge.s-success { background: var(--success-bg); color: var(--success); }
.badge.s-failed { background: var(--danger-bg); color: var(--danger); }
.badge.s-pending { background: var(--warning-bg); color: var(--warning); }

/* 提示框邊線 */
.alert-success { border-color: rgba(79, 192, 141, 0.4); }
.alert-danger { border-color: rgba(232, 106, 78, 0.4); }

/* 左欄選單樣式已統一在 style.css（精緻版：圖示＋單行＋柔金作用態）。 */

/* 頭像底 */
.av-p { background: var(--primary-light); color: #E4C67E; }