/* ============================================================
 * 设计令牌 · CSS 自定义属性
 * 运行时换肤只需改动 --opo-primary 及其派生色阶（由 utils/theme.js 注入）
 * 这里的值是"品牌青"默认值；JS 注入的 inline style 会覆盖 :root
 * ============================================================ */
:root {
  /* 品牌色（默认：OPO_Logo 圆环青） */
  --opo-primary: #0E768F;
  --opo-primary-hover: #0D6A81;
  --opo-primary-active: #0B5E72;
  --opo-primary-light-3: #569FB1;
  --opo-primary-light-5: #87BBC7;
  --opo-primary-light-7: #B7D6DD;
  --opo-primary-light-8: #CFE4E9;
  --opo-primary-light-9: #E7F1F4;
  --opo-primary-light-95: #F3F8F9;
  --opo-primary-dark-2: #0B5E72;

  /* 语义色 */
  --opo-success: #67C23A;
  --opo-success-light: #F0F9EB;
  --opo-warning: #E6A23C;
  --opo-warning-light: #FDF6EC;
  --opo-danger: #CD1D4E;
  --opo-danger-light: #FBEBEF;
  --opo-info: #909399;
  --opo-info-light: #F4F4F5;

  /* 中性色 */
  --opo-text-primary: #1F2937;
  --opo-text-regular: #4B5563;
  --opo-text-secondary: #6B7280;
  --opo-text-placeholder: #9CA3AF;
  --opo-border-base: #E5E7EB;
  --opo-border-light: #F0F2F5;
  --opo-border-lighter: #F5F7FA;
  --opo-bg-page: #F5F7FA;
  --opo-bg-card: #FFFFFF;
  --opo-bg-hover: #F5F9FD;
  --opo-bg-stripe: #FAFBFC;
  --opo-bg-thead: #F5F7FA;

  /* 表格框线（比通用边框更深） */
  --opo-table-border: #C8CFD8;
  --opo-table-border-strong: #B7C0CC;

  /* 侧边栏 */
  --opo-sidebar-bg: #0A4655;
  --opo-sidebar-sub-bg: #083B47;
  --opo-sidebar-hover: rgba(14, 118, 143, 0.28);
  --opo-sidebar-text: rgba(255, 255, 255, 0.72);
  --opo-sidebar-text-active: #FFFFFF;

  /* 字号（2026-10-22 整体上调一号：正文 14→16） */
  --opo-font-size-display: 34px;
  --opo-font-size-h1: 26px;
  --opo-font-size-h2: 20px;
  --opo-font-size-lg: 18px;
  --opo-font-size-base: 16px;
  --opo-font-size-sm: 14px;
  --opo-font-size-xs: 13px;
  --opo-font-size-menu: 16px;

  /* 字体（不要用 -apple-system 打头，Windows 上会变成 Segoe UI，数字显小） */
  --opo-font-family-base: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑",
    "Helvetica Neue", Arial, sans-serif;
  --opo-font-family-number: "DIN Alternate", "SF Mono", "Roboto Mono", Consolas, "Courier New", monospace;

  /* 间距 */
  --opo-space-1: 4px;
  --opo-space-2: 8px;
  --opo-space-3: 12px;
  --opo-space-4: 16px;
  --opo-space-5: 24px;
  --opo-space-6: 32px;

  /* 圆角 */
  --opo-radius-sm: 2px;
  --opo-radius-base: 4px;
  --opo-radius-lg: 8px;
  --opo-radius-pill: 999px;

  /* 阴影 */
  --opo-shadow-sm: 0 1px 2px rgba(16, 24, 40, 0.06);
  --opo-shadow-md: 0 4px 12px rgba(16, 24, 40, 0.08);
  --opo-shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.12);

  /* 控件高度 */
  --opo-control-height-small: 32px;
  --opo-control-height-base: 36px;
}