/* =====================================================================
   BLOG ARCHIVE — 修复 Blocksy 书店模板自带的深色卡片样式
   将 blog 列表页恢复为干净的白色背景卡片布局
   Target: /blog/ page, category pages, tag pages, author pages
   ===================================================================== */

/* ── 1. 文章卡片：移除深色 overlay，白色背景 ── */
.entries[data-layout] article.entry-card,
.entries article.entry-card {
  background: #fff !important;
  border-radius: 0 !important;
  overflow: hidden;
}

/* ── 2. 移除图片上的深色渐变遮罩 ── */
.entries article.entry-card .ct-media-container::after,
.entries article.entry-card .ct-media-container::before,
.entries article.entry-card a.ct-image-container::after,
.entries article.entry-card a.ct-image-container::before {
  display: none !important;
  content: none !important;
}

/* 图片上覆盖的渐变层 */
.entries article.entry-card .ct-image-container > .ct-gradient,
.entries article.entry-card [class*="gradient"],
.entries article.entry-card .ct-media-container > div[style*="gradient"] {
  display: none !important;
}

/* ── 3. 文字区域：正常显示在图片下方，不叠在图片上 ── */
.entries article.entry-card .entry-card-content,
.entries article.entry-card .card-content {
  position: relative !important;
  background: #fff !important;
  color: #111 !important;
  padding: 20px 0 !important;
  z-index: auto !important;
}

/* ── 4. 标题样式 ── */
.entries article.entry-card .entry-title,
.entries article.entry-card .entry-title a {
  color: #111 !important;
  font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  line-height: 1.2;
}

/* ── 5. 分类标签 ── */
.entries article.entry-card .entry-meta,
.entries article.entry-card .entry-category {
  color: #757575 !important;
}
.entries article.entry-card .entry-meta a,
.entries article.entry-card .entry-category a {
  color: #757575 !important;
}

/* ── 6. 摘要文字 ── */
.entries article.entry-card .entry-excerpt,
.entries article.entry-card .entry-content p {
  color: #555 !important;
  font-size: 14px;
  line-height: 1.7;
}

/* ── 7. 作者和日期 ── */
.entries article.entry-card .entry-meta-bar,
.entries article.entry-card .post-meta {
  color: #9e9e9e !important;
}
.entries article.entry-card .entry-meta-bar a,
.entries article.entry-card .post-meta a {
  color: #9e9e9e !important;
}

/* ── 8. Blocksy "simple" 或 "cover" 卡片类型的特殊修复 ── */
/* Blocksy cover 类型：文字叠在图片上，需要改为正常布局 */
.entries[data-layout="grid"] article.entry-card,
.entries[data-layout="listing"] article.entry-card {
  display: flex !important;
  flex-direction: column !important;
}

.entries[data-layout="grid"] article.entry-card .ct-image-container,
.entries[data-layout="listing"] article.entry-card .ct-image-container {
  position: relative !important;
  flex-shrink: 0;
}

.entries[data-layout="grid"] article.entry-card .entry-card-content,
.entries[data-layout="listing"] article.entry-card .card-content {
  position: relative !important;
  inset: auto !important;
  transform: none !important;
}

/* ── 9. 右侧 Sidebar 产品列表修复 ── */
/* 侧边栏 WooCommerce 产品 widget */
.ct-sidebar .widget_products ul,
.ct-sidebar .woocommerce ul.products {
  display: flex !important;
  flex-direction: column !important;
  gap: 16px !important;
}

.ct-sidebar .widget_products ul li,
.ct-sidebar .woocommerce ul.products li {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 0 !important;
  width: 100% !important;
  float: none !important;
}

.ct-sidebar .widget_products ul li img,
.ct-sidebar .woocommerce ul.products li img {
  width: 60px !important;
  height: 60px !important;
  object-fit: cover !important;
  flex-shrink: 0 !important;
  aspect-ratio: auto !important;
}

/* ── 10. 侧边栏标题 ── */
.ct-sidebar .widget-title,
.ct-sidebar h2 {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 16px;
  font-weight: 700;
  text-transform: uppercase;
  color: #111;
  margin-bottom: 16px;
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 768px) {
  .entries article.entry-card .entry-card-content,
  .entries article.entry-card .card-content {
    padding: 16px 0 !important;
  }

  .entries article.entry-card .entry-title {
    font-size: 18px !important;
  }
}
