/* ============================================================
   Darra GitLab 仓库浏览 UX 增强 (darra-ux-browse.css)
   2026-08-04 · git.darra.xyz 工业仓储
   只加不改: 所有规则独立命名空间 (darra-*), 不动 GitLab 原样式
   ============================================================ */

/* ---------- 1. 代码查看可读性 ----------
   等宽字体优先 + 行距 + 行号细字; GitLab 自带当前行高亮, 这里加深 + 脉冲 */
.darra-blob .blob-content .line,
.darra-blob .blob-code .line,
.darra-blob pre,
.darra-blob code {
  font-family: "Cascadia Code", "JetBrains Mono", "Consolas", "Courier New", monospace !important;
}
.darra-blob .blob-content,
.darra-blob .blob-code {
  line-height: 1.6 !important;
}
.darra-blob .line-numbers,
.darra-blob .blob-linenumber {
  font-size: 11px !important;
  color: #9095a0 !important;
  font-weight: 400 !important;
}
/* 当前行高亮加深 (GitLab .blob-line-highlight 已存在, 加深以利工业代码阅读) */
.darra-blob .blob-line.blob-line-highlight,
.darra-blob tr.blob-line-highlight {
  background: rgba(73, 111, 255, 0.10) !important;
}
.darra-blob .blob-line-highlight .line-numbers {
  background: rgba(73, 111, 255, 0.14) !important;
  color: #496fff !important;
  font-weight: 600 !important;
}
/* 点击行号后的短暂脉冲提示 */
@keyframes darra-line-pulse {
  0% { background-color: rgba(73, 111, 255, 0.28); }
  100% { background-color: transparent; }
}
.darra-blob .darra-line-pulse {
  animation: darra-line-pulse 0.8s ease-out 1 !important;
}

/* ---------- 2. 工业文件类型标签 ----------
   文件树/列表行内追加的小徽标 (JS 注入, 颜色内联设置, 这里只定布局) */
.darra-ext-tag {
  display: inline-block;
  margin-left: 6px;
  padding: 0 4px;
  font-size: 10px;
  font-weight: 700;
  line-height: 15px;
  border: 1px solid;
  border-radius: 3px;
  vertical-align: 1px;
  white-space: nowrap;
  background: rgba(255, 255, 255, 0.04);
}
.darra-ext-tag-dim {
  color: #868e96 !important;
  border-color: #868e96 !important;
  font-weight: 400;
}
.dark .darra-ext-tag {
  background: rgba(255, 255, 255, 0.06);
}

/* ---------- 3. 目录折叠状态 (折叠行样式回放, 与 GitLab 视觉一致) ---------- */
.repo-file-tree .tree-item.collapsed > .tree-item-row {
  opacity: 0.72;
}

/* ---------- 4. 文件树快速过滤框 ---------- */
.darra-ux-filter {
  width: calc(100% - 8px);
  margin: 8px 4px 4px;
  padding: 6px 10px;
  font-size: 13px;
  color: inherit;
  background: var(--gl-input-bg, rgba(0, 0, 0, 0.04));
  border: 1px solid var(--gl-border-color, rgba(0, 0, 0, 0.15));
  border-radius: 6px;
  outline: none;
  box-sizing: border-box;
  transition: border-color 0.15s;
}
.darra-ux-filter:focus {
  border-color: #496fff;
  background: var(--gl-input-bg, #fff);
}
.dark .darra-ux-filter {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.16);
}
.dark .darra-ux-filter:focus {
  border-color: #6f8dff;
  background: rgba(255, 255, 255, 0.08);
}
.darra-ux-filter::-webkit-search-cancel-button {
  cursor: pointer;
}

/* ---------- 5. README 首页卡片化 + 图片懒加载 ---------- */
.darra-ux-readme {
  border: 1px solid var(--gl-border-color, rgba(0, 0, 0, 0.12));
  border-radius: 10px;
  padding: 16px 24px;
  margin: 8px 0 16px;
  background: var(--gl-background, #fff);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}
.dark .darra-ux-readme {
  background: rgba(255, 255, 255, 0.03);
  border-color: rgba(255, 255, 255, 0.12);
}
.darra-ux-readme h1 {
  border-bottom: 1px solid var(--gl-border-color, rgba(0, 0, 0, 0.12));
  padding-bottom: 8px;
}
.darra-ux-lazy {
  max-width: 100%;
}

/* ---------- 6. 大文件警告 ---------- */
.darra-ux-large {
  display: inline-block;
  margin-left: 8px;
  padding: 1px 6px;
  font-size: 11px;
  font-weight: 600;
  color: #f08c00;
  border: 1px solid #f08c00;
  border-radius: 3px;
  background: rgba(240, 140, 0, 0.08);
  white-space: nowrap;
}