/* =====================================================
   theme.css — 设计令牌（唯一配色真值）+ 明/暗/系统 三态
   设计方向：温暖专业的「苔绿 + 陶土橙」（替换原蓝灰）
   本文件双命名：既定义新 token，又别名旧 token 名，
   使现有 components/table/modal/calendar/upload 的 CSS
   不改一行即整体换色。Blade / wire:* 绑定不受影响。
   ===================================================== */

/* ---------- 字体 / 动效 / 图标（浅色默认值） ---------- */
:root {
    --font-sans: "PingFang SC", "Microsoft YaHei", "Noto Sans SC", "Hiragino Sans GB", "WenQuanYi Micro Hei", sans-serif;
    --font-mono: "SF Mono", "JetBrains Mono", "Fira Code", "Consolas", monospace;

    --transition-fast: 150ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-normal: 250ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow: 350ms cubic-bezier(0.16, 1, 0.3, 1);
    --transition: 250ms cubic-bezier(0.16, 1, 0.3, 1);

    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --radius-xl: 20px;
    --radius-full: 9999px;
    --border-radius: var(--radius-md);

    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.04);
    --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.06), 0 2px 4px -2px rgb(0 0 0 / 0.04);
    --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.08), 0 4px 6px -4px rgb(0 0 0 / 0.04);
    --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.04);
    --shadow: var(--shadow-md);

    /* ============ 新设计 token（苔绿 + 陶土橙） ============ */
    --bg-base: #fafaf9;
    --bg-surface: #ffffff;
    --bg-surface-raised: #f5f5f4;
    --bg-surface-hover: #fafaf9;
    --bg-sidebar: #ffffff;
    --bg-sidebar-hover: #f5f5f4;
    --bg-sidebar-active: #d1fae5;

    --text-primary: #1c1917;
    --text-secondary: #78716c;
    --text-tertiary: #a8a29e;
    --text-inverse: #fafaf9;
    --text-sidebar: #57534e;
    --text-sidebar-active: #065f46;
    --text-sidebar-hover: #1c1917;
    --text-sidebar-brand: #1c1917;

    --primary: #059669;
    --primary-50:  #ecfdf5;
    --primary-100: #d1fae5;
    --primary-200: #a7f3d0;
    --primary-600: #047857;
    --primary-700: #065f46;

    --accent: #ea580c;
    --accent-50:  #fff7ed;
    --accent-100: #ffedd5;
    --accent-600: #c2410c;

    --success: #059669;
    --success-50:  #ecfdf5;
    --success-100: #d1fae5;
    --warning: #d97706;
    --warning-50:  #fffbeb;
    --warning-100: #fef3c7;
    --error: #e11d48;
    --error-50:  #fff1f2;
    --error-100: #ffe4e6;
    --info: #0891b2;
    --info-50:  #ecfeff;
    --info-100: #cffafe;

    --status-active: #059669;
    --status-active-bg: #d1fae5;
    --status-archived: #78716c;
    --status-archived-bg: #f5f5f4;
    --status-expired: #e11d48;
    --status-expired-bg: #ffe4e6;
    --status-warning: #d97706;
    --status-warning-bg: #fef3c7;

    --border: #e7e5e4;
    --border-strong: #d6d3d1;
    --border-sidebar: #e7e5e4;

    --overlay: rgb(0 0 0 / 0.45);
    --focus-ring: rgb(5 150 105 / 0.35);

    /* ============ 旧 token 别名（映射到新值，供现有组件 CSS 复用） ============ */
    --primary-dark: #065f46;     /* .btn-primary:hover、侧栏渐变、报表周期 */
    --primary-hover: #047857;
    --primary-light: #d1fae5;    /* 浅底（广泛使用的柔和主色底） */
    --primary-soft: rgb(5 150 105 / 0.18);
    --success-light: #d1fae5;
    --warning-light: #fef3c7;
    --danger: #e11d48;
    --danger-light: #ffe4e6;
    --purple: #7c3aed;
    --purple-light: #f3e8ff;
    --amber: #d97706;
    --amber-light: #fef3c7;

    --gray-50:  #fafaf9;
    --gray-100: #f5f5f4;
    --gray-200: #e7e5e4;
    --gray-300: #d6d3d1;
    --gray-400: #a8a29e;
    --gray-500: #78716c;
    --gray-600: #57534e;
    --gray-700: #44403c;
    --gray-800: #1c1917;
    --gray-900: #0c0a09;

    --bg-app: #fafaf9;
    --bg-surface-2: #f5f5f4;
    --text: #1c1917;
    --text-muted: #78716c;
    --text-subtle: #a8a29e;
}

/* ============================================================
   深色主题
   ============================================================ */
[data-theme="dark"] {
    --bg-base: #0c0a09;
    --bg-surface: #1c1917;
    --bg-surface-raised: #292524;
    --bg-surface-hover: #292524;
    --bg-sidebar: #0c0a09;
    --bg-sidebar-hover: #1c1917;
    --bg-sidebar-active: #059669;

    --text-primary: #f5f5f4;
    --text-secondary: #a8a29e;
    --text-tertiary: #78716c;
    --text-inverse: #1c1917;
    --text-sidebar: #a8a29e;
    --text-sidebar-active: #ffffff;
    --text-sidebar-hover: #ffffff;
    --text-sidebar-brand: #ffffff;

    --primary: #34d399;
    --primary-50:  #064e3b;
    --primary-100: #065f46;
    --primary-200: #047857;
    --primary-600: #6ee7b7;
    --primary-700: #a7f3d0;

    --accent: #fb923c;
    --accent-50:  #431407;
    --accent-100: #7c2d12;
    --accent-600: #fdba74;

    --success: #34d399;
    --success-50:  #064e3b;
    --success-100: #065f46;
    --warning: #fbbf24;
    --warning-50:  #451a03;
    --warning-100: #78350f;
    --error: #fb7185;
    --error-50:  #4c0519;
    --error-100: #881337;
    --info: #22d3ee;
    --info-50:  #164e63;
    --info-100: #155e75;

    --status-active: #34d399;
    --status-active-bg: #064e3b;
    --status-archived: #a8a29e;
    --status-archived-bg: #292524;
    --status-expired: #fb7185;
    --status-expired-bg: #4c0519;
    --status-warning: #fbbf24;
    --status-warning-bg: #451a03;

    --border: #44403c;
    --border-strong: #57534e;
    --border-sidebar: #292524;

    --overlay: rgb(0 0 0 / 0.65);
    --focus-ring: rgb(52 211 153 / 0.35);

    /* 旧 token 别名 → 暗色新值 */
    --primary-dark: #6ee7b7;
    --primary-hover: #6ee7b7;
    --primary-light: #065f46;
    --primary-soft: rgb(52 211 153 / 0.2);
    --success-light: #064e3b;
    --warning-light: #78350f;
    --danger: #fb7185;
    --danger-light: #881337;
    --purple: #c4b5fd;
    --purple-light: #4c1d95;
    --amber: #fbbf24;
    --amber-light: #78350f;

    --gray-50:  #1c1917;
    --gray-100: #292524;
    --gray-200: #44403c;
    --gray-300: #57534e;
    --gray-400: #78716c;
    --gray-500: #a8a29e;
    --gray-600: #a8a29e;
    --gray-700: #d6d3d1;
    --gray-800: #f5f5f4;
    --gray-900: #0c0a09;

    --bg-app: #0c0a09;
    --bg-surface-2: #292524;
    --text: #f5f5f4;
    --text-muted: #a8a29e;
    --text-subtle: #78716c;
}

/* 硬编码白色元素的暗色覆盖（沿用原机制，--bg-surface/--border 已为新暗值） */
[data-theme="dark"] .topbar,
[data-theme="dark"] .card,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .filter-bar,
[data-theme="dark"] .input,
[data-theme="dark"] .btn-secondary,
[data-theme="dark"] .report-table,
[data-theme="dark"] .modal,
[data-theme="dark"] .import-modal,
[data-theme="dark"] .imp-card,
[data-theme="dark"] .imp-rows,
[data-theme="dark"] .att-card,
[data-theme="dark"] .att-card .cap,
[data-theme="dark"] .cal-modal-wrap,
[data-theme="dark"] .cal-modal-close,
[data-theme="dark"] .cal-day.other-month,
[data-theme="dark"] .calendar-wrap,
[data-theme="dark"] .cal-nav-btn,
[data-theme="dark"] .tbl-thumb,
[data-theme="dark"] .imp-drop,
[data-theme="dark"] .imp-empty,
[data-theme="dark"] .imp-done-stat,
[data-theme="dark"] .detail-remark { background: var(--bg-surface) !important; }

[data-theme="dark"] .topbar { border-color: var(--border) !important; }
[data-theme="dark"] .modal-header,
[data-theme="dark"] .modal-footer,
[data-theme="dark"] .import-modal-header,
[data-theme="dark"] .import-modal-footer { border-color: var(--border) !important; }
[data-theme="dark"] .cal-day { background: var(--bg-surface-2) !important; border-color: var(--border) !important; }
[data-theme="dark"] .cal-day.other-month:hover { background: var(--bg-surface-2) !important; }

[data-theme="dark"] .detail-item span,
[data-theme="dark"] .modal-header h2,
[data-theme="dark"] .modal-header h3,
[data-theme="dark"] .cal-modal-title,
[data-theme="dark"] .report-section-title,
[data-theme="dark"] .cal-store-info strong,
[data-theme="dark"] .cal-date-num,
[data-theme="dark"] .topbar-title { color: var(--text) !important; }
[data-theme="dark"] .att-card .cap,
[data-theme="dark"] .cal-driver,
[data-theme="dark"] .cal-plate { color: var(--text-muted) !important; }

[data-theme="dark"] .modal-body::-webkit-scrollbar-thumb,
[data-theme="dark"] .import-modal-body::-webkit-scrollbar-thumb { background: var(--border-strong); }
[data-theme="dark"] .modal-body,
[data-theme="dark"] .import-modal-body { scrollbar-color: var(--border-strong) transparent; }

/* ============================================================
   跟随系统：仅当系统偏好为深色时应用上述暗色规则
   ============================================================ */
@media (prefers-color-scheme: dark) {
    [data-theme="system"] {
        --bg-base: #0c0a09;
        --bg-surface: #1c1917;
        --bg-surface-raised: #292524;
        --bg-surface-hover: #292524;
        --bg-sidebar: #0c0a09;
        --bg-sidebar-hover: #1c1917;
        --bg-sidebar-active: #059669;

        --text-primary: #f5f5f4;
        --text-secondary: #a8a29e;
        --text-tertiary: #78716c;
        --text-inverse: #1c1917;
        --text-sidebar: #a8a29e;
        --text-sidebar-active: #ffffff;
        --text-sidebar-hover: #ffffff;
        --text-sidebar-brand: #ffffff;

        --primary: #34d399;
        --primary-50:  #064e3b;
        --primary-100: #065f46;
        --primary-200: #047857;
        --primary-600: #6ee7b7;
        --primary-700: #a7f3d0;

        --accent: #fb923c;
        --accent-50:  #431407;
        --accent-100: #7c2d12;
        --accent-600: #fdba74;

        --success: #34d399;
        --success-50:  #064e3b;
        --success-100: #065f46;
        --warning: #fbbf24;
        --warning-50:  #451a03;
        --warning-100: #78350f;
        --error: #fb7185;
        --error-50:  #4c0519;
        --error-100: #881337;
        --info: #22d3ee;
        --info-50:  #164e63;
        --info-100: #155e75;

        --status-active: #34d399;
        --status-active-bg: #064e3b;
        --status-archived: #a8a29e;
        --status-archived-bg: #292524;
        --status-expired: #fb7185;
        --status-expired-bg: #4c0519;
        --status-warning: #fbbf24;
        --status-warning-bg: #451a03;

        --border: #44403c;
        --border-strong: #57534e;
        --border-sidebar: #292524;

        --overlay: rgb(0 0 0 / 0.65);
        --focus-ring: rgb(52 211 153 / 0.35);

        --primary-dark: #6ee7b7;
        --primary-hover: #6ee7b7;
        --primary-light: #065f46;
        --primary-soft: rgb(52 211 153 / 0.2);
        --success-light: #064e3b;
        --warning-light: #78350f;
        --danger: #fb7185;
        --danger-light: #881337;
        --purple: #c4b5fd;
        --purple-light: #4c1d95;
        --amber: #fbbf24;
        --amber-light: #78350f;

        --gray-50:  #1c1917;
        --gray-100: #292524;
        --gray-200: #44403c;
        --gray-300: #57534e;
        --gray-400: #78716c;
        --gray-500: #a8a29e;
        --gray-600: #a8a29e;
        --gray-700: #d6d3d1;
        --gray-800: #f5f5f4;
        --gray-900: #0c0a09;

        --bg-app: #0c0a09;
        --bg-surface-2: #292524;
        --text: #f5f5f4;
        --text-muted: #a8a29e;
        --text-subtle: #78716c;
    }
    [data-theme="system"] .topbar,
    [data-theme="system"] .card,
    [data-theme="system"] .stat-card,
    [data-theme="system"] .filter-bar,
    [data-theme="system"] .input,
    [data-theme="system"] .btn-secondary,
    [data-theme="system"] .report-table,
    [data-theme="system"] .modal,
    [data-theme="system"] .import-modal,
    [data-theme="system"] .imp-card,
    [data-theme="system"] .imp-rows,
    [data-theme="system"] .att-card,
    [data-theme="system"] .att-card .cap,
    [data-theme="system"] .cal-modal-wrap,
    [data-theme="system"] .cal-modal-close,
    [data-theme="system"] .cal-day.other-month,
    [data-theme="system"] .calendar-wrap,
    [data-theme="system"] .cal-nav-btn,
    [data-theme="system"] .tbl-thumb,
    [data-theme="system"] .imp-drop,
    [data-theme="system"] .imp-empty,
    [data-theme="system"] .imp-done-stat,
    [data-theme="system"] .detail-remark { background: var(--bg-surface) !important; }
    [data-theme="system"] .topbar { border-color: var(--border) !important; }
    [data-theme="system"] .modal-header,
    [data-theme="system"] .modal-footer,
    [data-theme="system"] .import-modal-header,
    [data-theme="system"] .import-modal-footer { border-color: var(--border) !important; }
    [data-theme="system"] .cal-day { background: var(--bg-surface-2) !important; border-color: var(--border) !important; }
    [data-theme="system"] .cal-day.other-month:hover { background: var(--bg-surface-2) !important; }
    [data-theme="system"] .detail-item span,
    [data-theme="system"] .modal-header h2,
    [data-theme="system"] .modal-header h3,
    [data-theme="system"] .cal-modal-title,
    [data-theme="system"] .report-section-title,
    [data-theme="system"] .cal-store-info strong,
    [data-theme="system"] .cal-date-num,
    [data-theme="system"] .topbar-title { color: var(--text) !important; }
    [data-theme="system"] .att-card .cap,
    [data-theme="system"] .cal-driver,
    [data-theme="system"] .cal-plate { color: var(--text-muted) !important; }
    [data-theme="system"] .modal-body::-webkit-scrollbar-thumb,
    [data-theme="system"] .import-modal-body::-webkit-scrollbar-thumb { background: var(--border-strong); }
    [data-theme="system"] .modal-body,
    [data-theme="system"] .import-modal-body { scrollbar-color: var(--border-strong) transparent; }
}

/* ============================================================
   尊重「减少动态效果」偏好（无障碍）
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}