/*
 * 文件作用：
 *   lumavet 站商品分类页（product_category / product_tag / shop archive）
 *   的三栏布局样式 —— 左侧分类树 + 中间商品网格 + 右侧促销侧栏。
 *
 *   PHP 端 pmgr-site-frontend.php 的 pmgr_sf_archive_open/close hook
 *   会输出 .pmgr-archive-three-col 容器结构，本 CSS 负责样式渲染。
 *
 * 与 wc.css（iwamed/ipetmed）的差异：
 *   - 颜色：lumavet 紫色 #5f4175（wc.css 用红色 #C8102E）
 *   - 作用域：使用 body.theme-blocksy + .pmgr-archive-three-col 双重命名空间，
 *     避免污染 iwamed/ipetmed
 *   - nav 高度：lumavet 用 Blocksy 主题 nav，不一定有 --pmgr-nav-height
 *     变量，sticky top 用 80px 兜底
 *
 * 加载方式：
 *   pmgr_sf_lumavet_enqueue_blocksy_fixes() 在 lumavet 全前台加载
 *
 * 仅在 .pmgr-archive-three-col wrapper 存在时生效（PHP 端守门控制）。
 *
 * 2026-05-27 新增。
 */

/* ════════════════════════════════════════════════════════════════
   外层三栏容器
   ≥1280px → 三栏 240 / 1fr / 280
   1024-1279 → 两栏 220 / 1fr，右侧促销栏下移
   ≤1023px → 单列，左侧分类内部滚动 + 折叠，右侧促销在底部
   ══════════════════════════════════════════════════════════════ */

body.theme-blocksy .pmgr-archive-three-col {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr) 280px;
  gap: 28px;
  max-width: 1480px;
  margin: 24px auto 60px;
  padding: 0 24px;
  align-items: start;
  box-sizing: border-box;
}

/* 中列：min-width:0 防止内部 ul.products grid 把父级撑出页面 */
body.theme-blocksy .pmgr-archive-main {
  min-width: 0;
}

/* 中列内 reset ul.products：取消 Blocksy 默认居中限宽 */
body.theme-blocksy .pmgr-archive-main ul.products {
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

/* 中列内 result_count / catalog_ordering / pagination */
body.theme-blocksy .pmgr-archive-main .woocommerce-result-count,
body.theme-blocksy .pmgr-archive-main .woocommerce-ordering,
body.theme-blocksy .pmgr-archive-main .woocommerce-pagination {
  max-width: none !important;
}

/* ════════════════════════════════════════════════════════════════
   左侧：产品分类树
   ════════════════════════════════════════════════════════════════ */

body.theme-blocksy .pmgr-archive-left {
  background: #ffffff;
  border: 1px solid #e5e6ea;
  border-radius: 10px;
  padding: 16px 12px;
  position: sticky;
  top: 100px;
  max-height: calc(100dvh - 120px);
  overflow-y: auto;
  font-size: 13px;
  line-height: 1.5;
}

/* details / summary 桌面端去掉默认箭头 */
body.theme-blocksy .pmgr-cat-tree-collapsible {
  margin: 0;
}

body.theme-blocksy .pmgr-cat-tree-collapsible > summary.pmgr-cat-tree-title {
  list-style: none;
  cursor: default;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

body.theme-blocksy .pmgr-cat-tree-collapsible > summary::-webkit-details-marker {
  display: none;
}

/* 标题：14px 加粗 + 紫色下划线 */
body.theme-blocksy .pmgr-cat-tree-title {
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1d;
  margin: 0 0 12px;
  padding: 0 4px 10px;
  border-bottom: 2px solid #5f4175;
  letter-spacing: 0.5px;
}

body.theme-blocksy .pmgr-cat-tree {
  margin: 0;
}

body.theme-blocksy .pmgr-cat-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 子分类缩进 + 细线指示层级 */
body.theme-blocksy .pmgr-cat-list--child {
  margin: 2px 0 4px 10px;
  padding-left: 8px;
  border-left: 1px solid #eef0f3;
}

body.theme-blocksy .pmgr-cat-item {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* 分类链接行 */
body.theme-blocksy .pmgr-cat-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px;
  border-radius: 6px;
  color: #3a3a3f;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
  min-width: 0;
}

body.theme-blocksy .pmgr-cat-link:hover {
  background: rgba(95, 65, 117, 0.08);
  color: #5f4175;
}

body.theme-blocksy .pmgr-cat-name {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 500;
  line-height: 1.35;
  word-break: break-word;
}

body.theme-blocksy .pmgr-cat-count {
  flex: 0 0 auto;
  color: #9a9a9f;
  font-size: 11px;
  font-weight: 600;
  background: #f3f4f6;
  padding: 1px 7px;
  border-radius: 9px;
  line-height: 1.6;
}

/* 当前分类高亮：紫底白字 */
body.theme-blocksy .pmgr-cat-item.is-current > .pmgr-cat-link,
body.theme-blocksy .pmgr-cat-item.is-current > .pmgr-cat-details > .pmgr-cat-summary > .pmgr-cat-link {
  background: #5f4175 !important;
  color: #ffffff !important;
  font-weight: 600;
}

body.theme-blocksy .pmgr-cat-item.is-current > .pmgr-cat-link .pmgr-cat-count,
body.theme-blocksy .pmgr-cat-item.is-current > .pmgr-cat-details > .pmgr-cat-summary > .pmgr-cat-link .pmgr-cat-count {
  background: rgba(255, 255, 255, 0.22);
  color: #ffffff;
}

/* 祖先分类：紫字加粗（弱高亮） */
body.theme-blocksy .pmgr-cat-item.is-ancestor:not(.is-current) > .pmgr-cat-details > .pmgr-cat-summary > .pmgr-cat-link {
  color: #5f4175;
  font-weight: 600;
}

/* details/summary 美化 */
body.theme-blocksy .pmgr-cat-details {
  margin: 0;
}

body.theme-blocksy .pmgr-cat-summary {
  display: flex;
  align-items: center;
  list-style: none;
  cursor: pointer;
  position: relative;
  gap: 2px;
}

body.theme-blocksy .pmgr-cat-summary::-webkit-details-marker {
  display: none;
}

body.theme-blocksy .pmgr-cat-summary::marker {
  content: '';
  display: none;
}

body.theme-blocksy .pmgr-cat-summary > .pmgr-cat-link {
  flex: 1 1 auto;
  min-width: 0;
}

/* 折叠三角图标 */
body.theme-blocksy .pmgr-cat-toggle {
  flex: 0 0 auto;
  width: 16px;
  text-align: center;
  color: #b0b3b8;
  font-size: 10px;
  line-height: 1;
  transition: transform 0.2s, color 0.2s;
}

body.theme-blocksy .pmgr-cat-details[open] > .pmgr-cat-summary .pmgr-cat-toggle {
  transform: rotate(90deg);
  color: #5f4175;
}

/* ════════════════════════════════════════════════════════════════
   右侧：促销产品侧栏
   ════════════════════════════════════════════════════════════════ */

body.theme-blocksy .pmgr-archive-right {
  background: #ffffff;
  border: 1px solid #e5e6ea;
  border-radius: 10px;
  padding: 16px 14px;
  position: sticky;
  top: 100px;
  max-height: calc(100dvh - 120px);
  overflow-y: auto;
}

body.theme-blocksy .pmgr-sale-title {
  font-size: 14px;
  font-weight: 700;
  color: #1a1a1d;
  margin: 0 0 14px;
  padding: 0 4px 10px;
  border-bottom: 2px solid #5f4175;
  letter-spacing: 0.5px;
}

body.theme-blocksy .pmgr-sale-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

body.theme-blocksy .pmgr-sale-item {
  list-style: none;
  margin: 0;
  padding: 0;
}

body.theme-blocksy .pmgr-sale-link {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 10px;
  align-items: center;
  text-decoration: none;
  color: inherit;
  padding: 6px;
  border-radius: 6px;
  transition: background 0.15s;
}

body.theme-blocksy .pmgr-sale-link:hover {
  background: rgba(95, 65, 117, 0.06);
}

body.theme-blocksy .pmgr-sale-img {
  width: 56px !important;
  height: 56px !important;
  object-fit: contain !important;
  background: #fafafa;
  border-radius: 4px;
  display: block;
}

body.theme-blocksy .pmgr-sale-body {
  min-width: 0;
}

/* 名称 2 行截断 */
body.theme-blocksy .pmgr-sale-name {
  font-size: 12.5px;
  font-weight: 500;
  color: #1a1a1d;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 4px;
  word-break: break-word;
}

/* 促销价（紫色 + 删除线原价） */
body.theme-blocksy .pmgr-sale-price {
  font-size: 12px;
  line-height: 1.3;
}

body.theme-blocksy .pmgr-sale-price ins {
  text-decoration: none;
  color: #5f4175;
  font-weight: 700;
}

body.theme-blocksy .pmgr-sale-price del {
  color: #9a9a9f;
  margin-left: 6px;
  font-weight: 400;
}

/* 空状态 */
body.theme-blocksy .pmgr-sale-empty {
  font-size: 12px;
  color: #9a9a9f;
  text-align: center;
  padding: 20px 0;
  margin: 0;
}

/* ════════════════════════════════════════════════════════════════
   响应式
   ════════════════════════════════════════════════════════════════ */

/* 平板 1024-1279：两栏（左 + 中），右侧促销栏下移占满宽度 */
@media (max-width: 1279px) {
  body.theme-blocksy .pmgr-archive-three-col {
    grid-template-columns: 220px minmax(0, 1fr);
    grid-template-areas:
      "left main"
      "right right";
  }
  body.theme-blocksy .pmgr-archive-left  { grid-area: left; }
  body.theme-blocksy .pmgr-archive-main  { grid-area: main; }
  body.theme-blocksy .pmgr-archive-right {
    grid-area: right;
    position: static;
    max-height: none;
    margin-top: 24px;
  }
  body.theme-blocksy .pmgr-archive-right .pmgr-sale-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 10px;
  }
}

/* 手机 ≤1023：单列，左侧 max-height 280 内部滚动 + 折叠 */
@media (max-width: 1023px) {
  body.theme-blocksy .pmgr-archive-three-col {
    grid-template-columns: 1fr;
    grid-template-areas: "left" "main" "right";
    gap: 16px;
    padding: 0 16px;
  }
  body.theme-blocksy .pmgr-archive-left {
    position: static;
    max-height: 280px;
  }
  body.theme-blocksy .pmgr-archive-main ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 639px) {
  body.theme-blocksy .pmgr-archive-three-col {
    padding: 0 12px;
    margin: 16px auto 40px;
  }
  body.theme-blocksy .pmgr-archive-main ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
}

/* ════════════════════════════════════════════════════════════════
   与 pmgr-lumavet-frontend.php 单列 archive 规则冲突避让
   pmgr-lumavet-frontend.php 把 body.archive .entries 改为单列卡片
   (post archive)，但 WC archive 用 ul.products 不是 .entries，
   两套规则不冲突。这里额外加一个 override 保险：
   .pmgr-archive-three-col 内部的 ul.products 始终用本 CSS 的 grid，
   不被 pmgr-lumavet-frontend.php inline style 单列覆盖。
   ════════════════════════════════════════════════════════════════ */

body.theme-blocksy .pmgr-archive-three-col .entries {
  display: revert !important;
  grid-template-columns: revert !important;
}