/* css/blackboard.css — 三泳道任务看板（#121 inline 常驻主视图；#127 去黑板化改版）
 * #127 改版：黑板质感（绿底渐变/木框描边/粉笔字风格基类/虚线泳道）整体退役——
 * 容器与泳道改用应用常规卡片/分组语言（--color-card/--color-border/--color-lane 等
 * 既有令牌；黑板专属令牌族（绿底/粉笔白/粉笔次级/木框）已随零引用删除）。
 * 便签视觉保留：类型色底（--color-note-*）+ 顶部胶带；确定性旋转（--bb-rot）随全宽行
 * 退役——全宽行下 ±3° 旋转致相邻便签角部叠压（位移超出行距），CSS 不再消费 rotate；
 * js 端 --bb-rot 内联注入与 noteRotation 纯函数保留不动（测试契约不变）；
 * #129 用户验收微调：便签改全宽行（每行一张占满泳道整行，替代 260px 弹性并排），信息集
 * 扩为全量（标题三行 + 摘要两行 + 徽章行 + agent 行两行 + 来源/时间底行）；
 * <768px 状态 tab 切换（复用 views.css .board-tabs 既有样式，便签全宽放大）。
 * #130 布局重构：泳道体补 padding-bottom（桌面末卡滚动裁切修复）+ 胶带微倾角
 * 退役拉直。
 * 便签文字色直接引用既有 --color-text（plan §2.1：不重复定义 --color-note-text）。 */

/* ---------------- inline 看板面板（#121：常驻主视图中央区；#127 普通面板化） ----------------
 *  flex:1 撑满 .center-main 左列剩余高度（泳道体 .bb-lane-body 内部滚动，
 *  滚动保持由 js renderBlackboard 的 collect/restore 机制承担）。 */
.blackboard-view {
  flex: 1;
  min-width: 0;
  min-height: 320px;
  display: flex;
  flex-direction: column;
  background: var(--color-card);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-1);
  color: var(--color-text);
}

/* 看板顶栏：标题 + 总数（#121：无 overlay 返回按钮；#127 粉笔字风格基类退役） */
.bb-topbar {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-sm) var(--spacing-md);
  flex-shrink: 0;
}

.bb-title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-semibold);
  color: var(--color-text);
}

.bb-count-total {
  font-size: var(--font-size-sm);
  color: var(--color-text-weak);
  margin-left: auto;
}

/* 三泳道：常规分组语言（#127：泳道列底 --color-lane 与看板列同语言，虚线粉笔描边退役） */
.bb-lanes {
  flex: 1;
  min-height: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--spacing-md);
  padding: 0 var(--spacing-md) var(--spacing-md);
}

.bb-lane {
  min-width: 0;
  display: flex;
  flex-direction: column;
  background: var(--color-lane);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--spacing-sm);
}

/* 泳道列头：常规分隔线（#127：粉笔画线下划线退役） */
.bb-lane-top {
  display: flex;
  align-items: baseline;
  gap: var(--spacing-xs);
  padding-bottom: var(--spacing-xxs);
  border-bottom: 1px solid var(--color-border);
  flex-shrink: 0;
}

.bb-lane-title {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-medium);
  color: var(--color-text);
}

.bb-lane-count {
  font-size: var(--font-size-sm);
  color: var(--color-text-weak);
  font-family: var(--font-mono);
}

/* #130 第 6 项（桌面）：泳道体为内滚容器（overflow-y:auto）——原仅 padding-top 无
 * 底 padding，scrollHeight 终点即末卡盒底：滚动到底时末卡贴容器裁剪缘，box-shadow
 * （含 y 向扩散）绘制在滚动区域外被 overflow 裁掉、视觉呈「卡片超出/被切」。
 * 补底部 padding 使 scrollHeight 末尾留缓冲带（滚动到底末卡下方有留白，阴影完整绘制） */
.bb-lane-body {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  gap: var(--spacing-sm);
  padding-top: var(--spacing-sm);
  padding-bottom: var(--spacing-sm);
}

.bb-lane-empty {
  color: var(--color-text-weak);
  font-size: var(--font-size-sm);
}

/* ---------------- 任务便签（#127 放大重做：全量信息） ----------------
 *  底色按七类任务类型浅化变体（--color-note-*）；顶部胶带用伪元素半透明条模拟；
 *  确定性小角度旋转已退役——全宽行（flex:1 1 100%）下 ±3° 旋转致相邻便签角部叠压，
 *  CSS 不再消费 rotate；--bb-rot 的 js 注入（hash(task.id) 派生）与纯函数保留不动；
 *  #129 用户验收微调：260px 弹性多列布局改全宽行——每行一张占满泳道整行
 *  （flex:1 1 100%），<768px 段同规则收敛去重。 */
.bb-note {
  position: relative;
  width: 100%;
  max-width: none;
  flex: 1 1 100%;
  border-radius: var(--radius-note);
  background: var(--color-note-other);
  color: var(--color-text);
  padding: var(--spacing-sm) var(--spacing-xs) var(--spacing-xs);
  box-shadow: var(--shadow-1);
  cursor: pointer;
  transition: transform var(--duration-fast) var(--ease-out),
    box-shadow var(--duration-fast) var(--ease-out);
}

.bb-note:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-2);
}

.bb-note:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* 七类便签底色（类名后缀 = task.type；未知类型回落 other 底） */
.bb-note.note-type-feature     { background: var(--color-note-feature); }
.bb-note.note-type-bugfix      { background: var(--color-note-bugfix); }
.bb-note.note-type-refactor    { background: var(--color-note-refactor); }
.bb-note.note-type-performance { background: var(--color-note-performance); }
.bb-note.note-type-security    { background: var(--color-note-security); }
.bb-note.note-type-chore       { background: var(--color-note-chore); }
.bb-note.note-type-other       { background: var(--color-note-other); }

/* 顶部胶带：居中半透明暖色条（#130 第 7 项：微倾角退役拉直——与便签
 * 确定性旋转退役同因，微倾胶带在全宽行/无倾便签上视觉失衡；保持居中定位与尺寸） */
.bb-note-tape {
  position: absolute;
  top: -6px;
  left: 50%;
  width: 46px;
  height: 12px;
  margin-left: -23px;
  background: rgba(232, 228, 216, 0.5);
  border: 1px solid rgba(156, 132, 104, 0.25);
  pointer-events: none;
}

/* 任务名：三行截断（#127 由两行放宽；-webkit-line-clamp，超出省略） */
.bb-note-title {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-tight);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  overflow-wrap: anywhere;
}

/* 摘要行（#127 新增；#186 完整显示）：\n 真实换行（pre-line）+ 超宽折行；六行
 *  钳制仅作越界输入极端防御（登记规范 80 字内约 ≤5 行完整呈现，title 悬浮全文）；
 *  无摘要 js 端不渲染该行 */
.bb-note-summary {
  margin-top: var(--spacing-xxs);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-tight);
  color: var(--color-text-weak);
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

/* 徽章行（#127 扩容）：类型/优先级/影响/子事项 + relay 或「全部」聚合视图项目徽章 */
.bb-note-meta {
  margin-top: var(--spacing-xxs);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-xxs);
}

.bb-note-meta .badge { max-width: 100%; }

/* 底部 meta 行（#127 新增）：来源任务（有才渲染）+ 更新时间 */
.bb-note-foot {
  margin-top: var(--spacing-xxs);
  display: flex;
  align-items: center;
  gap: var(--spacing-xxs);
  min-width: 0;
}

.bb-note-source {
  font-size: var(--font-size-xs);
  color: var(--color-text-weak);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bb-note-time {
  font-size: var(--font-size-xs);
  color: var(--color-text-weak);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
  margin-left: auto;
}

/* ---------------- 批次 C T-C3（#118，design §5.1 便签投影 / F-16；#127 两行放宽） ----------------
 *  agent 投影行：工种色点序列 + 最新结论两行截断（#127 由单行省略放宽；与看板卡同源
 *  KB.store.getView；空视图不加行） */
.bb-note-agents {
  margin-top: var(--spacing-xxs);
  display: flex; align-items: flex-start; gap: var(--spacing-xxs);
  min-width: 0;
}

.bb-note-agent-dots {
  display: inline-flex; align-items: center; gap: 3px;
  flex-shrink: 0;
  /* 两行文本态色点垂直对齐首行文字中心 */
  margin-top: 2px;
}

.bb-note-agent-dot {
  width: 7px; height: 7px; border-radius: 50%;
  display: inline-block; flex-shrink: 0;
}

/* done/archived 泳道色点灰化（L9 历史计数保留，与看板卡 is-done 同口径） */
.bb-note-agent-dot.is-done { filter: grayscale(1); opacity: 0.55; }

.bb-note-agents-text {
  min-width: 0; flex: 0 1 auto;
  font-size: var(--font-size-xs);
  line-height: var(--line-height-tight);
  color: var(--color-text-weak);
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

/* ---------------- U5 伞卡卡面增量（伞卡 #171，设计 §2.1/§2.3） ----------------
 *  便签三增量中的两处样式落点：子卡完成度进度条复用 components.css 既有进度条
 *  组件（零新增规则）；「主体」徽章令牌落 components.css badge 段（badge-umbrella，
 *  accent 组合不新增配色）。此处仅子卡摘要行（bb-note-subs）：原生 button 完整
 *  多行显示（#186：js 端 28/20 字截断与 CSS ellipsis 退役——\n 真实换行 + 超宽
 *  折行，卡高随内容增长；title/aria 全文 + 点击开详情），button 语义与点击行为
 *  不变；hover 沿 accent 令牌。 */
.bb-note-subs {
  display: block;
  width: 100%;
  margin-top: var(--spacing-xxs);
  padding: var(--spacing-xxs) 0;
  border: none;
  background: transparent;
  font: inherit;
  font-size: var(--font-size-xs);
  line-height: var(--line-height-tight);
  color: var(--color-text-weak);
  text-align: left;
  cursor: pointer;
  white-space: pre-line;
  overflow-wrap: anywhere;
}

.bb-note-subs:hover { color: var(--color-accent-dark); }

.bb-note-subs:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

/* ---------------- 窄屏适配（<768px）：状态 tab 切换重做（#127） ----------------
 *  tab 条复用 views.css 767px 段 .board-tabs/.board-tab（desktop 段 display:none
 *  天然隐藏桌面端；44px 触控目标/active 态/sticky 均由既有规则承担）；泳道显隐由
 *  .bb-lanes[data-mobile-tab] 属性驱动（board.js 既有 .board-tab 点击委托写
 *  state.mobileTab → renderBoard 重建本视图，属性选择器仅本媒体查询内生效）。 */
@media (max-width: 767px) {
  .blackboard-view {
    min-height: 0;
  }

  .bb-lanes {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--spacing-sm);
  }

  /* tab 承担状态名与计数：泳道列头简化隐藏（单泳道全屏时冗余） */
  .bb-lane-top { display: none; }

  /* 单 tab 态非 active 泳道整列隐藏（属性值 js 注入，与 board-columns 同款命名） */
  .bb-lanes[data-mobile-tab="todo"] .bb-lane[data-status="doing"],
  .bb-lanes[data-mobile-tab="todo"] .bb-lane[data-status="done"] { display: none; }

  .bb-lanes[data-mobile-tab="doing"] .bb-lane[data-status="todo"],
  .bb-lanes[data-mobile-tab="doing"] .bb-lane[data-status="done"] { display: none; }

  .bb-lanes[data-mobile-tab="done"] .bb-lane[data-status="todo"],
  .bb-lanes[data-mobile-tab="done"] .bb-lane[data-status="doing"] { display: none; }

  /* 单列布局下泳道体高度随内容（纵向滚动由 #content 承担，避免双层滚动嵌套） */
  .bb-lane-body { overflow-y: visible; }

  /* U5：子卡摘要行触控目标 ≥44px（沿 board-tab 触控规格，设计 §2.3）；#186 起
   *  摘要完整多行显示（桌面段 pre-line + 6 行钳制防御，截断档位已退役） */
  .bb-note-subs { min-height: 44px; }

  /* 便签全宽规则已上移桌面段（#129 全宽行统一），此处无需重复声明 */
}
