/* ═══ BaiLongma / 地坪知识库 共享设计令牌 ═══
 * 所有页面统一从此文件导入，避免各页面重复定义变量。
 * 字体：不加载任何外部字体（@fontsource Noto Serif SC 会按 unicode-range 拆成数百个
 * 分片文件从 CDN 逐个拉取，严重拖慢页面加载）。改用系统内置衬线字体栈：
 * macOS 的 Songti SC（宋体-简）、Windows 的 SimSun（中易宋体）都内置且效果接近。
 * ═══════════════════════════════════════════════════════════════════════ */
/* ═══════════════════════════════════════════════════════════════════════
 * 亮色模式：暖纸 + 森林绿 + 铜金（铜金仅作强调色，不铺满屏）
 *
 * 使用方式：
 *   <link rel="stylesheet" href="/src/ui/theme.css">
 *   然后各页面只写自身特有样式，颜色用 var() 引用。
 *
 * 核心令牌（禁止在业务代码再写 #1f5a43 / #f4efe3 / #b6643c 硬编码）：
 *   --forest  --forest-deep  --paper  --copper  --ink  --muted
 *   --line  --line-soft  --sand  --gold  --card-bg
 *   --ok  --warn  --danger  --info
 *   --toast-bg  --toast-fg
 */

:root {
  /* 全局字体：系统内置衬线体（不再依赖 CDN 字体，避免数百个分片请求） */
  /* Mac 优先宋体-简 Songti SC，Windows 用中易宋体 SimSun；无衬线需求时退回苹方/微软雅黑 */
  --font-serif: "Songti SC", "STSong", "SimSun", "Noto Serif SC", "Source Han Serif SC", "Microsoft YaHei", "PingFang SC", serif;
  --font-base: var(--font-serif);

  /* ── 品牌主色（用户偏好） ── */
  --paper: #f4efe3;
  --paper-2: #faf6ee;
  --sand: #e6dcc5;
  --ink: #17221c;
  --muted: #3f4a42;
  --line: rgba(23, 34, 28, 0.12);
  --line-soft: rgba(23, 34, 28, 0.06);
  --forest: #1f5a43;
  --forest-deep: #0d2c22;
  --forest-soft: rgba(31, 90, 67, 0.10);
  --forest-glow: rgba(31, 90, 67, 0.15);
  --copper: #b6643c;
  --copper-soft: rgba(182, 100, 60, 0.12);
  --copper-glow: rgba(182, 100, 60, 0.20);
  --gold: #c4a85a;

  /* ── 语义别名（写业务时优先用这些） ── */
  --accent: var(--forest);
  --accent-deep: var(--forest-deep);
  --accent-soft: var(--forest-soft);
  --highlight: var(--copper);
  --highlight-soft: var(--copper-soft);
  --bg: var(--paper);
  --fg: var(--ink);
  --fg-muted: var(--muted);
  --border: var(--line);

  /* ── 状态色（偏暖、不抢品牌绿） ── */
  --ok: #2f7d57;
  --ok-soft: rgba(47, 125, 87, 0.12);
  --warn: #c48a2a;
  --warn-soft: rgba(196, 138, 42, 0.14);
  --danger: #b54a3c;
  --danger-soft: rgba(181, 74, 60, 0.12);
  --info: var(--forest);
  --info-soft: var(--forest-soft);

  /* ── 卡片 / 玻璃 ── */
  --card-bg: rgba(255, 251, 243, 0.72);
  --card-bg-soft: rgba(255, 251, 243, 0.45);
  --glass: rgba(255, 251, 243, 0.55);
  --glass-strong: rgba(255, 253, 248, 0.82);
  --glass-border: rgba(182, 100, 60, 0.18);
  --shadow: 0 30px 80px rgba(16, 30, 25, 0.14);
  --shadow-sm: 0 8px 30px rgba(16, 30, 25, 0.08);

  /* ── Toast ── */
  --toast-bg: var(--copper);
  --toast-fg: #fffdf8;
  --toast-ok-bg: var(--forest);
  --toast-warn-bg: var(--warn);
  --toast-danger-bg: var(--danger);
  --toast-z: 100000;
  --toast-radius: 10px;
  --toast-shadow: 0 4px 20px var(--copper-glow);

  /* ── 圆角 / 间距（可选约定） ── */
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-xl: 16px;
}

/* 暗色（body.blm-dark 时切换，保持品牌识别） */
body.blm-dark {
  --paper: #0f172a;
  --paper-2: #111c2e;
  --sand: #1a2436;
  --ink: #e2e8f0;
  --muted: #94a3b8;
  --line: rgba(226, 232, 240, 0.12);
  --line-soft: rgba(226, 232, 240, 0.06);
  --forest: #3d8b6d;
  --forest-deep: #1f5a43;
  --forest-soft: rgba(61, 139, 109, 0.16);
  --forest-glow: rgba(61, 139, 109, 0.22);
  --copper: #d4895a;
  --copper-soft: rgba(212, 137, 90, 0.16);
  --copper-glow: rgba(212, 137, 90, 0.28);
  --gold: #d4bc78;
  --card-bg: rgba(15, 23, 42, 0.72);
  --card-bg-soft: rgba(15, 23, 42, 0.45);
  --glass: rgba(15, 23, 42, 0.55);
  --glass-strong: rgba(17, 28, 46, 0.82);
  --glass-border: rgba(212, 137, 90, 0.22);
  --shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
  --shadow-sm: 0 8px 30px rgba(0, 0, 0, 0.28);
  --toast-bg: var(--copper);
  --toast-fg: #0f172a;
  --ok: #4ade80;
  --warn: #fbbf24;
  --danger: #f87171;
}

/* 暖纸玻璃面板 */
.glass-panel,
.glass-paper {
  background: var(--glass) !important;
  backdrop-filter: blur(14px) saturate(1.15);
  -webkit-backdrop-filter: blur(14px) saturate(1.15);
  border: 1px solid var(--glass-border) !important;
}

.glass-strong {
  background: var(--glass-strong) !important;
  backdrop-filter: blur(16px) saturate(1.2);
  -webkit-backdrop-filter: blur(16px) saturate(1.2);
  border: 1px solid var(--glass-border) !important;
}

/* 全局统一衬线体 */
html, body, button, input, textarea, select, code, pre, .mono {
  font-family: var(--font-base) !important;
}

/* 文本工具类 */
.blm-text-ink { color: var(--ink); }
.blm-text-muted { color: var(--muted); }
.blm-text-forest { color: var(--forest); }
.blm-text-copper { color: var(--copper); }
.blm-bg-paper { background: var(--paper); }
.blm-bg-forest { background: var(--forest); color: #fff; }
.blm-bg-copper { background: var(--copper); color: #fff; }
.blm-border { border-color: var(--line); }

/* ═══ 统一 Toast 样式（配合 window.showToast） ═══ */
@keyframes blmToastIn {
  from { opacity: 0; transform: translateX(-50%) translateY(10px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}
@keyframes blmToastInTop {
  from { opacity: 0; transform: translateX(-50%) translateY(-10px); }
  to   { opacity: 1; transform: translateX(-50%) translateY(0); }
}

#blm-toast,
.blm-toast {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  z-index: var(--toast-z);
  background: var(--toast-bg);
  color: var(--toast-fg);
  padding: 10px 20px;
  border-radius: var(--toast-radius);
  font-size: 13px;
  line-height: 1.55;
  box-shadow: var(--toast-shadow);
  max-width: min(80vw, 420px);
  text-align: center;
  white-space: pre-wrap;
  word-break: break-word;
  pointer-events: none;
  border: 1px solid rgba(255, 255, 255, 0.12);
  animation: blmToastIn 0.2s ease;
  transition: opacity 0.3s ease;
}

#blm-toast.blm-toast--bottom,
.blm-toast.blm-toast--bottom { bottom: 80px; top: auto; }

#blm-toast.blm-toast--top,
.blm-toast.blm-toast--top {
  top: 60px;
  bottom: auto;
  animation: blmToastInTop 0.2s ease;
}

#blm-toast.blm-toast--ok,
.blm-toast.blm-toast--ok { background: var(--toast-ok-bg); box-shadow: 0 4px 20px var(--forest-glow); }

#blm-toast.blm-toast--warn,
.blm-toast.blm-toast--warn { background: var(--toast-warn-bg); }

#blm-toast.blm-toast--error,
#blm-toast.blm-toast--danger,
.blm-toast.blm-toast--error,
.blm-toast.blm-toast--danger { background: var(--toast-danger-bg); }

#blm-toast.blm-toast--info,
.blm-toast.blm-toast--info { background: var(--forest); }

#blm-toast.blm-toast--html,
.blm-toast.blm-toast--html { text-align: left; }

#blm-toast.blm-toast--hide,
.blm-toast.blm-toast--hide { opacity: 0; }

/* ═══ 麦克风图标 ═══ */
.mic-icon {
  display: inline-block;
  width: 1.8em;
  height: 1.8em;
  background-image: url("./brain-ui/assets/mic-icon.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: -0.4em;
  flex-shrink: 0;
}
.mic-icon-lg { width: 36px; height: 36px; }

.ai-input-box .voice-trigger > .mic-icon {
  width: 28px !important; height: 28px !important;
  vertical-align: middle;
}

.fi-icon > .mic-icon,
.ft-card > .mic-icon {
  width: 38px !important; height: 38px !important;
  vertical-align: middle;
}

/* ── 无障碍：键盘焦点可见性（P2-12）── */
:focus-visible {
  outline: 2px solid var(--copper);
  outline-offset: 2px;
  border-radius: 4px;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--copper);
  outline-offset: 2px;
}
/* 点击（鼠标）时不显示 focus 环，仅键盘导航显示 */
:focus:not(:focus-visible) {
  outline: none;
}

/* 屏幕阅读器专用（视觉隐藏但可被朗读） */
.blm-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ── 平滑滚动 ── */
html { scroll-behavior: smooth; }

/* ── 行业新闻/标准库卡片 hover（替代内联 onmouseenter） ── */
.in-item { border-color: rgba(182,100,60,0.08) !important; }
.in-item:hover { border-color: var(--forest) !important; background: rgba(255,251,243,0.8) !important; }
.std-item { border-color: rgba(182,100,60,0.08) !important; cursor: pointer; }
.std-item:hover { border-color: var(--forest) !important; background: rgba(255,251,243,0.8) !important; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ── 自定义滚动条（亮色） ── */
::-webkit-scrollbar { width: 4px; height: 4px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(31,90,67,0.15); border-radius: 2px; }
::-webkit-scrollbar-thumb:hover { background: rgba(31,90,67,0.3); }

/* ── 低性能/不支持 backdrop-filter 的机器：玻璃模糊降级为实色底，避免文字发虚 ── */
@supports not ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
  .panel,
  .glass-bg,
  [class*="glass"],
  [class*="panel"] {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(244, 239, 227, 0.96) !important;
  }
}