/* 设计令牌：所有 v2 页面只允许引用这里的变量，不得硬编码色值。 */

:root,
[data-theme="dark"] {
    color-scheme: dark;

    --bg-body: #12121f;
    --bg-gradient: linear-gradient(135deg, #1a1a2e 0%, #16213e 50%, #0f3460 100%);
    --bg-sidebar: #16162a;
    --bg-topbar: rgba(22, 22, 42, 0.92);
    --bg-surface: #1a1a2e;
    --bg-surface-2: rgba(255, 255, 255, 0.06);
    --bg-surface-3: rgba(255, 255, 255, 0.10);
    --bg-input: rgba(255, 255, 255, 0.06);
    --bg-overlay: rgba(0, 0, 0, 0.45);
    --bg-row-hover: rgba(255, 255, 255, 0.04);

    --border: rgba(255, 255, 255, 0.12);
    --border-strong: rgba(255, 255, 255, 0.20);

    --text: #e8e8e8;
    --text-strong: #ffffff;
    --text-muted: #a0a0a0;
    --text-faint: #6b6b6b;

    --accent: #e94560;
    --accent-2: #c73e54;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(233, 69, 96, 0.16);
    --accent-border: rgba(233, 69, 96, 0.45);

    --success: #66bb6a;
    --success-soft: rgba(102, 187, 106, 0.16);
    --warning: #ffb74d;
    --warning-soft: rgba(255, 183, 77, 0.16);
    --danger: #ef5350;
    --danger-soft: rgba(239, 83, 80, 0.16);
    --info: #64b5f6;
    --info-soft: rgba(100, 181, 246, 0.16);
    --neutral-soft: rgba(255, 255, 255, 0.10);

    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.25);
    --shadow-md: 0 8px 24px rgba(0, 0, 0, 0.32);
    --shadow-lg: -8px 0 32px rgba(0, 0, 0, 0.35);

    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23a6adc8' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}

[data-theme="light"] {
    color-scheme: light;

    --bg-body: #f4f5f9;
    --bg-gradient: linear-gradient(135deg, #f7f8fc 0%, #eef1f8 50%, #e7ecf6 100%);
    --bg-sidebar: #ffffff;
    --bg-topbar: rgba(255, 255, 255, 0.92);
    --bg-surface: #ffffff;
    --bg-surface-2: rgba(15, 23, 42, 0.04);
    --bg-surface-3: rgba(15, 23, 42, 0.08);
    --bg-input: #ffffff;
    --bg-overlay: rgba(15, 23, 42, 0.35);
    --bg-row-hover: rgba(15, 23, 42, 0.03);

    --border: rgba(15, 23, 42, 0.12);
    --border-strong: rgba(15, 23, 42, 0.22);

    --text: #1f2430;
    --text-strong: #0f172a;
    --text-muted: #64748b;
    --text-faint: #94a3b8;

    --accent: #d63652;
    --accent-2: #b62a44;
    --accent-contrast: #ffffff;
    --accent-soft: rgba(214, 54, 82, 0.10);
    --accent-border: rgba(214, 54, 82, 0.40);

    --success: #2e9e58;
    --success-soft: rgba(46, 158, 88, 0.12);
    --warning: #c77700;
    --warning-soft: rgba(199, 119, 0, 0.12);
    --danger: #d33a35;
    --danger-soft: rgba(211, 58, 53, 0.12);
    --info: #1f6fd0;
    --info-soft: rgba(31, 111, 208, 0.12);
    --neutral-soft: rgba(15, 23, 42, 0.06);

    --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.10);
    --shadow-md: 0 8px 24px rgba(15, 23, 42, 0.12);
    --shadow-lg: -8px 0 32px rgba(15, 23, 42, 0.14);

    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2364748b' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
}

:root {
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;

    --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
    --fs-xs: 0.78rem;
    --fs-sm: 0.85rem;
    --fs-md: 0.92rem;
    --fs-lg: 1.05rem;
    --fs-xl: 1.25rem;

    --sidebar-width: 232px;
    --sidebar-width-collapsed: 64px;
    --topbar-height: 56px;
    --z-drawer: 900;
    --z-modal: 1000;
    --z-toast: 1100;
    --z-busy: 1200;
}

/* 主题切换时避免整页闪烁，但不拖慢滚动与展开动画 */
.theme-transition,
.theme-transition * {
    transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease !important;
}