/* Card interaction and sizing only. Navigation, switching tabs, filters and pagination
   keep their page-specific styles. */
:root {
  --choice-hover: #f6f6fc;
  --choice-selected: #ebebf5;
  --choice-text: #0b0b0f;
  --choice-hover-outline: #d0d3eb;
  --choice-selected-outline: #5252ff;
}

@media (max-width: 760px) {
  :root {
    --choice-hover: var(--feishu-color-fill-0);
    --choice-selected: var(--feishu-color-primary-light-default);
    --choice-text: var(--feishu-color-text-0);
    --choice-hover-outline: var(--feishu-color-border);
    --choice-selected-outline: var(--feishu-color-primary);
    --choice-selected-width: 1px;
  }
}

/* Selectable content cards share the same feedback, regardless of page or
   whether selection is stored on the card, its wrapper or a form control. */
@media (hover: hover) {
body[data-lg-navigation-ready] #应用 #环节轨道 :is(
  .技能功能卡[data-team-workflow-open],.技能功能卡[data-workflow-guide],.内容架构内容卡,.素材采集库卡,
  .知识库来源整体项,.课程子内容摘要卡,.课程模板侧栏卡,
  .课程来源项,.课程选题卡:not(.只读),.背景库素材卡,
  .自由配版模板组卡,.全部模板卡容器
):is(:hover,:focus-visible,:focus-within):not(.当前):not(.已选中):not([aria-pressed="true"]),
body[data-lg-navigation-ready] #应用 #环节轨道 .飞书素材卡片:is(:hover,:focus-within):not(:has(input:checked)),
body[data-lg-navigation-ready] #模板库弹窗 :is(.全部模板卡容器,.模板子页面按钮):is(:hover,:focus-visible,:focus-within):not(.当前):not([aria-pressed="true"]),
body[data-lg-navigation-ready] :is(#IM模板弹窗 .IM模板弹窗卡,#IM模板源选择弹窗 .IM模板源选择卡):is(:hover,:focus-within):not(:has(input:checked)) {
  background: var(--choice-hover) !important;
  color: var(--choice-text) !important;
  box-shadow: inset 0 0 0 1px var(--choice-hover-outline) !important;
  transform: none !important;
}
}
body[data-lg-navigation-ready] #应用 #环节轨道 :is(
  .技能功能卡[data-team-workflow-open],.技能功能卡[data-workflow-guide],.内容架构内容卡,.素材采集库卡,
  .知识库来源整体项,.课程子内容摘要卡,.课程模板侧栏卡,
  .课程来源项,.课程选题卡:not(.只读),.背景库素材卡,
  .自由配版模板组卡,.全部模板卡容器,.飞书素材卡片
):is(.当前,.已选中,[aria-pressed="true"],[aria-selected="true"]),
body[data-lg-navigation-ready] #应用 #环节轨道 .飞书素材卡片:has(input:checked),
body[data-lg-navigation-ready] #模板库弹窗 :is(.全部模板卡容器,.模板子页面按钮):is(.当前,[aria-pressed="true"]),
body[data-lg-navigation-ready] :is(#IM模板弹窗 .IM模板弹窗卡,#IM模板源选择弹窗 .IM模板源选择卡):has(input:checked) {
  background: var(--choice-selected) !important;
  color: var(--choice-text) !important;
  box-shadow: inset 0 0 0 var(--choice-selected-width, 2px) var(--choice-selected-outline) !important;
  transform: none !important;
}

body[data-lg-navigation-ready] #应用 #环节轨道 .技能功能卡[data-team-workflow-open] {
  cursor: pointer;
}
@media (hover: hover) {
body[data-lg-navigation-ready] #应用 #环节轨道 :is(
  .技能功能卡[data-team-workflow-open],.技能功能卡[data-workflow-guide],.内容架构内容卡,.素材采集库卡,
  .知识库来源整体项,.课程子内容摘要卡,.课程模板侧栏卡,
  .课程来源项,.课程选题卡:not(.只读),.背景库素材卡,
  .自由配版模板组卡,.全部模板卡容器,.飞书素材卡片
):active,
body[data-lg-navigation-ready] #模板库弹窗 :is(.全部模板卡容器,.模板子页面按钮):active,
body[data-lg-navigation-ready] :is(#IM模板弹窗 .IM模板弹窗卡,#IM模板源选择弹窗 .IM模板源选择卡):active {
  background: var(--choice-selected) !important;
  box-shadow: inset 0 0 0 2px var(--choice-selected-outline) !important;
  transform: none !important;
}
}
/* Template selection lives on the wrapper; its inner button and footer must
   let that wrapper's state show through. */
body[data-lg-navigation-ready] #应用 #环节轨道 .全部模板卡容器:is(:hover,:focus-within,.当前) > .全部模板卡,
body[data-lg-navigation-ready] #模板库弹窗 .全部模板卡容器:is(:hover,:focus-within,.当前) > .全部模板卡,
body[data-lg-navigation-ready] #应用 #环节轨道 .课程来源项:is(:hover,:focus-within,.当前) > footer {
  background: transparent !important;
}

/* Card columns follow the available content width after sidebar and page padding. */
body[data-lg-navigation-ready] #环节轨道 .技能卡片网格 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)) !important;
}
body[data-lg-navigation-ready][data-current-page="material"] #环节轨道 .素材采集库页面 .全部模板网格 {
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 350px), 1fr)) !important;
}

/* Work log selection marks the column name only, leaving its task count clear. */
body[data-lg-navigation-ready][data-current-page="featurelog"] #应用 .工作日志栏目标签 > button:is(.已选中,[aria-selected="true"]),
body[data-lg-navigation-ready][data-current-page="featurelog"] #应用 .工作日志栏目标签 > button:is(:hover,:focus-visible) {
  color: var(--lg-shell-accent,#5252ff) !important;
  background: transparent !important;
}
body[data-lg-navigation-ready][data-current-page="featurelog"] #应用 .工作日志栏目标签 > button::after {
  content: none !important;
}
body[data-lg-navigation-ready][data-current-page="featurelog"] #应用 .工作日志栏目标签 > button > span {
  position: relative;
}
body[data-lg-navigation-ready][data-current-page="featurelog"] #应用 .工作日志栏目标签 > button:is(.已选中,[aria-selected="true"]) > span::after {
  content: "" !important;
  position: absolute;
  left: 0;
  right: 0;
  bottom: -4px;
  height: 2px;
  background: var(--lg-shell-accent,#5252ff) !important;
  border-radius: 2px;
  box-shadow: none !important;
  transform: none !important;
  transition: none !important;
}
