/* ═══════════════════════════════════════════════════════════════════
   VAPAU 分类页 V2（品牌页 / 型号页）
   ───────────────────────────────────────────────────────────────────
   只在 body.vapau-v2-cat 下生效，而这个 class 只有在 preview 开关打开、
   且当前是商品分类归档页时才会加上。商品详情页、购物车、结账、后台
   都拿不到这些规则。
   ═══════════════════════════════════════════════════════════════════ */

body.vapau-v2-cat {
  --v2c-primary: #4B246B;
  --v2c-text:    #17131C;
  --v2c-muted:   #716B75;
  --v2c-border:  #E6E0E8;
  --v2c-surface: #FFFFFF;
  --v2c-bg:      #FAF8F4;
  --v2c-soft:    #F0EAF4;
}

/* ─────────── 预览提示条 ─────────── */
body.vapau-v2-cat .vapau-v2-previewflag {
  position: fixed; left: 10px; bottom: 10px; z-index: 9500;
  display: flex; align-items: center; gap: 8px;
  padding: 7px 12px; border-radius: 999px;
  background: rgba(23,19,28,.9); color: #fff;
  font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
body.vapau-v2-cat .vapau-v2-previewflag a { color: #C9A9E0; text-decoration: underline; }

/* ═════════════════ 移动端（<=767px）═════════════════ */
@media (max-width: 767px) {

  /* ── Compact 头部：原来 346px 的大 Hero 压掉 ── */
  body.vapau-v2-cat .page-title,
  body.vapau-v2-cat .woocommerce-products-header__title,
  body.vapau-v2-cat h1.entry-title {
    font-size: 23px !important;          /* 22-26px */
    line-height: 1.2 !important;
    margin: 0 0 4px !important;
  }
  /* 分类 banner / 描述图之类的大块视觉，在移动端收掉 */
  body.vapau-v2-cat .page-description img,
  body.vapau-v2-cat .term-description img,
  body.vapau-v2-cat .ct-media-container--term,
  body.vapau-v2-cat .pccat-banner,
  body.vapau-v2-cat [class*="category-banner"] { display: none !important; }
  body.vapau-v2-cat .page-description,
  body.vapau-v2-cat .term-description {
    font-size: 13px !important; line-height: 1.45 !important;
    margin: 0 0 8px !important; color: var(--v2c-muted) !important;
  }
  body.vapau-v2-cat .woocommerce-products-header,
  body.vapau-v2-cat .page-header {
    padding-top: 10px !important; padding-bottom: 8px !important;
    margin-bottom: 0 !important; min-height: 0 !important;
  }
  body.vapau-v2-cat .hero-section,
  body.vapau-v2-cat .ct-hero-section {
    padding-top: 12px !important; padding-bottom: 10px !important; min-height: 0 !important;
  }

  /* Breadcrumb：缩小 + 单行横向滚动，不换行占高 */
  body.vapau-v2-cat .woocommerce-breadcrumb,
  body.vapau-v2-cat .ct-breadcrumbs,
  body.vapau-v2-cat [class*="breadcrumb"] {
    font-size: 11.5px !important; line-height: 1.3 !important;
    margin: 0 0 6px !important; padding: 0 !important;
    white-space: nowrap; overflow-x: auto; overflow-y: hidden;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
  }
  body.vapau-v2-cat [class*="breadcrumb"]::-webkit-scrollbar { display: none; }

  /* ── 品牌页的型号滑轨 ── */
  body.vapau-v2-cat .vapau-v2-modelrail { margin: 4px 0 14px; }
  body.vapau-v2-cat .vapau-v2-modelrail__title {
    font-size: 13px; font-weight: 700; letter-spacing: .06em;
    text-transform: uppercase; color: var(--v2c-muted); margin: 0 0 8px;
  }
  body.vapau-v2-cat .vapau-v2-modelrail__track {
    display: flex; gap: 8px; overflow-x: auto; padding-bottom: 2px;
    -webkit-overflow-scrolling: touch; scrollbar-width: none;
    scroll-snap-type: x proximity;
  }
  body.vapau-v2-cat .vapau-v2-modelrail__track::-webkit-scrollbar { display: none; }
  body.vapau-v2-cat .vapau-v2-mini {
    flex: 0 0 110px;                     /* 卡宽 104-116px */
    display: flex; flex-direction: column;
    background: var(--v2c-surface); border: 1px solid var(--v2c-border);
    border-radius: 12px; padding-bottom: 9px; overflow: hidden;
    text-decoration: none; scroll-snap-align: start;
  }
  body.vapau-v2-cat .vapau-v2-mini:active { transform: scale(.97); }
  body.vapau-v2-cat .vapau-v2-mini__media {
    display: flex; align-items: center; justify-content: center;
    height: 80px;                        /* 图片区 72-88px */
    background: var(--v2c-bg); padding: 7px; margin-bottom: 7px;
  }
  body.vapau-v2-cat .vapau-v2-mini__media img {
    max-width: 100%; max-height: 100%; width: auto; object-fit: contain;
  }
  body.vapau-v2-cat .vapau-v2-mini__ph {
    display: flex; align-items: center; justify-content: center;
    width: 100%; height: 100%; background: var(--v2c-soft);
    color: var(--v2c-primary); font-size: 22px; font-weight: 700;
  }
  body.vapau-v2-cat .vapau-v2-mini__name {
    padding: 0 9px; font-size: 12.5px; font-weight: 700; line-height: 1.22;
    color: var(--v2c-text);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; min-height: 2.44em;   /* 名称最多两行，统一高度 */
  }
  body.vapau-v2-cat .vapau-v2-mini__meta,
  body.vapau-v2-cat .vapau-v2-mini__price { padding: 0 9px; }
  body.vapau-v2-cat .vapau-v2-mini__meta { font-size: 10.5px; color: var(--v2c-muted); margin-top: 2px; }
  body.vapau-v2-cat .vapau-v2-mini__price { font-size: 11px; font-weight: 700; color: var(--v2c-text); margin-top: 2px; }
  body.vapau-v2-cat .vapau-v2-mini__price .woocommerce-Price-amount { font-size: inherit; color: inherit; font-weight: inherit; }

  /* ══════════ 口味三列网格（本次核心）══════════ */
  body.vapau-v2-cat ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 !important; padding: 0 !important;
    list-style: none !important;
  }
  body.vapau-v2-cat ul.products::before,
  body.vapau-v2-cat ul.products::after { display: none !important; }

  body.vapau-v2-cat ul.products li.product {
    width: auto !important; max-width: none !important;
    margin: 0 !important; padding: 0 0 8px !important; float: none !important;
    display: flex !important; flex-direction: column;
    background: var(--v2c-surface);
    border: 1px solid var(--v2c-border); border-radius: 12px;
    overflow: hidden; position: relative;
  }
  body.vapau-v2-cat ul.products li.product:active { transform: scale(.98); }

  /* 图片放进接近正方形的 well，图片不许撑高卡片 */
  body.vapau-v2-cat ul.products li.product a img,
  body.vapau-v2-cat ul.products li.product img {
    width: 100% !important; height: 102px !important;   /* 102-112px */
    object-fit: contain !important;
    margin: 0 0 5px !important; padding: 6px !important;
    background: var(--v2c-bg); box-sizing: border-box;
    border-radius: 0 !important;
  }

  /* 型号小标签 */
  body.vapau-v2-cat .vapau-v2-mlabel {
    display: block; padding: 0 8px; margin-bottom: 1px;
    font-size: 10.5px; font-weight: 600; letter-spacing: .02em; line-height: 1.3;
    color: var(--v2c-muted);
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* 口味名：统一字号/行高/最小高度，避免卡片上下错位 */
  body.vapau-v2-cat ul.products li.product .woocommerce-loop-product__title,
  body.vapau-v2-cat ul.products li.product h2,
  body.vapau-v2-cat ul.products li.product h3 {
    padding: 0 8px !important; margin: 0 !important;
    font-size: 12.5px !important; line-height: 1.25 !important;
    font-weight: 600 !important; color: var(--v2c-text) !important;
    display: -webkit-box !important; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
    overflow: hidden; min-height: 2.4em;
  }

  body.vapau-v2-cat ul.products li.product .price {
    padding: 0 8px !important; margin: 4px 0 0 !important;
    font-size: 13.5px !important; font-weight: 700 !important;
    color: var(--v2c-text) !important; line-height: 1.2 !important;
  }
  body.vapau-v2-cat ul.products li.product .price .woocommerce-Price-amount {
    font-size: inherit !important; color: inherit !important; font-weight: inherit !important;
  }
  body.vapau-v2-cat ul.products li.product .price del { display: none; }

  /* 移动端三列卡里塞不下加购按钮，也不该塞——详情页有购买入口。
     整张卡是进详情页的点击区。 */
  body.vapau-v2-cat ul.products li.product .button,
  body.vapau-v2-cat ul.products li.product .add_to_cart_button,
  body.vapau-v2-cat ul.products li.product .ct-woo-card-actions,
  body.vapau-v2-cat ul.products li.product .product-categories,
  body.vapau-v2-cat ul.products li.product .posted_in,
  body.vapau-v2-cat ul.products li.product .woocommerce-product-details__short-description,
  body.vapau-v2-cat ul.products li.product .star-rating,
  body.vapau-v2-cat ul.products li.product .woocommerce-product-rating,
  /* ⚠️ Blocksy 会在卡片底部输出一整块分类列表（DISPOSABLE VAPES / ALIBARBAR /
     INGOT 9000），实测 79px 高——正是把卡片从 190 撑到 310 的元凶。
     三列小卡里这些重复的分类路径没有价值，收掉。 */
  body.vapau-v2-cat ul.products li.product .entry-meta,
  body.vapau-v2-cat ul.products li.product .meta-categories,
  body.vapau-v2-cat ul.products li.product [class*="meta-categories"] { display: none !important; }

  /* 旧的「SHOP BY MODEL」区块（mu-plugin 40-modelgrid.php 输出的 .pcmodels，
     实测 703px 高）与本页新的紧凑滑轨重复。**只在预览模式下**用 CSS 收起来，
     不去改那个 mu-plugin —— 关掉预览它就照常显示。 */
  body.vapau-v2-cat .pcmodels { display: none !important; }

  /* 整卡可点：Blocksy 的商品链接只包住标题，用伪元素把点击区铺满整张卡 */
  body.vapau-v2-cat ul.products li.product > a.woocommerce-LoopProduct-link::after,
  body.vapau-v2-cat ul.products li.product a.woocommerce-loop-product__link::after {
    content: ''; position: absolute; inset: 0; z-index: 2;
  }

  /* 整卡可点：把商品链接铺满卡片 */
  body.vapau-v2-cat ul.products li.product > a.woocommerce-LoopProduct-link {
    display: flex !important; flex-direction: column; flex: 1 1 auto;
    text-decoration: none !important;
  }

  /* 排序栏压缩 */
  body.vapau-v2-cat .woocommerce-ordering,
  body.vapau-v2-cat .woocommerce-result-count {
    font-size: 12px !important; margin: 0 0 8px !important;
  }
  body.vapau-v2-cat .woocommerce-ordering select {
    font-size: 12.5px !important; padding: 6px 26px 6px 10px !important; height: 36px !important;
  }
  body.vapau-v2-cat .woocommerce-result-count { color: var(--v2c-muted) !important; }

  /* 页面左右留白 12px */
  body.vapau-v2-cat .ct-container,
  body.vapau-v2-cat .ct-container-full {
    padding-left: 12px !important; padding-right: 12px !important;
  }
}

/* 320-340px 特别窄的设备降为 2 列，保证文字还能读 */
@media (max-width: 344px) {
  body.vapau-v2-cat ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
  body.vapau-v2-cat ul.products li.product a img,
  body.vapau-v2-cat ul.products li.product img { height: 118px !important; }
}

/* ═════════ 平板 768-1023：3 列，卡片放大 ═════════ */
@media (min-width: 768px) and (max-width: 1023px) {
  body.vapau-v2-cat ul.products {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 14px !important; margin: 0 !important; padding: 0 !important;
  }
  body.vapau-v2-cat ul.products li.product {
    width: auto !important; margin: 0 !important; float: none !important;
  }
  body.vapau-v2-cat ul.products li.product img { height: 180px !important; object-fit: contain !important; }
  body.vapau-v2-cat .vapau-v2-mini { flex-basis: 140px; }
  body.vapau-v2-cat .vapau-v2-mini__media { height: 104px; }
}

/* ═════════ 桌面 >=1024：保持 4 列，不缩小 ═════════ */
@media (min-width: 1024px) {
  body.vapau-v2-cat ul.products {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 20px !important; margin: 0 !important; padding: 0 !important;
  }
  body.vapau-v2-cat ul.products li.product {
    width: auto !important; max-width: none !important; margin: 0 !important; float: none !important;
  }
  /* 桌面端分类头部控制在 240-300px，不做移动端那种极限压缩 */
  body.vapau-v2-cat .woocommerce-products-header,
  body.vapau-v2-cat .page-header { padding-top: 28px !important; padding-bottom: 20px !important; }

  /* 型号滑轨在桌面排成一行卡片 */
  body.vapau-v2-cat .vapau-v2-modelrail { margin: 8px 0 28px; }
  body.vapau-v2-cat .vapau-v2-modelrail__title { font-size: 14px; color: var(--v2c-muted); margin-bottom: 12px; }
  body.vapau-v2-cat .vapau-v2-modelrail__track { display: flex; gap: 16px; flex-wrap: wrap; }
  body.vapau-v2-cat .vapau-v2-mini {
    flex: 0 0 180px; display: flex; flex-direction: column;
    background: #fff; border: 1px solid var(--v2c-border); border-radius: 14px;
    padding-bottom: 12px; overflow: hidden; text-decoration: none;
    transition: border-color .18s, transform .18s;
  }
  body.vapau-v2-cat .vapau-v2-mini:hover { border-color: var(--v2c-primary); transform: translateY(-2px); }
  body.vapau-v2-cat .vapau-v2-mini__media {
    display: flex; align-items: center; justify-content: center;
    height: 130px; background: var(--v2c-bg); padding: 12px; margin-bottom: 10px;
  }
  body.vapau-v2-cat .vapau-v2-mini__media img { max-width: 100%; max-height: 100%; object-fit: contain; }
  body.vapau-v2-cat .vapau-v2-mini__name { padding: 0 12px; font-size: 15px; font-weight: 700; color: var(--v2c-text); }
  body.vapau-v2-cat .vapau-v2-mini__meta { padding: 0 12px; font-size: 12.5px; color: var(--v2c-muted); margin-top: 3px; }
  body.vapau-v2-cat .vapau-v2-mini__price { padding: 0 12px; font-size: 13.5px; font-weight: 700; margin-top: 4px; }
  body.vapau-v2-cat .vapau-v2-mlabel {
    display: block; padding: 0 4px; font-size: 12px; color: var(--v2c-muted); margin-bottom: 3px;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.vapau-v2-cat ul.products li.product:active,
  body.vapau-v2-cat .vapau-v2-mini:active,
  body.vapau-v2-cat .vapau-v2-mini:hover { transform: none; }
}