/* ==========================================================================
   全域樣式設定（Theme / CSS Variables）
   修改配色、圓角、陰影請優先改此檔，勿在各頁面硬寫色碼。
   淺色＝CHMS 米色系；深色維持原 slate 深色。
   ========================================================================== */

:root {
    /* ---- 色票（淺色＝米色系：頁面淺、區塊略深；主色亦為米色階）---- */
    --app-bg: #faf6ee;
    --app-surface: #efe8dc;
    --app-white: #fffcf7;
    --app-primary: #8b7355;
    --app-primary-hover: #6f5a42;
    --app-primary-light: #c4a882;
    --app-primary-soft: #f0e6d6;
    --app-primary-muted: #d9cbb8;
    --app-primary-deep: #a68968;
    --app-accent: #a67c52;
    --app-accent-hover: #8a6640;
    --app-accent-soft: #f3e8d8;
    --app-accent-muted: #e0d0ba;
    --app-accent-light: #c9a882;
    --app-accent-mid: #b89268;
    --app-navy: #2c2824;
    --app-navy-hover: #1a1816;
    --app-gold: #9a7040;
    --app-gold-soft: #f0e4d0;
    --app-gold-light: #c49a62;
    --app-text: #2c2824;
    --app-text-secondary: #5c564e;
    --app-text-muted: #7a7268;
    --app-border: #e0d6c4;
    --app-border-light: #efe6d8;
    --app-border-strong: #c9bba6;
    --app-surface-muted: #e8e0d2;
    --app-surface-table: #ebe3d6;
    --app-table-stripe: rgba(232, 224, 210, 0.55);
    --app-table-hover: #e6dcc8;
    --app-check-border: #8b7355;
    --app-check-text: #2c2824;
    --app-overlay: rgba(44, 40, 36, 0.4);
    --app-overlay-strong: rgba(26, 24, 22, 0.45);
    --app-scanner-bg: #1a1d20;

    /* ---- 語意色（成功／資訊等；資訊改暖米色階）---- */
    --app-success-bg: #e4efe0;
    --app-success-text: #3d6b45;
    --app-success-border: #b5c9b0;
    --app-info-bg: #efe6d8;
    --app-info-text: #6f5a42;
    --app-info-border: #d9cbb8;
    --app-emerald-bg: #e6efe4;
    --app-emerald-text: #3d6b45;

    /* ---- 尺寸／圓角／陰影 ---- */
    --app-sidebar-width: 260px;
    --app-radius: 14px;
    --app-radius-sm: 10px;
    --app-radius-lg: 18px;
    --app-shadow-sm: 0 1px 3px rgba(74, 55, 40, 0.07);
    --app-shadow: 0 4px 16px rgba(74, 55, 40, 0.09);
    --app-shadow-md: 0 8px 28px rgba(74, 55, 40, 0.12);
    --app-primary-rgb: 139, 115, 85;
    --app-accent-rgb: 166, 124, 82;

    /* ---- 漸層 ---- */
    --app-gradient-primary: linear-gradient(135deg, var(--app-primary-light) 0%, var(--app-primary) 100%);
    --app-gradient-primary-hover: linear-gradient(135deg, var(--app-primary-deep) 0%, var(--app-primary-hover) 100%);
    --app-gradient-accent: linear-gradient(135deg, var(--app-accent-light) 0%, var(--app-accent) 100%);
    --app-gradient-accent-hover: linear-gradient(135deg, var(--app-accent-mid) 0%, var(--app-accent-hover) 100%);
    --app-gradient-gold: linear-gradient(135deg, var(--app-gold-light) 0%, var(--app-gold) 100%);

    /* ---- 字型 ---- */
    --app-font: 'Noto Sans TC', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', sans-serif;

    /* ---- Bootstrap 對接 ---- */
    --bs-primary: var(--app-primary);
    --bs-primary-rgb: var(--app-primary-rgb);
    --bs-body-font-family: var(--app-font);
    --bs-body-color: var(--app-text);
    --bs-body-bg: var(--app-bg);
    --bs-border-color: var(--app-border);
    --bs-link-color: var(--app-primary);
    --bs-link-hover-color: var(--app-primary-hover);
    --bs-secondary-bg: var(--app-surface-muted);
    --bs-tertiary-bg: var(--app-surface-muted);
    --bs-card-bg: var(--app-surface);
    --bs-modal-bg: var(--app-surface);
    --bs-dropdown-bg: var(--app-surface);
    --bs-offcanvas-bg: var(--app-surface);
    --bs-toast-bg: var(--app-surface);
}

/* 淺色主按鈕：米色階底＋奶白字 */
.btn-primary {
    --bs-btn-color: #fffcf7;
    --bs-btn-hover-color: #fffcf7;
    --bs-btn-active-color: #fffcf7;
    --bs-btn-disabled-color: rgba(255, 252, 247, 0.65);
}

.nav-pills .nav-link.active,
.nav-pills .show > .nav-link {
    background-color: var(--app-primary);
    color: #fffcf7;
}

.form-check-input:checked {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
}

.form-select:focus,
.form-control:focus {
    border-color: var(--app-primary-muted);
    box-shadow: 0 0 0 0.2rem rgba(var(--app-primary-rgb), 0.18);
}

.page-link {
    color: var(--app-primary);
}
.page-item.active .page-link {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
    color: #fffcf7;
}
.badge.text-bg-primary {
    background-color: var(--app-primary) !important;
    color: #fffcf7 !important;
}

/* ---- 深色模式 ---- */
[data-theme="dark"] {
    --app-bg: #0f172a;
    --app-surface: #1e293b;
    /* 維持純白：圖示／白底按鈕等用途，勿改成深色 */
    --app-white: #ffffff;
    --app-primary: #38bdf8;
    --app-primary-hover: #7dd3fc;
    --app-primary-light: #0ea5e9;
    --app-primary-soft: #0c4a6e;
    --app-primary-muted: #075985;
    --app-primary-deep: #0284c7;
    --app-accent: #f472b6;
    --app-accent-hover: #f9a8d4;
    --app-accent-soft: #831843;
    --app-accent-muted: #9d174d;
    --app-accent-light: #ec4899;
    --app-accent-mid: #db2777;
    --app-navy: #e2e8f0;
    --app-navy-hover: #f8fafc;
    --app-gold: #fbbf24;
    --app-gold-soft: #78350f;
    --app-gold-light: #f59e0b;
    --app-text: #e2e8f0;
    --app-text-secondary: #cbd5e1;
    --app-text-muted: #94a3b8;
    --app-border: #334155;
    --app-border-light: #1e293b;
    --app-border-strong: #475569;
    --app-surface-muted: #162032;
    --app-surface-table: #1a2438;
    --app-table-stripe: rgba(255, 255, 255, 0.04);
    --app-table-hover: #0c4a6e;
    --app-check-border: #94a3b8;
    --app-check-text: #e2e8f0;
    --app-overlay: rgba(2, 6, 23, 0.6);
    --app-overlay-strong: rgba(0, 0, 0, 0.65);
    --app-scanner-bg: #020617;

    --app-success-bg: #14532d;
    --app-success-text: #86efac;
    --app-success-border: #166534;
    --app-info-bg: #1e3a8a;
    --app-info-text: #93c5fd;
    --app-info-border: #1d4ed8;
    --app-emerald-bg: #064e3b;
    --app-emerald-text: #6ee7b7;

    --app-shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35);
    --app-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
    --app-shadow-md: 0 8px 28px rgba(0, 0, 0, 0.45);
    --app-primary-rgb: 56, 189, 248;
    --app-accent-rgb: 244, 114, 182;

    --bs-secondary-bg: var(--app-surface-muted);
    --bs-tertiary-bg: var(--app-surface-muted);
    --bs-card-bg: var(--app-surface);
    --bs-modal-bg: var(--app-surface);
    --bs-dropdown-bg: var(--app-surface);
    --bs-offcanvas-bg: var(--app-surface);
    --bs-toast-bg: var(--app-surface);

    color-scheme: dark;
}

[data-theme="dark"] .btn-primary {
    --bs-btn-color: #0f172a;
    --bs-btn-hover-color: #0f172a;
    --bs-btn-active-color: #0f172a;
    --bs-btn-disabled-color: rgba(15, 23, 42, 0.65);
}

[data-theme="dark"] .nav-pills .nav-link.active,
[data-theme="dark"] .nav-pills .show > .nav-link {
    color: #0f172a;
}

[data-theme="dark"] .page-item.active .page-link {
    color: #0f172a;
}

[data-theme="dark"] .badge.text-bg-primary {
    color: #0f172a !important;
}