/* === 奕境 DMS 设计令牌 v3.2 ===
   遵循规范: 奕境项目-原型输出规范 v3.2
   技术栈: uniapp+vue3
*/

:root {
  /* === 品牌色系 === */
  --brand-primary: #861B2F;
  --brand-primary-light: #A8435A;
  --brand-primary-dark: #6A1525;

  /* === 功能色系 === */
  --func-blue: #1F5E8C;
  --func-blue-hover: #17496E;
  --func-blue-light: #EDF5FA;
  
  --success: #2F7D4F;
  --success-light: #EEF7F1;
  
  --warning: #A8641A;
  --warning-light: #FFF7EC;
  
  --error: #B42318;
  --error-light: #FEF3F2;

  /* === 中性色 === */
  --text-primary: #25272A;
  --text-secondary: #60656C;
  --text-tertiary: #8B929A;
  --text-placeholder: #B8BEC6;
  
  --border-default: #DDE2E8;
  --border-light: #ECEFF3;
  
  --bg-page: #F6F8FA;       /* v3.2.7：更低对比度的工作台底色 */
  --bg-card: #FFFFFF;
  --bg-table-header: #F7F9FB;
  --bg-shell: #F6F8FA;      /* v3.2.7：与 sidebar/topbar 保持一致的"容器底色" */
  
  /* === 侧栏 v3.2.3 浅色主题（品牌 bar 反相）===
     v3.1/v3.2 深色 (#1F2937 + 蓝激活)
       → v3.2.2 浅色 + 品牌红顶 Bar (红底 + 白字)
       → v3.2.3 浅色 + 反相品牌 Bar (白底 + 红 logo + 红字)，对齐"营销服务平台"截图
     参考来源：保险统计看板 5.1 评审版 · 浅色侧栏 + 反相 Bar */
  --sidebar-bg: var(--bg-shell);                /* v3.2.5：侧栏与主区域同底色 */
  --sidebar-text: var(--text-primary);
  --sidebar-text-secondary: var(--text-secondary);
  --sidebar-brand-bg: var(--bg-shell);          /* v3.2.5：品牌 bar 与侧栏同色 */
  --sidebar-brand-color: var(--brand-primary);  /* v3.2.3：品牌 bar 文字 = 品牌红 */
  --sidebar-brand-logo-bg: var(--brand-primary);   /* v3.2.3：logo 红方块 */
  --sidebar-brand-logo-color: #FFFFFF;             /* v3.2.3：logo 内白色"奕"字 */
  --sidebar-brand-border: var(--border-default);   /* v3.2.3：品牌 bar 与下方分隔的 hairline */
  --sidebar-active-bg: #FDF3F3;
  --sidebar-active-color: var(--brand-primary);
  --sidebar-active-bar: var(--brand-primary);
  --sidebar-hover-bg: #FAFAFA;
  --sidebar-active: #FDF3F3;                    /* legacy 兼容 */

  /* === ID 链接色 v3.2.3 新增 ===
     单据/订单/工单 编号一律用暖棕，与功能蓝（操作按钮）和品牌红（主按钮）形成视觉分层 */
  --func-id-color: #334155;
  --func-id-hover: var(--brand-primary);

  /* === 克制状态色 v3.2.7 === */
  --tag-info-text: var(--func-blue);
  --tag-info-bg: var(--func-blue-light);
  --tag-info-border: #C9DCEB;
  --tag-success-text: var(--success);
  --tag-success-bg: var(--success-light);
  --tag-success-border: #CFE4D7;
  --tag-warning-text: var(--warning);
  --tag-warning-bg: var(--warning-light);
  --tag-warning-border: #EAD8BC;
  --tag-error-text: var(--error);
  --tag-error-bg: var(--error-light);
  --tag-error-border: #E8C6C2;
  --tag-neutral-text: var(--text-secondary);
  --tag-neutral-bg: #F4F6F8;
  --tag-neutral-border: var(--border-default);

  /* === 间距 === */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 32px;
  --space-xxl: 48px;

  /* === 圆角 === */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-full: 999px;

  /* === 阴影 === */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.08);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.12);
  --shadow-lg: 0 12px 32px rgba(0,0,0,0.15);

  /* === 字体 === */
  --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --font-mono: var(--font-family);
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-size-xs: 12px;
  --font-size-sm: 13px;
  --font-size-base: 14px;
  --font-size-lg: 16px;
  --font-size-xl: 18px;
  --font-size-xxl: 20px;
  --font-size-display: 24px;
}

/* === Reset === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
body { font-family: var(--font-family); font-size: var(--font-size-base); font-weight: var(--font-weight-regular); color: var(--text-primary); background: var(--bg-page); letter-spacing: 0; }
button, input, select, textarea, table { font-family: var(--font-family); letter-spacing: 0; }
a { color: var(--func-blue); text-decoration: none; }
a:hover { color: var(--func-blue-hover); }

/* === 全局视觉降噪 v3.2.7 === */
input, select, textarea {
  color: var(--text-primary);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-regular);
}
input::placeholder, textarea::placeholder {
  color: var(--text-placeholder);
  font-weight: var(--font-weight-regular);
}

th, .data-table th, .mini-table th {
  color: var(--text-secondary) !important;
  font-weight: var(--font-weight-medium) !important;
}
td, .data-table td, .mini-table td {
  color: var(--text-primary);
  font-weight: var(--font-weight-regular);
}

.link-id,
.lead-code,
.vin-cell,
.card-task-no,
.order-code,
.warranty-code,
.col-no,
.time-limit,
[style*="monospace"] {
  font-family: var(--font-family) !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0 !important;
}
.link-id,
.lead-code,
.order-code,
.warranty-code {
  color: var(--func-id-color) !important;
  font-weight: var(--font-weight-medium) !important;
}
.link-id:hover,
.lead-code:hover,
.order-code:hover,
.warranty-code:hover {
  color: var(--func-id-hover) !important;
}

.status-tag,
.pill,
.pdi-tag,
.type-tag,
.severity-tag,
.prd-badge,
.tag,
.badge {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 1px 8px !important;
  border: 1px solid var(--tag-neutral-border) !important;
  border-radius: var(--radius-sm) !important;
  background: var(--tag-neutral-bg) !important;
  color: var(--tag-neutral-text) !important;
  font-size: var(--font-size-xs) !important;
  font-weight: var(--font-weight-medium) !important;
  line-height: 18px !important;
  letter-spacing: 0 !important;
  white-space: nowrap;
}

.status-pass,
.status-approved,
.status-active,
.status-paid,
.status-insured,
.status-confirmed,
.status-done,
.pill-done,
.pill-completed,
.pill-active,
.pdi-tag-delivery {
  background: var(--tag-success-bg) !important;
  color: var(--tag-success-text) !important;
  border-color: var(--tag-success-border) !important;
}

.status-pending,
.status-unpaid,
.status-supplement,
.pill-pending,
.pill-suspended,
.pdi-tag-stock,
.severity-p1 {
  background: var(--tag-warning-bg) !important;
  color: var(--tag-warning-text) !important;
  border-color: var(--tag-warning-border) !important;
}

.status-reject,
.status-rejected,
.status-returned,
.status-cancelled,
.pill-cancelled,
.severity-p0 {
  background: var(--tag-error-bg) !important;
  color: var(--tag-error-text) !important;
  border-color: var(--tag-error-border) !important;
}

.status-processing,
.pill-processing,
.pill-progress,
.pill-recheck,
.btn-sm-outline {
  background: var(--tag-info-bg) !important;
  color: var(--tag-info-text) !important;
  border-color: var(--tag-info-border) !important;
}

.priority-high,
.deduct-fail,
.row-link.danger {
  color: var(--error) !important;
  font-weight: var(--font-weight-medium) !important;
}
.deduct-yes { color: var(--success) !important; font-weight: var(--font-weight-medium) !important; }
.deduct-no { color: var(--warning) !important; font-weight: var(--font-weight-medium) !important; }

.btn,
.btn-primary,
.btn-default,
.btn-outline,
.btn-sm,
.btn-sm-primary {
  font-weight: var(--font-weight-medium) !important;
  letter-spacing: 0 !important;
}

/* PDI 看板泳道色统一压低饱和度 */
.lane-pending .lane-header { border-bottom-color: var(--warning) !important; }
.lane-pending .lane-dot { background: var(--warning) !important; }
.lane-pending .lane-count { color: var(--warning) !important; }
.lane-progress .lane-header { border-bottom-color: var(--func-blue) !important; }
.lane-progress .lane-dot { background: var(--func-blue) !important; }
.lane-progress .lane-count { color: var(--func-blue) !important; }
.lane-completed .lane-header { border-bottom-color: var(--success) !important; }
.lane-completed .lane-dot { background: var(--success) !important; }
.lane-completed .lane-count { color: var(--success) !important; }
.lane-closed .lane-header { border-bottom-color: var(--text-tertiary) !important; }
.lane-closed .lane-dot { background: var(--text-tertiary) !important; }
.lane-closed .lane-count { color: var(--text-tertiary) !important; }