/* ==========================================================================
 * design-tokens.css — 全局设计令牌（z-index / 阴影 / 颜色）
 *
 * 加载位置：resource_css.jsp（iframe）+ sysIndex-ecaps.jsp（主框架）
 * 所有页面共享，插件 class-scoped 变量不在此声明
 * ========================================================================== */
:root {
    /* ===== 颜色 ===== */
    --color-primary: #376aea;
    --color-text: #222222;
    --color-text-strong: #000000;        /* 强调文字（弹窗标题等需要加重对比的场景） */
    --color-text-secondary: #707070;
    --color-border: #cecece;
    --color-border-light: #f0f0f0;       /* 次级分隔（弹窗标题底边等轻量分割线） */
    --color-bg-header: #ebf3ff;
    --color-primary-light: #E0ECFD;
    --color-drawer-title-bg: #D2DEFD;    /* 抽屉标题背景（bottom/right 抽屉共用） */
    --color-selected: #ffdea6;
    --color-bg-stripe: #f9fafb;
    --color-danger: #ff1578;

    /* ===== 语义色（状态/反馈）===== */
    --color-error: #cf1322;            /* 逾期 / 错误文字 */
    --color-error-bg: #fff1f0;         /* 错误背景 */
    --color-error-border: #ffa39e;     /* 错误边框（与 warning-border 对称） */
    --color-warning: #d97706;          /* 警告文字（琥珀） */
    --color-warning-bg: #fffbeb;       /* 警告背景 */
    --color-warning-border: #fde68a;   /* 警告边框 */
    --color-success: #059669;          /* 成功文字（绿） */
    --color-success-bg: #f0fdf4;       /* 成功背景 */
    --color-success-border: #b7eb8f;   /* 成功边框（与 warning-border 对称） */
    --color-info: #722ed1;             /* 信息文字（紫，用于委派/SubAgent 等"补充流程"语义） */
    --color-info-bg: #f9f0ff;          /* 信息背景 */
    --color-info-border: #d3adf7;      /* 信息边框 */
    --color-neutral-text: #6b7280;     /* 中性文字（灰） */
    --color-neutral-bg: #f3f4f6;       /* 中性背景 */

    /* ===== 阴影 ===== */
    --shadow-xs: 0 1px 2px rgba(0,0,0,0.04);
    --shadow-sm: 0 2px 8px rgba(0,0,0,0.06);
    --shadow-md: 0 4px 16px rgba(0,0,0,0.08);
    --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);
    --shadow-primary: 0 2px 8px rgba(24,144,255,0.2);
    --shadow-dropdown: 0 0 5px 0 rgba(0, 0, 0, 0.2);
    --shadow-panel: 0 6px 12px -4px rgba(0, 0, 0, 0.15);
    --shadow-menu: 0 5px 5px -5px rgba(0, 0, 0, 0.1);
    --shadow-modal: 0 0 0 1px rgba(0,0,0,0.03), 0 8px 24px rgba(0,0,0,0.06), 0 24px 48px rgba(0,0,0,0.08);

    /* ===== z-index：全局层级 ===== */
    --z-content: 1;
    --z-content-top: 10;
    --z-fixed: 100;
    --z-fixed-toggle: 101;
    --z-navbar: 1000;
    --z-navbar-tab: 1032;
    --z-navbar-controls: 1098;
    --z-sidebar-panel: 1040;
    --z-dropdown: 2000;
    --z-tooltip: 4070;
    --z-modal-backdrop: 5000;
    --z-modal: 5050;
    --z-system-top: 10000;

    /* ===== z-index：DataTable 内部层级 ===== */
    --z-cell: 90;
    --z-cell-fixed: 99;
    --z-sticky: 500;
    --z-thead: 501;
    --z-above-thead: 502;
    --z-drag: 99999;
    --z-overlay: 99999999;

    /* ===== 间距 — Tailwind 数字档 (新代码标准) =====
       为什么用数字而非 xs/sm/md：数字档 4px 增量更细，组件间距永远能精确到 4 倍数；
       同一界面用同一档 = 一致性默认结果。t-shirt 档 (xxs/xs/sm...) 仅老组件兼容，
       新增 / 重构必用数字档。 */
    --space-0: 0;
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-8: 32px;
    --space-10: 40px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;
    /* t-shirt 档：仅老组件兼容，新代码禁用 */
    --space-xxs: 5px;               /* 老 */
    --space-xs: 10px;               /* 老 */
    --space-sm: 15px;               /* 老 */
    --space-md: 20px;               /* 老 = var(--space-5) */
    --space-lg: 25px;               /* 老 */
    --space-xxl: 30px;              /* 老 */

    /* ===== 字体 ===== */
    --font-size-xs: 11px;
    --font-size-sm: 12px;
    --font-size-md: 13px;           /* 辅助文字 */
    --font-size-base: 14px;         /* 正文默认 */
    --font-size-lg: 16px;
    --font-size-xl: 18px;
    --font-size-2xl: 20px;
    --font-size-3xl: 24px;

    /* 字重 — 中文场景标题 600 即足够,1000 过粗;正文 400,标题 500/600,强调 700 */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* 行高 — 中文比英文紧 (英文常用 1.5/1.625, 中文 1.5 已够松) */
    --line-height-tight: 1.25;      /* 标题、按钮、紧凑场景 */
    --line-height-normal: 1.5;      /* 正文默认 */
    --line-height-relaxed: 1.75;    /* 长段落、说明文字 */

    /* ===== 圆角 ===== */
    --radius-xs: 2px;               /* 旧组件 */
    --radius-sm: 4px;               /* 按钮、输入框 */
    --radius-md: 6px;               /* 卡片 */
    --radius-lg: 8px;               /* 弹窗 */
    --radius-xl: 12px;              /* 大卡片 */
    --radius-full: 9999px;          /* 药丸形标签 */

    /* ===== 动效 ===== */
    --duration-fast: 0.15s;
    --duration-normal: 0.25s;
    --duration-slow: 0.35s;
    --ease-default: ease;
    --ease-in-out: ease-in-out;
    --ease-out: ease-out;

    /* ===== 控件尺寸 ===== */
    --control-height-sm: 24px;
    --control-height-md: 28px;      /* 按钮/输入框标准高度 */
    --control-height-lg: 36px;

    /* ===== 过渡兼容：--dt-* → 全局名（计划 v2.2 移除）===== */
    --dt-z-cell: var(--z-cell);
    --dt-z-cell-fixed: var(--z-cell-fixed);
    --dt-z-sticky: var(--z-sticky);
    --dt-z-thead: var(--z-thead);
    --dt-z-above-thead: var(--z-above-thead);
    --dt-z-drag: var(--z-drag);
    --dt-z-overlay: var(--z-overlay);
    --dt-shadow-dropdown: var(--shadow-dropdown);
    --dt-shadow-panel: var(--shadow-panel);
    --dt-shadow-menu: var(--shadow-menu);
    --dt-shadow-modal: var(--shadow-modal);
}
