/* ============================================================
   ★★★ 统一卡片样式（白底 + 金蓝品牌色 + 柔阴影）★★★
   
   所有页面的卡片、列表、标签、按钮风格都在这里统一管理。
   以后改配色只改这一个文件。
   
   使用的品牌色：
     主金 #ecc63b   主蓝 #3b91ec   深蓝字 #1a2a4a   灰蓝字 #6b7a99
   
   覆盖的页面：
     index.html       → .card, .card-item, .card-more
     project.html     → .project-card 及相关类
     selected/        → .selected-row 及相关类
     new/             → .new-row 及相关类
     download.html    → .category, .result-item, .search-box, .back-btn
     product.html     → （如果有卡片类）
   ============================================================ */

/* ========== 1. 所有卡片容器（统一白底 + 圆角 + 柔阴影） ========== */
.card,                       /* 主页卡片 */
.project-card,               /* 项目页卡片 */
.selected-row,               /* 精选列表行 */
.new-row,                    /* 新增列表行 */
.category,                   /* 下载分类卡 */
.result-item {               /* 下载搜索结果 */
  background: #ffffff;
  border: 1px solid rgba(59, 145, 236, 0.12);
  border-radius: 16px;
  box-shadow: 0 2px 6px rgba(26, 42, 74, 0.04),
              0 8px 24px rgba(26, 42, 74, 0.06);
  transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.45s ease,
              border-color 0.45s ease;
}

/* hover：微抬升 + 边框变亮 + 阴影加深 */
.card:hover,
.project-card:hover,
.selected-row:hover,
.new-row:hover,
.category:hover {
  transform: translateY(-6px);
  border-color: rgba(59, 145, 236, 0.45);
  box-shadow: 0 4px 12px rgba(59, 145, 236, 0.08),
              0 16px 40px rgba(26, 42, 74, 0.10);
}

.result-item:hover {
  border-color: rgba(59, 145, 236, 0.45);
  transform: translateX(4px);
  box-shadow: 0 4px 14px rgba(59, 145, 236, 0.10);
}

/* ========== 2. 图片区（极淡蓝底，替代原来深蓝渐变） ========== */
.project-img-box,
.selected-img-box,
.new-img-box {
  background: linear-gradient(135deg, #f0f5fc, #f8fafc);
}

/* 图片占位提示（替代原来白色虚线框） */
.project-img-ph,
.selected-img-ph,
.new-img-ph {
  color: rgba(26, 42, 74, 0.35);
  border: 1px dashed rgba(59, 145, 236, 0.25);
  background: rgba(59, 145, 236, 0.03);
}

/* 图片阴影光晕 */
.selected-img,
.new-img {
  filter: drop-shadow(0 6px 16px rgba(59, 145, 236, 0.15));
}

/* ========== 3. 信息区（白→极淡蓝/金分层） ========== */
.project-body {
  background: #ffffff;
}
.selected-info-box,
.new-info-box {
  background: #ffffff;
  /* 右下角隐约的金→蓝淡色渐变，呼应品牌色但极淡 */
  background-image: linear-gradient(135deg,
    rgba(236, 198, 59, 0.04) 0%,
    rgba(255, 255, 255, 0) 30%,
    rgba(59, 145, 236, 0.04) 100%);
}

/* ========== 4. 标题文字 ========== */
.card-title,
.project-title,
.selected-title,
.category h3 {
  color: #1a2a4a;
}
.category h3 a {
  color: #3b91ec;
}
.category h3 a:hover {
  color: #1a2a4a;
}

/* ========== 5. 描述文字 ========== */
.card-desc,
.project-desc,
.selected-desc,
.category p,
.result-name {
  color: #6b7a99;
}

/* ========== 6. 按钮（统一细边框 + hover 填淡底色） ========== */
.card-more,
.project-btn,
.category-link,
.back-btn {
  color: #3b91ec;
  border: 1px solid rgba(59, 145, 236, 0.40);
  border-radius: 30px;
  background: transparent;
  text-decoration: none;
  transition: background 0.3s ease,
              border-color 0.3s ease,
              color 0.3s ease,
              letter-spacing 0.3s ease;
}

.card-more {
  border: none;              /* 主页"查看更多"不加框 */
  padding: 0;
  border-radius: 0;
  background: transparent;
}
.card-more:hover {
  color: #ecc63b;
  letter-spacing: 3px;
  background: transparent;
}

.project-btn:hover,
.category-link:hover,
.back-btn:hover {
  background: rgba(59, 145, 236, 0.08);
  border-color: rgba(59, 145, 236, 0.70);
  color: #1a2a4a;
  letter-spacing: 3px;
}

/* "敬请期待"虚线卡片 */
.project-card.more-card {
  background: #ffffff;
  border: 2px dashed rgba(59, 145, 236, 0.30);
  box-shadow: none;
}
.more-card-inner {
  color: #3b91ec;
}

/* ========== 7. 分类标签（项目=蓝 / 产品=金） ========== */
.selected-tag {
  background: transparent;
  border-radius: 20px;
}
.selected-tag.tag-project,
.tag-project {
  color: #3b91ec;
  border-color: rgba(59, 145, 236, 0.45);
  background: rgba(59, 145, 236, 0.06);
}
.selected-tag.tag-product,
.tag-product {
  color: #b8972a;            /* 主金 #ecc63b 太亮当文字，用加深版 */
  border-color: rgba(236, 198, 59, 0.55);
  background: rgba(236, 198, 59, 0.10);
}
.selected-tag.tag-other,
.tag-other {
  color: #6b7a99;
  border-color: rgba(107, 122, 153, 0.30);
  background: rgba(107, 122, 153, 0.06);
}
/* 覆盖原来的霓虹粉产品标签 */
.result-cat {
  color: #b8972a !important;
  border-color: rgba(236, 198, 59, 0.50) !important;
  background: rgba(236, 198, 59, 0.10) !important;
}

.selected-tag-icon {
  background: rgba(59, 145, 236, 0.06);
}

/* ========== 8. 下载页搜索框 ========== */
.search-box input {
  background: #ffffff;
  color: #1a2a4a;
  border-color: rgba(59, 145, 236, 0.15);
}
.search-box input:focus {
  border-color: #3b91ec;
}
.search-box button {
  background: linear-gradient(90deg, #ecc63b, #3b91ec);
  color: #ffffff;
  font-weight: 700;
}
.search-box button:hover {
  filter: brightness(1.05);
}

/* ========== 9. 搜索结果项 ========== */
.result-item {
  background: rgba(59, 145, 236, 0.03);
}
.result-hot,
.result-icon {
  background: rgba(59, 145, 236, 0.06);
  border-radius: 8px;
}

/* ========== 10. 主页 card-item 小条目 ========== */
.card-item {
  background: rgba(59, 145, 236, 0.03);
  border: 1px solid rgba(59, 145, 236, 0.12);
}
.card-item:hover {
  background: rgba(59, 145, 236, 0.07);
  border-color: rgba(59, 145, 236, 0.45);
  transform: translateX(4px);
}
.card-item-dot {
  background: #3b91ec;
}
.card-item-cat {
  color: #b8972a;
  border-color: rgba(236, 198, 59, 0.50);
  background: rgba(236, 198, 59, 0.12);
}

.selected-btn,
.new-btn {
  background: linear-gradient(90deg, #ecc63b, #3b91ec);
  color: #ffffff;
  transition: transform 0.3s ease,
              filter 0.3s ease,
              box-shadow 0.3s ease;
}
.selected-btn:hover,
.new-btn:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 10px 24px rgba(59, 145, 236, 0.30);
}

/* ========== 补漏：selected/new 右侧按钮区 ========== */
.selected-action-box,
.new-action-box {
  background: #fafbfc;
}

/* ========== 补漏：new-tag（新增页标签） ========== */
.new-tag.tag-project {
  color: #3b91ec;
  border-color: rgba(59, 145, 236, 0.45);
  background: rgba(59, 145, 236, 0.06);
}
.new-tag.tag-product {
  color: #b8972a;
  border-color: rgba(236, 198, 59, 0.55);
  background: rgba(236, 198, 59, 0.10);
}
.new-tag.tag-other {
  color: #6b7a99;
  border-color: rgba(107, 122, 153, 0.30);
  background: rgba(107, 122, 153, 0.06);
}
.new-tag-icon {
  background: rgba(59, 145, 236, 0.06);
}

/* ========== 补漏：new-date（新增页日期小框） ========== */
.new-date {
  color: #6b7a99;
  border-color: rgba(59, 145, 236, 0.15);
  background: rgba(59, 145, 236, 0.04);
}

/* ========== 补漏：selected/new 占位图/空状态 ========== */
.selected-title,
.new-title { color: #1a2a4a; }
.selected-desc,
.new-desc { color: #6b7a99; }
.selected-empty,
.new-empty { color: #8899b0; }

/* ========== 补漏：download.html 的 result-date ========== */
.result-date.upload {
  color: #3b91ec;
  border: 1px solid rgba(59, 145, 236, 0.35);
  background: rgba(59, 145, 236, 0.08);
}
.result-date.update {
  color: #b8972a;
  border: 1px solid rgba(236, 198, 59, 0.45);
  background: rgba(236, 198, 59, 0.10);
}

/* ========== 补漏：download.html 的 result-download 下载按钮 ========== */
.result-download {
  background: linear-gradient(90deg, #ecc63b, #3b91ec);
  color: #ffffff;
  transition: transform 0.3s ease,
              filter 0.3s ease,
              box-shadow 0.3s ease;
}
.result-download:hover {
  transform: translateY(-2px);
  filter: brightness(1.05);
  box-shadow: 0 8px 20px rgba(59, 145, 236, 0.30);
}
.result-download.disabled {
  background: rgba(26, 42, 74, 0.10);
  color: rgba(107, 122, 153, 0.50);
  box-shadow: none;
  transform: none;
  filter: none;
}

/* ========== 补漏：download.html 的 empty-hint ========== */
.empty-hint {
  color: #8899b0;
}