/* ==========================================================================
 * 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;

    /* ===== 间距（与 ecaps.css 工具类 .m-t-xs 等档位一致）===== */
    --space-xxs: 5px;
    --space-xs: 10px;
    --space-sm: 15px;
    --space-md: 20px;
    --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;

    /* ===== 圆角 ===== */
    --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);
}