/* ============================================================
   Darra 浏览项目页视图样式 (darra-ux-filter.css)
   2026-08-05 · git.darra.xyz · GitLab CE 19.2.1
   v18 (2026-10-05): 筛选条外观一律以 darra-forge.css 的 .darra-filter-* 为准,
   本文件不再重复定义筛选条/芯片/视图按钮外观 (含 .active / :hover / 深色),
   只保留 forge.css 没有的部分: 原生控件隐藏、卡片与一行视图布局。
   只加不改: darra-filter-* / darra-cards / darra-list
   ============================================================ */

/* 卡片 / 一行 切换 */

/* 隐藏 GitLab 原生 explore 搜索/过滤条 (含 Language / Role token),
   避免与 Darra 分类/行业筛选并存。
   data-page 用前缀匹配: 真值是 explore:projects:index / :active, 不是 explore:projects。
   限定内容区, 不动 header.super-topbar 的「Search or go to」和右上角 Language 语言按钮 */
#content-body .filtered-search-box,
#content-body .vue-filtered-search-bar-container,
#content-body [data-testid="filtered-search-input"],
#content-body .gl-filtered-search-scrollable,
#content-body form.project-filter-form,
.tab-pane .filtered-search-box,
.tab-pane [data-testid="filtered-search-input"],
.tab-pane .vue-filtered-search-bar-container,
.tab-pane form.project-filter-form,
.projects-list .filtered-search-box,
.projects-list [data-testid="filtered-search-input"],
.projects-list-holder .filtered-search-wrapper,
[data-page*="explore:projects"] .top-area .filtered-search-box,
[data-page*="explore:projects"] .top-area [data-testid="filtered-search-input"],
[data-page*="explore:projects"] .top-area .vue-filtered-search-bar-container,
[data-page*="explore:projects"] .top-area form.project-filter-form,
[data-page*="explore:projects"] .filtered-search-box,
[data-page*="explore:projects"] .vue-filtered-search-bar-container,
[data-page*="explore:projects"] [data-testid="filtered-search-token-language"],
body.darra-catalog .top-area .filtered-search-box,
body.darra-catalog .top-area [data-testid="filtered-search-input"],
body.darra-catalog .top-area .vue-filtered-search-bar-container,
body.darra-catalog .filtered-search-box,
body.darra-catalog .vue-filtered-search-bar-container,
body.darra-catalog [data-testid="filtered-search-token-language"],
.gl-filtered-search-suggestion-list [data-testid*="language"],
.gl-filtered-search-token[data-token-type="language"],
.gl-filtered-search-token[data-testid*="language"] {
  display: none !important;
}

/* 藏 GitLab 原生按名称/姓名排序, 只留 更新 / 创建 / 星星 */
body.darra-catalog a[href*="sort=name_asc"],
body.darra-catalog a[href*="sort=name_desc"],
body.darra-catalog a[href*="sort=name&"],
body.darra-catalog a[href$="sort=name"],
body.darra-catalog .gl-new-dropdown-item:has(a[href*="sort=name"]),
body.darra-catalog li:has(> a[href*="sort=name"]),
body.darra-catalog [data-testid="sort-by-name"],
body.darra-catalog [data-darra-hide-name-sort] {
  display: none !important;
}

/* 藏 GitLab 原生 Sort by 整块，只留 Darra #darra-filter-sort */
#content-body [data-testid="groups-projects-sort"],
#content-body [data-testid="sorting-direction-button"],
#content-body .gl-sorting,
#content-body .top-area .gl-sorting,
#content-body .top-area .sorting,
[data-page*="explore:projects"] [data-testid="groups-projects-sort"],
[data-page*="explore:projects"] [data-testid="sorting-direction-button"],
[data-page*="explore:projects"] .top-area .gl-sorting,
[data-page*="explore:projects"] [data-darra-hide-native-sort],
body.darra-catalog [data-testid="groups-projects-sort"],
body.darra-catalog [data-testid="sorting-direction-button"],
body.darra-catalog .top-area .gl-sorting,
body.darra-catalog [data-darra-hide-native-sort] {
  display: none !important;
}

/* 标题行右上角：排序 + 卡片/条状，不挤占「浏览项目」 */
#content-body .page-title-holder {
  justify-content: space-between;
  gap: 16px;
}
#content-body .page-title-holder .page-title-controls {
  display: flex !important;
  align-items: center;
  margin-left: auto;
  flex: none;
  min-height: 0;
}
.darra-filter-title-tools {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  flex: none;
}
.darra-filter-title-tools .darra-filter-label {
  margin: 0;
}

/* 行业芯片计数徽章 (v=20, 镜像分类徽章): 计数为空时不占位, 外观由 darra-forge.css 定义 */
.darra-filter-chip-count:empty {
  display: none;
}

/* ---------- 行4: 排序 / 重置 ---------- */
.darra-filter-conds {
  gap: 6px 18px;
}
.darra-filter-select {
  height: 30px;
  padding: 0 6px;
  border: 1px solid var(--gl-border-color-strong, #c7ccd1);
  border-radius: 6px;
  background: var(--gl-background-color-default, #fff);
  color: var(--gl-text-color, #1f2329);
  font-size: 13px;
  cursor: pointer;
  outline: none;
}
.darra-filter-select:focus {
  border-color: #0969da;
}

/* ---------- 空结果提示 ---------- */
.darra-filter-empty {
  margin-top: 10px;
  padding: 14px;
  border: 1px dashed var(--gl-border-color-strong, #c7ccd1);
  border-radius: 8px;
  text-align: center;
  font-size: 13px;
  color: var(--gl-text-color-secondary, #5c6169);
  background: var(--gl-background-color-default, rgba(0, 0, 0, 0.015));
}

/* ============================================================
   v3: 卡片视图 (GitHub 风格) — ul.darra-cards
   ============================================================ */
ul.darra-cards.gl-list-none {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  grid-auto-rows: 1fr;
  align-items: stretch;
  gap: 14px;
}
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] {
  position: relative;
  border: 1px solid var(--gl-border-color-default, rgba(0, 0, 0, 0.14));
  border-radius: 8px;
  background: var(--gl-background-color-default, #fff);
  padding: 14px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
  min-width: 0;
  min-height: 190px;
  height: 100%;
}
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"]:hover {
  box-shadow: 0 6px 16px rgba(9, 105, 218, 0.15);
  border-color: rgba(9, 105, 218, 0.5);
}
/* 卡片内部: 标题/主题为内容区，统计固定在底部，三块互不抢布局 */
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] > div {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  min-height: 100%;
  padding: 0;
  border: 0 !important;
}
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start {
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: column;
  width: 100% !important;
}
ul.darra-cards.gl-list-none [data-testid="project-content"] {
  display: block !important;
  flex: 0 1 auto !important;
  width: 100% !important;
}
ul.darra-cards.gl-list-none [data-testid="project-content"] > .gl-mr-3 {
  display: none !important;
}
ul.darra-cards.gl-list-none .gl-avatar-labeled,
ul.darra-cards.gl-list-none .gl-avatar-labeled-labels {
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
}
ul.darra-cards.gl-list-none .gl-avatar-labeled-label {
  max-width: none !important;
  padding-right: 40px;
}
ul.darra-cards.gl-list-none section.gl-mt-2 {
  max-width: none !important;
}
ul.darra-cards.gl-list-none .gl-truncate-text {
  --lines: 3;
}
/* 只显示真正的 topic badge，不重复打印“主题:”标题 */
ul.darra-cards.gl-list-none [data-testid="project-topics"] {
  max-width: none !important;
  margin-top: 14px !important;
  min-height: 25px;
  flex-wrap: wrap;
  align-content: flex-start;
}
ul.darra-cards.gl-list-none [data-testid="project-topics"] > span:first-child {
  display: none !important;
}
ul.darra-cards.gl-list-none [data-testid="project-topics"]:not(:has(.gl-badge)) {
  display: none !important;
}
/* 统计容器位于卡片内容容器内；固定贴底，与标题/topic 分区 */
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start > .gl-mt-3.gl-shrink-0 {
  display: flex !important;
  flex: 0 0 auto !important;
  width: 100% !important;
  margin: auto 0 0 0 !important;
  padding: 12px 0 0 0 !important;
  border-top: 1px solid var(--gl-border-color-default, rgba(0, 0, 0, 0.10));
  flex-direction: row !important;
  flex-wrap: wrap;
  align-items: center !important;
  justify-content: space-between;
  gap: 8px 14px;
}
ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start > .gl-mt-3.gl-shrink-0 > .gl-flex {
  flex: 0 1 auto !important;
  flex-wrap: wrap;
}
/* 浏览卡片只保留星标/派生；工作项与合并请求仍在导航和项目内完整保留 */
ul.darra-cards.gl-list-none [data-testid="mrs-btn"],
ul.darra-cards.gl-list-none [data-testid="issues-btn"] {
  display: none !important;
}
/* 右上角操作按钮 (⋯) 绝对定位 */
ul.darra-cards.gl-list-none [data-testid="projects-list-item-actions"] {
  position: absolute;
  top: 10px;
  right: 10px;
}
ul.darra-cards.gl-list-none .-gl-mt-3 {
  margin-top: 0 !important;
  margin-left: 0 !important;
}

/* ============================================================
   一行视图: 名 + 元信息同一行 (非卡片 grid)
   ============================================================ */
body.darra-catalog ul.darra-list.gl-list-none,
body.darra-catalog ul.gl-list-none:not(.darra-cards) {
  display: block;
  grid-template-columns: none;
}
body.darra-catalog ul.darra-list.gl-list-none > li[data-testid^="projects-list-item-"],
body.darra-catalog ul.gl-list-none:not(.darra-cards) > li[data-testid^="projects-list-item-"] {
  min-height: 0;
  height: auto;
  padding: 8px 4px;
  border: 0;
  border-bottom: 1px solid var(--gl-border-color-default, rgba(0, 0, 0, 0.08));
  border-radius: 0;
  box-shadow: none;
  background: transparent;
}
body.darra-catalog ul.darra-list.gl-list-none > li[data-testid^="projects-list-item-"]:hover,
body.darra-catalog ul.gl-list-none:not(.darra-cards) > li[data-testid^="projects-list-item-"]:hover {
  box-shadow: none;
  border-color: var(--gl-border-color-default, rgba(0, 0, 0, 0.08));
  background: rgba(9, 105, 218, 0.04);
}
body.darra-catalog ul.darra-list.gl-list-none > li[data-testid^="projects-list-item-"] > div,
body.darra-catalog ul.gl-list-none:not(.darra-cards) > li[data-testid^="projects-list-item-"] > div {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: nowrap;
  gap: 12px;
  min-height: 0;
  padding: 0;
  border: 0 !important;
}
body.darra-catalog ul.darra-list.gl-list-none > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start,
body.darra-catalog ul.gl-list-none:not(.darra-cards) > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start {
  display: flex !important;
  flex: 1 1 auto;
  flex-direction: row !important;
  align-items: center !important;
  min-width: 0;
  gap: 12px;
  width: auto !important;
}
body.darra-catalog ul.darra-list [data-testid="project-content"],
body.darra-catalog ul.gl-list-none:not(.darra-cards) [data-testid="project-content"] {
  display: flex !important;
  flex: 1 1 auto !important;
  align-items: center;
  min-width: 0;
  width: auto !important;
}
body.darra-catalog ul.darra-list [data-testid="project-content"] > .gl-mr-3,
body.darra-catalog ul.gl-list-none:not(.darra-cards) [data-testid="project-content"] > .gl-mr-3 {
  display: block !important;
  flex: none;
}
body.darra-catalog ul.darra-list .gl-avatar-labeled,
body.darra-catalog ul.gl-list-none:not(.darra-cards) .gl-avatar-labeled,
body.darra-catalog ul.darra-list .gl-avatar-labeled-labels,
body.darra-catalog ul.gl-list-none:not(.darra-cards) .gl-avatar-labeled-labels {
  width: auto !important;
  min-width: 0 !important;
}
body.darra-catalog ul.darra-list .gl-avatar-labeled-label,
body.darra-catalog ul.gl-list-none:not(.darra-cards) .gl-avatar-labeled-label {
  max-width: none !important;
  padding-right: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
body.darra-catalog ul.darra-list section.gl-mt-2,
body.darra-catalog ul.gl-list-none:not(.darra-cards) section.gl-mt-2,
body.darra-catalog ul.darra-list [data-testid="project-topics"],
body.darra-catalog ul.gl-list-none:not(.darra-cards) [data-testid="project-topics"] {
  display: none !important;
}
body.darra-catalog ul.darra-list > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start > .gl-mt-3.gl-shrink-0,
body.darra-catalog ul.gl-list-none:not(.darra-cards) > li[data-testid^="projects-list-item-"] > div > .gl-grow.gl-items-start > .gl-mt-3.gl-shrink-0 {
  display: flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  white-space: nowrap;
}
body.darra-catalog ul.darra-list [data-testid="projects-list-item-actions"],
body.darra-catalog ul.gl-list-none:not(.darra-cards) [data-testid="projects-list-item-actions"] {
  position: static;
  flex: none;
}

/* ---------- 深色模式 ---------- */
.darra-dark .darra-filter-empty {
  color: #aeb4bd;
}
.darra-dark .darra-filter-select {
  border-color: rgba(255, 255, 255, 0.22);
  background-color: #1b1f24;
  color: #e6e9ed;
}
.darra-dark .darra-filter-select:focus {
  border-color: #0969da;
}
/* 卡片视图深色 */
.darra-dark ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"] {
  border-color: rgba(255, 255, 255, 0.16);
  background: #1b1f24;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.darra-dark ul.darra-cards.gl-list-none > li[data-testid^="projects-list-item-"]:hover {
  border-color: rgba(9, 105, 218, 0.6);
  box-shadow: 0 6px 16px rgba(9, 105, 218, 0.12);
}

/* ============================================================
   主题结果页卡片 (老式 ul.projects-list > li.project-row)
   2026-08-24 用户裁定: 全页面统一卡片模式, 数值镜像上方新式卡片
   ============================================================ */
ul.projects-list.darra-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(330px, 1fr));
  grid-auto-rows: 1fr;
  align-items: stretch;
  gap: 14px;
  margin: 0;
  padding: 0;
  list-style: none;
}
ul.projects-list.darra-cards > li.project-row {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 12px;
  border: 1px solid var(--gl-border-color-default, rgba(0, 0, 0, 0.14));
  border-radius: 8px;
  background: var(--gl-background-color-default, #fff);
  color: var(--gl-text-color, #1f2329);
  padding: 14px;
  margin: 0;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
  min-width: 0;
  min-height: 120px;
  height: 100%;
}
/* 老式条形留下的 cell 底边线, 卡片里必须清掉 (否则卡内出现阶梯状横线) */
ul.projects-list.darra-cards > li.project-row > .project-cell {
  border-bottom: 0 !important;
}
/* 右侧统计 cell (条形布局的第三栏) 在卡片里退场 — 卡片用 project-details 内嵌的同款行 */
ul.projects-list.darra-cards > li.project-row > .project-cell.project-controls {
  display: none !important;
}
/* 内容列撑满卡片高度, 让底部统计行 margin-top:auto 生效 */
ul.projects-list.darra-cards > li.project-row > .project-cell:not(.gl-w-11):not(.project-controls) {
  display: flex;
  flex: 1 1 auto;
  min-width: 0;
}
ul.projects-list.darra-cards > li.project-row:hover {
  box-shadow: 0 6px 16px rgba(9, 105, 218, 0.15);
  border-color: rgba(9, 105, 218, 0.5);
}
/* 首列收窄, 内容列撑满 */
ul.projects-list.darra-cards > li.project-row > .project-cell.gl-w-11 {
  width: auto !important;
  flex: 0 0 auto;
}
ul.projects-list.darra-cards .project-details {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  width: 100%;
  padding-right: 0 !important;
}
ul.projects-list.darra-cards .project-details .description {
  color: var(--gl-text-color-secondary, #5e6a75);
  margin: 4px 0 0;
}
ul.projects-list.darra-cards .project-details .description p {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
}
ul.projects-list.darra-cards [data-testid="project_topic_list"] {
  flex-wrap: wrap;
}
/* stars + 更新时间钉卡片底部 (内嵌行, 覆盖容器查询的 @sm/panel:!gl-hidden) */
ul.projects-list.darra-cards .project-details > .gl-flex.gl-items-center.gl-mt-3 {
  display: flex !important;
  margin-top: auto !important;
  padding-top: 10px;
  border-top: 1px solid var(--gl-border-color-default, rgba(0, 0, 0, 0.10));
}
.darra-dark ul.projects-list.darra-cards > li.project-row {
  border-color: rgba(255, 255, 255, 0.16);
  background: #1b1f24;
  color: #e6edf3;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.darra-dark ul.projects-list.darra-cards > li.project-row:hover {
  border-color: rgba(9, 105, 218, 0.6);
  box-shadow: 0 6px 16px rgba(9, 105, 218, 0.12);
}
.darra-dark ul.projects-list.darra-cards .project-details .description {
  color: #9da7b3;
}

/* ---------- 窄屏折叠 (≤ 640px): 行堆叠, chips 横向滚动 ---------- */
@media (max-width: 640px) {
  .darra-filter-row-top {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .darra-filter-conds {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
  }
  /* 窄屏卡片 2 列 → 1 列 */
  ul.darra-cards.gl-list-none {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  }
}

/* ============================================================
   全站筛选同一套样式 (2026-10-03)
   目录 / 主题 / 群组 / 搜索页 统一 .darra-filter-bar 同款紧凑条;
   搜索页原生 search-filters 面板隐藏, 只留 Darra 筛选条。
   ============================================================ */

/* 搜索页原生筛选面板 → 隐藏, 由 .darra-filter-bar 接管 */
[data-testid="search-filters"],
.search-results .filters {
  display: none !important;
}

