/* ============================================================
   社区资源视图（复刻自 CommunityView.vue 的 scoped 样式）
   所有选择器以 .view-community 开头；颜色/阴影仅使用 CSS 变量
   ============================================================ */

.view-community .page {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 940px;
  margin: 0 auto;
}

/* ---------------- 搜索卡片 ---------------- */
.view-community .search-card {
  display: flex;
  flex-direction: column;
  gap: 14px;
  backdrop-filter: blur(var(--glass-blur)) saturate(130%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(130%);
}
.view-community .search-row {
  display: flex;
  gap: 10px;
}
.view-community .search-row .input {
  flex: 1;
  min-width: 0;
}
.view-community .search-btn {
  flex-shrink: 0;
}

.view-community .kind-capsules {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.view-community .capsule {
  padding: 6px 16px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--card-2);
  color: var(--text-dim);
  font-size: 13px;
  font-family: inherit;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}
.view-community .capsule:hover {
  color: var(--text);
  border-color: var(--border-strong);
}
.view-community .capsule.active {
  background: var(--accent-soft);
  border-color: var(--accent);
  color: var(--accent);
  font-weight: 600;
}

.view-community .filter-row {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
}
.view-community .filter-select {
  flex: 1;
  min-width: 140px;
}

/* 可搜索版本下拉 */
.view-community .ver-filter {
  position: relative;
  flex: 1.4;
  min-width: 170px;
}
.view-community .ver-filter-input {
  width: 100%;
}
.view-community .ver-filter-menu {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  max-height: 260px;
  overflow-y: auto;
  z-index: 9001;
}
.view-community .ver-filter-menu .menu-item[hidden] {
  display: none;
}
.view-community .ver-menu-empty {
  padding: 12px;
  text-align: center;
  color: var(--text-dim);
  font-size: 12.5px;
}

/* ---------------- 结果列表 ---------------- */
.view-community .list-card {
  padding: 8px;
  backdrop-filter: blur(var(--glass-blur)) saturate(130%);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(130%);
}
.view-community .result-list {
  display: flex;
  flex-direction: column;
}
.view-community .result-row {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 14px 12px;
  border-radius: 10px;
  transition: background 0.15s ease;
}
.view-community .result-row + .result-row {
  border-top: 1px solid var(--border);
}
.view-community .result-row:hover {
  background: var(--hover);
}
.view-community .result-row[hidden] {
  display: none;
}

.view-community .result-icon {
  width: 48px;
  height: 48px;
  flex-shrink: 0;
  border-radius: 10px;
  overflow: hidden;
  background: var(--card-2);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
}
.view-community .result-icon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.view-community .icon-placeholder {
  font-size: 20px;
  font-weight: 700;
  color: var(--text-dim);
}

.view-community .result-info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.view-community .result-head {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.view-community .result-title {
  flex: 1 1 220px;
  font-weight: 700;
  font-size: 15px;
}
/* CurseForge 橙（用语义色混合近似，Modrinth 绿复用全局 tag-success） */
.view-community .tag-cf {
  background: color-mix(in srgb, var(--danger) 10%, transparent);
  color: color-mix(in srgb, var(--danger) 55%, var(--accent));
}
.view-community .result-author {
  font-size: 12px;
}
.view-community .result-desc {
  font-size: 13px;
  color: var(--text-dim);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.view-community .result-meta {
  font-size: 12px;
  display: flex;
  gap: 6px;
}
.view-community .meta-dot {
  opacity: 0.6;
}
.view-community .result-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex-shrink: 0;
  margin-right: 4px;
}
.view-community .result-dl {
  flex-shrink: 0;
}

.view-community .more-row {
  display: flex;
  justify-content: center;
  padding: 14px 0 8px;
}
.view-community .more-row[hidden] {
  display: none;
}
.view-community .empty[hidden] {
  display: none;
}

/* ---------------- 跑马灯（复刻 MarqueeText） ---------------- */
.view-community .marquee {
  display: block;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
}
.view-community .marquee > span {
  display: inline-block;
}
.view-community .marquee.overflow > span {
  animation: view-community-scroll var(--duration, 8s) ease-in-out infinite;
}
.view-community .marquee:hover > span,
.view-community .marquee:focus > span {
  animation-play-state: running;
}
@keyframes view-community-scroll {
  0%,
  18%,
  100% {
    transform: translateX(0);
  }
  65%,
  82% {
    transform: translateX(var(--travel, -120px));
  }
}
@media (prefers-reduced-motion: reduce) {
  .view-community .marquee.overflow > span {
    animation: none;
  }
  .view-community .marquee {
    overflow-x: auto;
  }
}

/* ---------------- 下载模态框 ---------------- */
.view-community .modal-mask[hidden] {
  display: none;
}
.view-community .modal-title {
  font-size: 17px;
  font-weight: 700;
  margin-bottom: 16px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.view-community .modal-links {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
}
.view-community .modal-filter label {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 13px;
  color: var(--text-dim);
}
.view-community .modal-label {
  font-size: 13px;
  color: var(--text-dim);
  margin: 14px 0 8px;
}
.view-community .file-list {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-height: 240px;
  overflow-y: auto;
  border: 1px solid var(--border);
  border-radius: 10px;
  padding: 6px;
  background: var(--card-2);
}
.view-community .file-row {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 12px 10px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: transparent;
  color: var(--text);
  font-size: 13px;
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 0.14s ease, border-color 0.14s ease;
}
.view-community .file-row:hover {
  background: var(--hover);
}
.view-community .file-row.active {
  background: var(--accent-soft);
  border-color: var(--accent);
}
.view-community .file-version {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-weight: 600;
}
.view-community .file-meta {
  font-size: 12px;
  white-space: nowrap;
}
.view-community .files-error {
  font-size: 13px;
  color: var(--danger);
  padding: 6px 0;
}
.view-community .modal-actions {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 20px;
}