/**
 * CSS 变量定义
 * 统一管理颜色、尺寸、间距等基础变量
 */

:root {
    /* ========== 颜色 - 与 EasyUI 主题一致 ========== */
    --color-border: #95B8E7;
    --color-border-light: #ddd;
    --color-bg-panel: #fff;
    --color-bg-header: linear-gradient(to bottom, #F4F4F4 0%, #E8E8E8 100%);
    --color-text: #000;
    --color-text-muted: #aaa;
    --color-text-secondary: #666;
    --color-link: #0066CC;
    --color-link-hover: #004499;

    /* ========== 图标语义色 - Font Awesome ========== */
    --icon-primary: #409EFF;    /* 蓝色 - 系统/设置/查看 */
    --icon-success: #67C23A;    /* 绿色 - 新增/成功/启用 */
    --icon-warning: #E6A23C;    /* 橙色 - 编辑/修改/警告 */
    --icon-danger: #F56C6C;     /* 红色 - 删除/禁用/错误 */
    --icon-purple: #9C27B0;     /* 紫色 - 权限/支付/下载 */
    --icon-cyan: #00BCD4;       /* 青色 - 应用/队列/上传 */
    --icon-gray: #606266;       /* 灰色 - 文档/日志/取消 */
    --icon-pink: #FF4081;       /* 粉色 - 主题 */

    /* ========== 尺寸 - 输入框宽度（5档标准） ========== */
    --input-w-xs: 80px;         /* 短数字: ID、序号、数量、评分 */
    --input-w-sm: 120px;        /* 选择框/短文本: 状态、类型、姓名、简称 */
    --input-w-md: 180px;        /* 常规文本(默认): 名称、标题、手机号 */
    --input-w-lg: 250px;        /* 长文本: 邮箱、地址、商户全称 */
    --input-w-xl: 320px;        /* 超长文本/多行: 描述、备注、命令 */

    /* ========== 尺寸 - 弹窗宽度 ========== */
    /* 计算公式: padding(60) + 标签宽度 + 星号(20) + 输入框宽度 */
    --dialog-sm: 360px;         /* form-label(55) + w-220 */
    --dialog-md: 390px;         /* form-label(55) + w-250 */
    --dialog-lg: 410px;         /* form-label-lg(75) + w-250 */
    --dialog-xl: 430px;         /* form-label-xl(95) + w-250 */
    --dialog-xxl: 500px;        /* 超长标签/输入框 或带列表 */
    --dialog-2xl: 650px;        /* 数据权限/认证等复杂弹窗 */
    --dialog-3xl: 700px;        /* 日志详情/列选择等展示弹窗 */
    --dialog-4xl: 800px;        /* SQL详情等超大展示弹窗 */

    /* ========== 尺寸 - 表单标签宽度 ========== */
    --label-w-sm: 55px;         /* 2字标签 */
    --label-w-md: 55px;         /* 2字标签（默认） */
    --label-w-lg: 75px;         /* 3-4字标签 */
    --label-w-xl: 95px;         /* 5字及以上 */

    /* ========== 尺寸 - 组件高度 ========== */
    --input-height: 24px;
    --btn-height: 24px;
    --toolbar-height: 34px;

    /* ========== 间距 ========== */
    --spacing-xs: 5px;
    --spacing-sm: 10px;
    --spacing-md: 15px;
    --spacing-lg: 20px;
    --spacing-xl: 30px;

    /* ========== 圆角 ========== */
    --radius-sm: 3px;
    --radius-md: 5px;

    /* ========== 字体 ========== */
    --font-family: Tahoma, Verdana, "Microsoft YaHei", sans-serif;
    --font-family-icon: "Font Awesome 5 Free";
    --font-size-base: 12px;
    --font-size-sm: 11px;
    --font-size-lg: 14px;

    /* ========== z-index 层级规范 ==========
     *
     * 层级          z-index           用途
     * ──────────────────────────────────────────────────
     * 基础层        1 - 200           页面内组件（badge、resizer、header sticky）
     * EasyUI 弹窗   9,000+            Window / Dialog（框架自增，勿硬编码）
     * 日期选择器    10,000            daterange picker（独立定位）
     * Agent 面板    99,990-100,030    FAB → 主面板 → 内部弹窗
     * EasyUI 菜单   110,000+          Menu（框架自增，勿硬编码）
     * EasyUI 提示   9,900,000         Tooltip（框架默认，勿修改）
     * 水印层        19,000,000        全局水印（覆盖所有可见内容，pointer-events:none）
     * 通知层        29,000,000        Toast（唯一高于水印，短暂提示不影响截图）
     *
     * 原则：所有可见内容 < 水印 < Toast
     * 水印防截图泄露，必须覆盖弹窗/菜单/提示等一切内容
     * Toast 是操作反馈，短暂显示不影响截图，所以在水印之上
     */
    --z-watermark: 19000000;
    --z-toast: 29000000;
}
