/* ==================== Z-Index 层级系统 v2.0 ====================
 * 
 * 📖 使用说明:
 * 1. 本文件定义了全局z-index CSS变量
 * 2. 所有组件必须使用变量，禁止硬编码数字
 * 3. 如需新增层级，必须在下方注释说明原因
 * 4. 严禁使用 !important 覆盖z-index
 *
 * 🎯 设计目标:
 * - 最大支持5层弹窗嵌套
 * - Toast通知不遮挡任何弹窗 (Toast: 9000 < Modal: 1010+)
 * - 层次清晰，易于理解和扩展
 * - 总范围控制在 0-9999
 *
 * 📅 创建时间: 2026-05-03
 * 📝 维护负责人: AI Assistant + Development Team
 * 🔗 相关文档: .trae/rules/taobaoguize.md
 */

:root {
  /* ================================================================
   * LAYER 0: 页面内容层 (0 - 999)
   * 用于: 正常文档流、轻微层叠效果、Sticky定位
   * ================================================================ */
  
  --z-base:            0;        /* 默认文档流 */
  --z-content:          1;        /* 一般内容层叠 */
  --z-raised:          10;       /* 卡片阴影效果 */
  --z-sticky:          10;       /* Sticky定位元素 */
  --z-sticky-header:   15;       /* 表格粘性头部 */
  --z-badge:           20;       /* 徽章/角标/排名标签 */
  --z-dropdown-trigger: 50;       /* 下拉触发器 */
  --z-tooltip:         100;      /* 工具提示框 */
  --z-dropdown:        200;      /* 下拉菜单 */
  --z-popover:         300;      /* 气泡弹出框 */
  --z-fixed-header:    400;      /* 固定头部导航 */
  --z-fab:             500;      /* FAB悬浮操作按钮 */
  --z-inline-sidebar:  600;      /* 内联侧边栏 */
  --z-page-overlay:    900;      /* 页面级遮罩(如loading)*/

  /* ================================================================
   * LAYER 1: 基础弹窗层 (1000 - 1999)
   * 用于: 标准模态对话框、确认框、表单弹窗
   * 支持: 5级嵌套（每级+100）
   * 
   * 层级分配:
   *   1000-1009: 弹窗遮罩背景
   *   1010-1099: 基础弹窗容器（第0层嵌套）
   *   1100-1199: 第1层嵌套弹窗
   *   1200-1299: 第2层嵌套弹窗（预留）
   *   1300-1399: 第3层嵌套弹窗（预留）
   *   1400-1499: 第4层嵌套弹窗（预留）
   *   1500-1599: 侧边栏式弹窗（比普通嵌套高一级）
   * ================================================================ */
  
  --z-modal-backdrop:  1000;     /* 弹窗半透明遮罩背景 */
  --z-modal-base:      1010;     /* 基础弹窗（第0层嵌套）*/
  --z-modal-nested-1:  1100;     /* 第1层嵌套弹窗 */
  --z-modal-nested-2:  1200;     /* 第2层嵌套弹窗（预留）*/
  --z-modal-nested-3:  1300;     /* 第3层嵌套弹窗（预留）*/
  --z-modal-nested-4:  1400;     /* 第4层嵌套弹窗（预留）*/
  --z-modal-sidebar:   1500;     /* 侧边栏式弹窗(AI分析/对话面板)*/

  /* ================================================================
   * LAYER 2-3: 扩展层 (2000 - 3999)
   * 用于: 动态创建的弹窗、深层嵌套、特殊场景
   * ================================================================ */
  
  --z-modal-deep-1:    2000;     /* 深层嵌套（第5层及以后）*/
  --z-dynamic-dialog:  3000;     /* JavaScript动态创建的确认对话框 */

  /* ================================================================
   * LAYER 2.5: 深层业务弹窗群 (10000 - 21999) — 2026-08-19 z-index治理新增
   *
   * 📌 背景：compare-v2 销售解析等主弹窗之上存在多层业务子弹窗群，
   *    历史上以硬编码内联值野蛮生长（13000/14000/20000/21000...），
   *    本组变量是"承认现状"的语义化收编：变量值 = 原内联值，零视觉变化。
   *    新增弹窗禁止再自造数值，必须从本组取值。
   *
   * 层级分配（按业务嵌套拓扑）:
   *   10000-10999: 独立功能弹窗（RPA原始数据/AI对话/AI情报overlay）
   *   11000-11999: 销售解析子弹窗A组（订单数据管理/PDF导出）
   *   12000-12999: 预留
   *   13000-13999: 销售解析子弹窗B组/sdi系列（数据导入13000/绑定13001/
   *                临时提权13002/确认与提示13003）
   *   14000-14999: 销售态势/Excel类型选择（⚠️历史同值14000，见z-trend）
   *   15000-15999: SKU合并管理（态势之上）
   *   16000-19999: 预留
   *   20000-20999: 批量填入（全弹窗之巅）
   *   21000-21999: 批量填入二次确认
   * ================================================================ */

  --z-modal-standalone: 10000;   /* 独立功能弹窗（rpaJson/AI对话/AI情报） */
  --z-modal-sales-a:   11000;   /* 销售解析子弹窗A组（订单数据/PDF导出） */
  --z-sdi-overlay:     13000;   /* sdi数据导入主遮罩 */
  --z-sdi-bind:        13001;   /* sdi未匹配SKU绑定 */
  --z-sdi-temp:        13002;   /* sdi临时提权（防重复打开时的闪避） */
  --z-sdi-confirm:     13003;   /* sdi确认框/提示框 */
  --z-sdi-excel:       13010;   /* excelSalesType选择器：sdi全链之上（原14000，与z-trend历史同值冲突，2026-08-19分化）*/
  --z-modal-audit:     13500;   /* 编码校验结果弹窗：销售解析全屏校验报告（高于sdi全链13010、低于态势14000；原误用--z-ghost 99999，2026-08-19修正为正规层） */
  --z-trend:           14000;   /* SKU销售态势（excelSalesType已分化至z-sdi-excel） */
  --z-trend-child:     15000;   /* SKU合并管理（态势之上） */
  --z-modal-top:       20000;   /* 批量填入（全弹窗之巅） */
  --z-modal-top-confirm: 21000; /* 批量填入二次确认 */

  /* ================================================================
   * LAYER 4.5: 瞬时特殊层 (99999) — 2026-08-19 z-index治理新增
   * 用于: 生命周期极短的辅助元素——拖拽ghost、离屏截图渲染div、
   *       卡片右键下拉菜单等。这些元素存在时间<1s或本身pointer-events:none，
   *       不参与正常层叠竞争，封顶值不会引发军备竞赛。
   * ================================================================ */

  --z-ghost:           99999;   /* 拖拽ghost/离屏截图/瞬时下拉 */

  /* ================================================================
   * LAYER 4: 抽屉/面板层 (4000 - 5999)
   * 用于: 从边缘滑入的面板、全屏覆盖层
   * ================================================================ */
  
  --z-drawer:          4000;     /* 抽屉面板（从边缘滑入）*/
  --z-fullscreen:      4500;     /* 全屏覆盖层 */
  --z-guide-overlay:   5000;     /* 新手引导蒙版层 */

  /* ================================================================
   * LAYER 5: 特殊层 (6000 - 7999)
   * 用于: 紧急提示、特殊交互模式
   * ================================================================ */
  
  --z-emergency:       7000;     /* 紧急告警提示 */
  --z-hotkey-hint:     7500;     /* 快捷键提示浮层 */

  /* ================================================================
   * LAYER 6: 调试层 (8000 - 8999) [仅开发环境]
   * 用于: 开发调试工具、性能分析器
   * ================================================================ */
  
  --z-debug-panel:     8000;     /* 调试信息面板 */
  --z-devtools:        8500;     /* 开发者工具模拟层 */

  /* ================================================================
   * LAYER 7: 通知层 — 2026-08-19 z-index治理修正
   *
   * ⚠️ 历史设计（Toast 9000 低于弹窗）已被实证破坏：
   *    深层业务弹窗群（LAYER 2.5，10000-21000）出现后，Toast(9000)
   *    被 orderData/sdi/trend/ubf 等弹窗遮挡，用户在批量填入等
   *    高层弹窗内看不到操作结果提示。
   *
   * 📌 修正决策：Toast 必须高于全部业务弹窗（含 LAYER 2.5 顶点 21000），
   *    但低于瞬时特殊层(99999)。Snackbar/通知/全局Loading 同组递增。
   * ================================================================ */

  --z-toast:           22000;    /* Toast通知（右下角浮动，高于一切业务弹窗）*/
  --z-snackbar:        22100;    /* Snackbar条形通知（底部居中）*/
  --z-notification:    22200;    /* 通知中心气泡 */
  --z-global-loading:  22500;    /* 全屏Loading遮罩 */
}

/* ================================================================
 * 响应式调整说明:
 * 
 * 移动端与桌面端保持相同的z-index体系，不做差异化处理。
 * 这样可以确保在响应式断点切换时不会出现层级跳动问题。
 * 
 * 如果未来确实需要移动端特殊处理，请在此处覆盖特定变量，
 * 并添加详细注释说明原因。
 * ================================================================ */

@media screen and (max-width: 768px) {
  :root {
    /* 移动端保持与桌面端一致的z-index值 */
    /* 如需特殊调整，在此处添加并注释原因 */
  }
}

/* ================================================================
 * 辅助类工具（可选使用）
 * 用于快速应用常用z-index值
 * ================================================================ */

.z-base           { z-index: var(--z-base); }
.z-content         { z-index: var(--z-content); }
.z-sticky          { z-index: var(--z-sticky); }
.z-sticky-header   { z-index: var(--z-sticky-header); }
.z-badge           { z-index: var(--z-badge); }
.z-tooltip         { z-index: var(--z-tooltip); }
.z-dropdown        { z-index: var(--z-dropdown); }
.z-popover         { z-index: var(--z-popover); }
.z-fixed-header    { z-index: var(--z-fixed-header); }
.z-fab             { z-index: var(--z-fab); }
.z-inline-sidebar  { z-index: var(--z-inline-sidebar); }

/* 弹窗相关 */
.z-modal-backdrop  { z-index: var(--z-modal-backdrop); }
.z-modal-base      { z-index: var(--z-modal-base); }
.z-modal-nested-1  { z-index: var(--z-modal-nested-1); }
.z-modal-nested-2  { z-index: var(--z-modal-nested-2); }
.z-modal-nested-3  { z-index: var(--z-modal-nested-3); }
.z-modal-nested-4  { z-index: var(--z-modal-nested-4); }
.z-modal-sidebar   { z-index: var(--z-modal-sidebar); }

/* 通知相关 */
.z-toast           { z-index: var(--z-toast); }
.z-snackbar        { z-index: var(--z-snackbar); }
.z-notification    { z-index: var(--z-notification); }
.z-global-loading  { z-index: var(--z-global-loading); }

/* 全局Toast位置强制修正 - 统一显示在右下角（2026-05-12更新） */
#toast,
#toastContainer,
.toast-container,
.pp-toast-container,
.tic-toast-container {
  position: fixed !important;
  bottom: 24px !important;
  top: auto !important;
  right: 24px !important;
  left: auto !important;
  z-index: var(--z-toast, 9000) !important;
}

/* Toast容器可见时的布局样式（不使用!important，避免覆盖display:none） */
#toastContainer:not([style*="display:none"]),
.toast-container:not([style*="display:none"]),
.pp-toast-container:not([style*="display:none"]),
.tic-toast-container:not([style*="display:none"]) {
  display: flex;
  flex-direction: column-reverse;
  gap: 8px;
}

console.log('[Z-Index System] ✅ Z-Index层级系统v2.0加载完成');
console.log('[Z-Index System] 📊 层级分布:');
console.log('  • 内容层(0-999): Sticky/Dropdown/Tooltip/FAB');
console.log('  • 弹窗层(1000-1999): Modal Dialog(支持5级嵌套)');
console.log('  • 扩展层(2000-3999): Dynamic Dialog/Deep Nested');
console.log('  • 抽屉层(4000-5999): Drawer/Fullscreen/Guide');
console.log('  • 特殊层(6000-7999): Emergency/Hotkey Hint');
console.log('  • 调试层(8000-8999): Debug Panel/DevTools');
console.log('  • 通知层(9000-9999): Toast/Snackbar/Notification');