/* ============================================================
   tokens.css — ylf_Video 设计令牌全集（亮色 SaaS 风格）
   所有 CSS 自定义属性集中定义于此，全局可用
   ============================================================ */

:root {
  /* ---- 画布与表面 ---- */
  --pv-canvas: #F0F2F5;
  --pv-surface: #FFFFFF;
  --pv-surface-raised: #FAFAFA;

  /* ---- 卡片 ---- */
  --pv-card-bg: #FFFFFF;
  --pv-card-border: #E8E8E8;
  --pv-card-hover-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);

  /* ---- 玻璃卡片（亮色下改为实体微透明） ---- */
  --pv-glass-bg: rgba(0, 0, 0, 0.02);
  --pv-glass-border: rgba(0, 0, 0, 0.06);
  --pv-glass-hover-bg: rgba(0, 0, 0, 0.04);
  --pv-glass-hover-border: rgba(0, 0, 0, 0.12);

  /* ---- 强调色（亮色 SaaS 风格） ---- */
  --pv-accent: #1677FF;
  --pv-accent-hover: #4096FF;
  --pv-accent-active: #0958D9;
  --pv-accent-bg: rgba(22, 119, 255, 0.06);
  --pv-accent-bg-hover: rgba(22, 119, 255, 0.10);

  /* ---- RGB 分量（适配透明度场景） ---- */
  --pv-accent-rgb: 22, 119, 255;
  --pv-error-rgb: 255, 77, 79;
  --pv-success-rgb: 82, 196, 26;
  --pv-text-rgb: 31, 31, 31;

  /* ---- 文字 ---- */
  --pv-text: #1F1F1F;
  --pv-text-muted: #8C8C8C;
  --pv-text-faint: #BFBFBF;

  /* ---- 语义色 ---- */
  --pv-success: #52C41A;
  --pv-warning: #FAAD14;
  --pv-error: #FF4D4F;
  --pv-info: #1677FF;

  /* ---- 按钮专用令牌 ---- */
  --pv-btn-primary-text: #FFFFFF;
  --pv-btn-disabled-opacity: 0.4;
  --pv-btn-primary-bg: #1677FF;
  --pv-btn-primary-hover: #4096FF;
  --pv-btn-primary-active: #0958D9;

  /* 按钮 Primary 阴影 */
  --pv-btn-primary-shadow: none;
  --pv-btn-primary-shadow-hover: 0 2px 8px rgba(22, 119, 255, 0.25);
  --pv-btn-primary-shadow-active: none;

  /* Danger 语义背景（基于 RGB 分量） */
  --pv-danger-bg-default: rgba(var(--pv-error-rgb), 0.08);
  --pv-danger-bg-hover: rgba(var(--pv-error-rgb), 0.15);
  --pv-danger-bg-active: rgba(var(--pv-error-rgb), 0.22);
  --pv-danger-bg-disabled: rgba(var(--pv-error-rgb), 0.04);
  --pv-danger-border-default: rgba(var(--pv-error-rgb), 0.25);
  --pv-danger-border-hover: rgba(var(--pv-error-rgb), 0.40);
  --pv-danger-border-active: rgba(var(--pv-error-rgb), 0.55);
  --pv-danger-border-disabled: rgba(var(--pv-error-rgb), 0.10);
  --pv-danger-glow: rgba(var(--pv-error-rgb), 0.10);

  /* Text 按钮 hover/active 背景 */
  --pv-text-btn-bg-hover: rgba(var(--pv-accent-rgb), 0.06);
  --pv-text-btn-bg-active: rgba(var(--pv-accent-rgb), 0.10);

  /* 激活态背景 */
  --pv-glass-active-bg: rgba(var(--pv-text-rgb), 0.06);

  /* ---- 字体（系统栈，去掉 Google Fonts 依赖） ---- */
  --pv-font-display: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", "Segoe UI", sans-serif;
  --pv-font-body: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", "Segoe UI", sans-serif;
  --pv-font-mono: "SF Mono", "Cascadia Code", "Consolas", "JetBrains Mono", monospace;

  /* ---- 字号 ---- */
  --pv-text-xs: 0.75rem;
  --pv-text-sm: 0.875rem;
  --pv-text-base: 1rem;
  --pv-text-lg: 1.125rem;
  --pv-text-xl: 1.25rem;
  --pv-text-2xl: 1.5rem;
  --pv-text-3xl: 1.875rem;

  /* ---- 间距 ---- */
  --pv-space-1: 4px;
  --pv-space-2: 8px;
  --pv-space-3: 12px;
  --pv-space-4: 16px;
  --pv-space-5: 20px;
  --pv-space-6: 24px;
  --pv-space-8: 32px;
  --pv-space-10: 40px;
  --pv-space-12: 48px;
  --pv-space-16: 64px;
  --pv-space-20: 80px;
  --pv-space-30: 120px;

  /* ---- 圆角（统一缩小） ---- */
  --pv-radius-sm: 6px;
  --pv-radius-md: 8px;
  --pv-radius-lg: 12px;

  /* ---- 阴影（物理阴影，不再发光） ---- */
  --pv-shadow-card:
    0 1px 2px rgba(0, 0, 0, 0.06);
  --pv-shadow-card-hover:
    0 4px 12px rgba(0, 0, 0, 0.08);
  --pv-shadow-modal:
    0 8px 24px rgba(0, 0, 0, 0.12);

  /* ---- 边框 ---- */
  --pv-border: #E8E8E8;
  --pv-border-light: #F0F0F0;
  --pv-input-border: #D9D9D9;

  /* ---- 动效 ---- */
  --pv-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --pv-ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
  --pv-duration-fast: 150ms;
  --pv-duration-normal: 300ms;
  --pv-duration-slow: 500ms;
}