/* ============================================================
 * 郭标工作台 pt · 品牌主题 + 暗黑模式
 * 注入: dist/index.html <link rel="stylesheet" href="/theme-brand.css">
 * 机制: 跟随系统 prefers-color-scheme, 支持 html[data-theme] 手动覆盖
 * ============================================================ */

/* ─── 品牌主色收敛 (亮色): EP 蓝 + 微信绿 -> 郭标品牌蓝 ─── */
:root,
html[data-theme="light"] {
  --el-color-primary: #2563eb;
  --el-color-primary-light-3: #4f7ef2;
  --el-color-primary-light-5: #7ea0f7;
  --el-color-primary-light-7: #aec4fa;
  --el-color-primary-light-8: #c7d7fc;
  --el-color-primary-light-9: #e0eafd;
  --el-color-primary-dark-2: #1d4ed8;
}

/* 微信绿元素收敛为品牌蓝 */
:root,
html[data-theme="light"] {
  --gb-accent: #2563eb;
}
.sell,
.hover-btn:hover,
button:hover { background: #2563eb !important; border-color: #2563eb !important; }

/* ─── 暗黑变量 (手动 dark 与系统 dark 共用定义) ─── */
html[data-theme="dark"] {
  --el-bg-color: #111827;
  --el-bg-color-page: #0f172a;
  --el-bg-color-overlay: #1f2937;
  --el-text-color-primary: #f3f4f6;
  --el-text-color-regular: #d1d5db;
  --el-text-color-secondary: #9ca3af;
  --el-text-color-placeholder: #6b7280;
  --el-border-color: #374151;
  --el-border-color-light: #1f2937;
  --el-border-color-lighter: #1f2937;
  --el-border-color-extra-light: #1f2937;
  --el-fill-color: #1f2937;
  --el-fill-color-light: #1f2937;
  --el-fill-color-lighter: #1f2937;
  --el-fill-color-blank: #111827;
  --el-color-primary: #60a5fa;
  --el-color-primary-light-3: #3b82f6;
  --el-color-primary-light-5: #2563eb;
  --el-color-primary-light-7: #1d4ed8;
  --el-color-primary-light-8: #1e40af;
  --el-color-primary-light-9: #1e3a8a;
  --el-color-primary-dark-2: #93c5fd;
  color-scheme: dark;
}

/* 系统暗黑自动切换 */
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    --el-bg-color: #111827;
    --el-bg-color-page: #0f172a;
    --el-bg-color-overlay: #1f2937;
    --el-text-color-primary: #f3f4f6;
    --el-text-color-regular: #d1d5db;
    --el-text-color-secondary: #9ca3af;
    --el-text-color-placeholder: #6b7280;
    --el-border-color: #374151;
    --el-border-color-light: #1f2937;
    --el-border-color-lighter: #1f2937;
    --el-border-color-extra-light: #1f2937;
    --el-fill-color: #1f2937;
    --el-fill-color-light: #1f2937;
    --el-fill-color-lighter: #1f2937;
    --el-fill-color-blank: #111827;
    --el-color-primary: #60a5fa;
    --el-color-primary-light-3: #3b82f6;
    --el-color-primary-light-5: #2563eb;
    --el-color-primary-light-7: #1d4ed8;
    --el-color-primary-light-8: #1e40af;
    --el-color-primary-light-9: #1e3a8a;
    --el-color-primary-dark-2: #93c5fd;
    color-scheme: dark;
  }
  html:not([data-theme="light"]) body { background: #0f172a; }
  html:not([data-theme="light"]) .sell,
  html:not([data-theme="light"]) button:hover { background: #2563eb !important; border-color: #2563eb !important; }
}

html[data-theme="dark"] body { background: #0f172a; }
html[data-theme="dark"] .sell,
html[data-theme="dark"] button:hover { background: #2563eb !important; border-color: #2563eb !important; }

/* ─── 无障碍: 键盘焦点可见 ─── */
a:focus-visible, button:focus-visible, [role="button"]:focus-visible, .el-button:focus-visible {
  outline: 2px solid var(--el-color-primary);
  outline-offset: 2px;
}

/* ─── 减少动效 ─── */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}
