/* ==========================================================================
   全域樣式設定（Theme / CSS Variables）
   修改配色、圓角、陰影請優先改此檔，勿在各頁面硬寫色碼。
   ========================================================================== */

:root {
    /* ---- 色票 ---- */
    --app-bg: #f4f6f9;
    --app-surface: #ffffff;
    --app-white: #ffffff;
    --app-primary: #0284c7;
    --app-primary-hover: #0369a1;
    --app-primary-light: #38bdf8;
    --app-primary-soft: #e0f2fe;
    --app-primary-muted: #bae6fd;
    --app-primary-deep: #0ea5e9;
    --app-accent: #db2777;
    --app-accent-hover: #be185d;
    --app-accent-soft: #fdf2f8;
    --app-accent-muted: #fbcfe8;
    --app-accent-light: #f472b6;
    --app-accent-mid: #ec4899;
    --app-navy: #1e293b;
    --app-navy-hover: #0f172a;
    --app-gold: #d97706;
    --app-gold-soft: #fef3c7;
    --app-gold-light: #fbbf24;
    --app-text: #1e293b;
    --app-text-secondary: #475569;
    --app-text-muted: #64748b;
    --app-border: #e2e8f0;
    --app-border-light: #f1f5f9;
    --app-border-strong: #cbd5e1;
    --app-surface-muted: #f8fafc;
    --app-surface-table: #f1f3f5;
    --app-table-stripe: rgba(241, 245, 249, 0.7);
    --app-table-hover: #e0f2fe;
    --app-check-border: #495057;
    --app-check-text: #212529;
    --app-overlay: rgba(15, 23, 42, 0.4);
    --app-overlay-strong: rgba(0, 0, 0, 0.45);
    --app-scanner-bg: #1a1d20;

    /* ---- 語意色（成功／資訊等）---- */
    --app-success-bg: #dcfce7;
    --app-success-text: #15803d;
    --app-success-border: #86efac;
    --app-info-bg: #dbeafe;
    --app-info-text: #1d4ed8;
    --app-info-border: #93c5fd;
    --app-emerald-bg: #ecfdf5;
    --app-emerald-text: #047857;

    /* ---- 尺寸／圓角／陰影 ---- */
    --app-sidebar-width: 260px;
    --app-radius: 14px;
    --app-radius-sm: 10px;
    --app-radius-lg: 18px;
    --app-shadow-sm: 0 1px 3px rgba(30, 41, 59, 0.06);
    --app-shadow: 0 4px 16px rgba(30, 41, 59, 0.08);
    --app-shadow-md: 0 8px 28px rgba(30, 41, 59, 0.12);
    --app-primary-rgb: 2, 132, 199;
    --app-accent-rgb: 219, 39, 119;

    /* ---- 漸層 ---- */
    --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: 'Inter', -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);
}

/* ---- 深色模式 ---- */
[data-theme="dark"] {
    --app-bg: #0f172a;
    --app-surface: #1e293b;
    --app-white: #1e293b;
    --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;

    color-scheme: dark;
}

