/**
 * KeXinMaterials — Shop / Product redesign (issues 0-9)
 * Loaded AFTER woocommerce-improved.css so these rules win.
 */

/* ============================================================
   Issue 1 — readable, solid header on shop/product pages
   + hide the stray WooCommerce breadcrumb ("首页 / Shop")
   + push content below the fixed header
   ============================================================ */
.woocommerce .header {
  background-color: rgba(13, 13, 13, 0.97);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.3);
}
.post-type-archive-product .woocommerce-breadcrumb,
.tax-product_cat .woocommerce-breadcrumb {
  display: none !important;
}
body.woocommerce {
  padding-top: var(--header-height);
}

/* ============================================================
   Issue 3 — left sidebar (results count + sort/filter)
   ============================================================ */
.shop-layout {
  display: grid;
  grid-template-columns: 260px 1fr;
  gap: var(--space-8);
  align-items: start;
  margin-bottom: var(--space-10);
}
.shop-sidebar {
  position: sticky;
  top: calc(var(--header-height) + var(--space-4));
}
.shop-sidebar__block {
  background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  box-shadow: var(--shadow-sm);
}
.shop-sidebar__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-dark);
  margin: 0 0 var(--space-3);
  padding-bottom: var(--space-2);
  border-bottom: 2px solid var(--color-accent);
  display: inline-block;
}
.shop-sidebar .woocommerce-result-count {
  margin: 0 0 var(--space-4);
  color: var(--color-gray-500);
  font-size: 0.875rem;
}
.shop-sidebar .woocommerce-ordering {
  margin: 0;
  width: 100%;
}
.shop-sidebar .woocommerce-ordering select {
  width: 100%;
  background: #fff;
  color: var(--color-dark);
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--radius-md);
  padding: 10px 12px;
  font-size: 0.9rem;
  cursor: pointer;
}
@media (max-width: 900px) {
  .shop-layout { grid-template-columns: 1fr; }
  .shop-sidebar { position: static; margin-bottom: var(--space-6); }
}

/* ============================================================
   Issue 2 — category tabs: visible arrows (z-index above the
   edge fades) + hover-scroll affordance
   ============================================================ */
.series-nav__btn {
  z-index: 3;
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}
.series-nav__btn:hover {
  background: #e03618;
  border-color: #e03618;
}
/* edge fades must sit BEHIND the arrow buttons */
.series-nav .container::before,
.series-nav .container::after { z-index: 1; }
.series-nav__track { position: relative; z-index: 1; }
.series-nav__item { position: relative; z-index: 1; }

/* ============================================================
   Issue 4 — redesigned pagination (light cards + accent)
   + "jump to page" input
   ============================================================ */
.woocommerce nav.woocommerce-pagination {
  margin-top: var(--space-10);
  text-align: center;
}
.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex;
  gap: 8px;
  list-style: none;
  padding: 0;
  border: none;
  flex-wrap: wrap;
  justify-content: center;
}
.woocommerce nav.woocommerce-pagination li { border: none; }
.woocommerce nav.woocommerce-pagination a,
.woocommerce nav.woocommerce-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 14px;
  background: #fff;
  color: var(--color-dark);
  border: 1px solid rgba(0, 0, 0, 0.12);
  border-radius: var(--radius-md);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 600;
  transition: all var(--transition-fast);
}
.woocommerce nav.woocommerce-pagination a:hover {
  border-color: var(--color-accent);
  color: var(--color-accent);
}
.woocommerce nav.woocommerce-pagination li span.current,
.woocommerce nav.woocommerce-pagination a.current {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: #fff;
}
.shop-pagenav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: var(--space-6);
  flex-wrap: wrap;
  font-size: 0.9rem;
  color: var(--color-gray-500);
}
.shop-pagenav__input {
  width: 72px;
  height: 42px;
  text-align: center;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--radius-md);
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--color-dark);
}
.shop-pagenav__btn {
  height: 42px;
  padding: 0 22px;
  background: var(--color-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  font-weight: 700;
  cursor: pointer;
  transition: background var(--transition-fast);
}
.shop-pagenav__btn:hover { background: #e03618; }

/* ============================================================
   Issue 6 — product gallery: hover-zoom + swipeable thumbs
   ============================================================ */
.psp-gallery__stage {
  position: relative;
  cursor: zoom-in;
  overflow: hidden;
}
.psp-gallery__img {
  transition: transform var(--transition-fast);
  will-change: transform;
}
.psp-gallery__stage.is-zooming { cursor: crosshair; }
.psp-gallery__hint {
  position: absolute;
  right: 12px;
  bottom: 12px;
  background: rgba(0, 0, 0, 0.55);
  color: #fff;
  font-size: 0.75rem;
  padding: 4px 10px;
  border-radius: var(--radius-full);
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--transition-fast);
}
.psp-gallery__stage:hover .psp-gallery__hint { opacity: 1; }
.psp-gallery__thumbs-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: var(--space-3);
}
.psp-gallery__thumbs {
  display: flex;
  gap: 8px;
  overflow-x: auto;
  scroll-behavior: smooth;
  flex: 1 1 auto;
  padding: 4px 0;
  scrollbar-width: none;
}
.psp-gallery__thumbs::-webkit-scrollbar { display: none; }
.psp-gallery__thumb {
  flex: 0 0 auto;
  width: 72px;
  height: 72px;
  padding: 0;
  border: 2px solid transparent;
  border-radius: var(--radius-md);
  overflow: hidden;
  background: var(--color-gray-100);
  cursor: pointer;
  transition: border-color var(--transition-fast);
}
.psp-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.psp-gallery__thumb.is-active { border-color: var(--color-accent); }
.psp-gallery__thumb-btn {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
  background: #fff;
  color: var(--color-dark);
  font-size: 18px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-fast);
}
.psp-gallery__thumb-btn:hover {
  background: var(--color-accent);
  color: #fff;
  border-color: var(--color-accent);
}

/* ============================================================
   Issue 7 — quantity stepper with always-visible +/- arrows
   ============================================================ */
.psp__cart .quantity { display: inline-flex; align-items: center; }
.qty-stepper {
  display: inline-flex;
  align-items: center;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--radius-md);
  overflow: hidden;
}
.qty-stepper__btn {
  width: 44px;
  height: 50px;
  border: none;
  background: var(--color-gray-100);
  color: var(--color-dark);
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background var(--transition-fast);
}
.qty-stepper__btn:hover { background: var(--color-accent); color: #fff; }
.qty-stepper input.qty {
  width: 56px;
  height: 50px;
  border: none;
  border-left: 1px solid rgba(0, 0, 0, 0.12);
  border-right: 1px solid rgba(0, 0, 0, 0.12);
  text-align: center;
  font-family: 'Courier New', monospace;
  font-size: 1.125rem;
  font-weight: 600;
  -moz-appearance: textfield;
}
.qty-stepper input.qty::-webkit-outer-spin-button,
.qty-stepper input.qty::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* ============================================================
   Issue 8 — "View Cart" button next to Email Inquiry
   ============================================================ */
.psp__action--cart {
  border-color: var(--color-accent);
  color: var(--color-accent);
}
.psp__action--cart:hover {
  background: var(--color-accent);
  color: #fff;
}

/* ============================================================
   Issue 9 — reviews: clear borders so users see where to write
   ============================================================ */
.psp .woocommerce-Reviews { margin-top: var(--space-6); }
.psp .woocommerce-Reviews .commentlist {
  list-style: none;
  padding: 0;
  margin: 0 0 var(--space-6);
}
.psp .woocommerce-Reviews .commentlist li.review,
.psp .woocommerce-Reviews .commentlist li.comment {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: var(--radius-lg);
  padding: var(--space-5);
  margin-bottom: var(--space-4);
  background: #fff;
}
.psp .woocommerce-Reviews .comment-text {
  border: none;
  border-radius: 0;
  padding: 0;
}
.psp .comment-respond,
.psp #review_form_wrapper {
  border: 1px solid rgba(0, 0, 0, 0.1);
  border-radius: var(--radius-lg);
  padding: var(--space-6);
  background: #fff;
  margin-top: var(--space-6);
}
.psp .comment-form label {
  display: block;
  font-weight: 600;
  color: var(--color-dark);
  margin-bottom: 6px;
  font-size: 0.9rem;
}
.psp .comment-form input[type="text"],
.psp .comment-form input[type="email"],
.psp .comment-form textarea {
  width: 100%;
  padding: 12px 14px;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--radius-md);
  font-size: 0.95rem;
  color: var(--color-dark);
  font-family: var(--font-body, inherit);
}
.psp .comment-form input:focus,
.psp .comment-form textarea:focus {
  outline: none;
  border-color: var(--color-accent);
}
.psp .comment-form .stars a { color: var(--color-accent); }
.psp .comment-form .submit {
  background: var(--color-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  padding: 12px 28px;
  font-weight: 700;
  cursor: pointer;
}
.psp .comment-form .submit:hover { background: #e03618; }

/* ============================================================
   Issue 5 — 详情页"相关推荐 / 热门推荐"版块重设计（v3 · 浅色高端·品牌橙红·自适应）
   线上结构：.psp__section > .psp__sec-head(.psp__related-title + .psp__sec-more)
             + section.related.products > .product-grid.product-grid--cards > .pcard
   v3 调整：浅色高端（非暗色）、品牌橙红 #fc3f1e 点缀、4:5 图片、
            自适应网格 4->3->2 列、卡片悬浮上浮+图片放大+入场动画。
   ============================================================ */
/* ===== 版块容器：浅色科技感背景 + 细微纹理 ===== */
.psp__section {
  position: relative;
  margin-top: 64px;
  padding: 44px 0 8px;
}
.psp__section::before {
  /* 极淡的科技感渐变底纹 */
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(1200px 300px at 80% -10%, rgba(252,63,30,0.05), transparent 60%),
    linear-gradient(180deg, #fbfbfc 0%, #f4f5f7 100%);
  z-index: 0;
  pointer-events: none;
}
.psp__section > * { position: relative; z-index: 1; }

/* ===== 标题行：精炼大气 + 动态强调 ===== */
.psp__sec-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-bottom: 30px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(20,24,35,0.07);
}
.psp__related-title {
  position: relative;
  margin: 0;
  padding-left: 18px;
  font-size: 26px;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: #15181f;
  line-height: 1.1;
}
.psp__related-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 6px;
  height: 26px;
  border-radius: 4px;
  background: linear-gradient(180deg, #fc3f1e, #ff8a5c);
  box-shadow: 0 2px 10px rgba(252,63,30,0.35);
}
.psp__sec-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  font-weight: 600;
  color: #fc3f1e;
  text-decoration: none;
  padding: 8px 16px;
  border: 1.5px solid rgba(252,63,30,0.28);
  border-radius: 999px;
  transition: all .25s ease;
  white-space: nowrap;
}
.psp__sec-more:hover {
  background: linear-gradient(135deg, #fc3f1e, #ff6b4a);
  color: #fff;
  border-color: transparent;
  gap: 10px;
  box-shadow: 0 6px 18px rgba(252,63,30,0.3);
}

/* ===== 自适应网格：4 -> 3 -> 2 -> 1 ===== */
/* 关键修复：外层 section.related.products 被主题设成 display:grid(4×290px)，
   导致内层 .product-grid--cards 被塞进单个290px格子而挤成竖条。
   这里强制外层为 block，让内层网格撑满整行宽度。 */
.psp .related.products,
.psp section.related.products {
  display: block !important;
  grid-template-columns: none !important;
  margin: 0 !important;
  width: 100% !important;
}
.psp .product-grid--cards {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 22px !important;
  list-style: none;
  margin: 0;
  padding: 0;
  align-items: stretch;
}
@media (max-width: 1200px) {
  .psp .product-grid--cards { grid-template-columns: repeat(3, minmax(0,1fr)) !important; gap: 18px !important; }
}
@media (max-width: 880px) {
  .psp .product-grid--cards { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 16px !important; }
}
@media (max-width: 520px) {
  .psp .product-grid--cards { grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap: 12px !important; }
}

/* ===== 卡片：白底 + 细腻阴影 + 悬浮动效 ===== */
.psp .product-grid--cards .pcard {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  height: 100% !important;
  background: #fff !important;
  border: 1px solid #ececef !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 2px 10px rgba(20,24,35,0.05) !important;
  transition: transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s ease, border-color .35s ease !important;
  animation: cardIn .5s ease both;
}
.psp .product-grid--cards .pcard:hover {
  transform: translateY(-8px) !important;
  box-shadow: 0 22px 44px rgba(20,24,35,0.13) !important;
  border-color: rgba(252,63,30,0.35) !important;
}
@keyframes cardIn {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
.psp .product-grid--cards .pcard:nth-child(1){animation-delay:.04s}
.psp .product-grid--cards .pcard:nth-child(2){animation-delay:.10s}
.psp .product-grid--cards .pcard:nth-child(3){animation-delay:.16s}
.psp .product-grid--cards .pcard:nth-child(4){animation-delay:.22s}

/* ===== 图片区：4:5 产品比例 + 悬浮放大 ===== */
.psp .product-grid--cards .pcard__media {
  position: relative !important;
  aspect-ratio: 4 / 5 !important;
  background: linear-gradient(135deg, #f3f4f6, #e9ebef) !important;
  overflow: hidden !important;
}
.psp .product-grid--cards .pcard__img,
.psp .product-grid--cards .pcard__img--hover {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .6s cubic-bezier(.2,.7,.3,1), opacity .3s ease;
}
.psp .product-grid--cards .pcard:hover .pcard__img,
.psp .product-grid--cards .pcard:hover .pcard__img--hover {
  transform: scale(1.07);
}
.psp .product-grid--cards .pcard__img--hover { opacity: 0; }
.psp .product-grid--cards .pcard:hover .pcard__img--hover { opacity: 1; }
/* 底部渐变，提升文字可读性 */
.psp .product-grid--cards .pcard__media::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: 0;
  height: 70px;
  background: linear-gradient(transparent, rgba(10,12,20,0.28));
  pointer-events: none;
  z-index: 1;
}
.psp .product-grid--cards .pcard__badge {
  position: absolute;
  top: 12px; left: 12px;
  z-index: 3;
  padding: 4px 11px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .03em;
  color: #fff;
  background: rgba(15,18,28,0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border-radius: 999px;
}
.psp .product-grid--cards .pcard__link { z-index: 2; }

/* ===== 文字区 ===== */
.psp .product-grid--cards .pcard__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  padding: 16px 16px 18px;
  gap: 6px;
}
.psp .product-grid--cards .pcard__cat {
  font-size: 11px;
  font-weight: 700;
  color: #fc3f1e;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin: 0;
}
.psp .product-grid--cards .pcard__model {
  font-size: 12px;
  color: #9aa0a8;
  margin: 0;
}
.psp .product-grid--cards .pcard__title {
  margin: 2px 0 0;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.35;
}
.psp .product-grid--cards .pcard__title a {
  color: #1b1f27;
  text-decoration: none;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.psp .product-grid--cards .pcard__title a:hover { color: #fc3f1e; }
.psp .product-grid--cards .pcard__desc {
  font-size: 12.5px;
  color: #868c95;
  margin: 0;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.psp .product-grid--cards .pcard__price {
  font-size: 18px;
  font-weight: 800;
  color: #fc3f1e;
  margin-top: 6px;
  letter-spacing: -0.01em;
}
.psp .product-grid--cards .pcard__footer { margin-top: auto; padding: 0; }
.psp .product-grid--cards .pcard__btn {
  display: block;
  width: 100%;
  text-align: center;
  padding: 11px 0;
  background: linear-gradient(135deg, #fc3f1e, #ff6b4a);
  color: #fff;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
  transition: all .25s ease;
  cursor: pointer;
}
.psp .product-grid--cards .pcard__btn:hover {
  box-shadow: 0 8px 20px rgba(252,63,30,0.35);
  transform: translateY(-1px);
}
/* ============================================================
   Product Center rework (2026-07-14)
   Issue 1 — full-width, JD-like layout (no more narrow,
             right-shifted 1280px block under the hero)
   Issue 2 — mobile: hide category tabs behind a toggle button
             (tap to reveal, swipe to browse) so the sticky bar
             no longer covers the product cards
   ============================================================ */

/* ---- Issue 1: span nearly the full viewport ---- */
.shop-layout.container {
  max-width: 1760px;            /* wider than theme default 1280px */
}
/* let the product grid fill the now-wide main column */
.shop-main .product-grid {
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
}

/* ---- Issue 2: make the tab bar a proper horizontal row on desktop ---- */
.series-nav {
  display: flex;
  align-items: center;
  gap: var(--space-2);
}

/* ---- Mobile toggle button (hidden on desktop) ---- */
.series-nav__toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 12px 16px;
  background: var(--color-accent);
  color: #fff;
  border: none;
  border-radius: var(--radius-md);
  font-size: 0.95rem;
  font-weight: 700;
  cursor: pointer;
  transition: background var(--transition-fast);
}
.series-nav__toggle:hover { background: #e03618; }
.series-nav__toggle-icon { font-size: 1.1rem; line-height: 1; }

/* Stop the sticky bar from covering cards on tablets/phones */
@media (max-width: 1024px) {
  .series-nav { position: static; }
}

@media (max-width: 768px) {
  .series-nav {
    flex-wrap: wrap;
    gap: var(--space-2);
    background: transparent;
    border-bottom: none;
    padding: 0;
    margin-bottom: var(--space-5);
  }
  .series-nav__toggle { display: flex; }
  /* hide tabs + arrows until the user taps the toggle */
  .series-nav .series-nav__track { display: none; }
  .series-nav.is-open .series-nav__track {
    display: flex;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    margin-top: var(--space-2);
    padding: 10px 0;
    background-color: rgba(13, 13, 13, 0.97);
    border-radius: var(--radius-md);
  }
  .series-nav.is-open .series-nav__track::-webkit-scrollbar { display: none; }
  .series-nav__btn { display: none !important; }   /* swipe instead of arrows */
}

/* ============================================================
   Pelican-style — shop toolbar (result count + sort)
   ============================================================ */
.shop-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4) 0;
  margin-bottom: var(--space-5);
  border-bottom: 1px solid var(--color-border, #ececec);
}
.shop-toolbar__count { font-size: 14px; color: var(--color-text-secondary, #666); font-weight: 500; }
.shop-toolbar__count .woocommerce-result-count { margin: 0; }
.shop-toolbar__sort { display: flex; align-items: center; }
.shop-toolbar__sort .woocommerce-ordering { margin: 0; }
.shop-toolbar__sort select {
  appearance: none; -webkit-appearance: none;
  border: 1px solid var(--color-border, #ddd);
  border-radius: var(--radius-md, 8px);
  padding: 9px 32px 9px 12px;
  font-size: 13px; color: #222; background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23999' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
  cursor: pointer;
}
.shop-toolbar__sort select:focus { outline: none; border-color: var(--color-accent, #fc3f1e); }

/* ============================================================
   Pelican-style — collapsible faceted filter sidebar
   ============================================================ */
.filter-panel {
  margin-bottom: var(--space-4);
  border: 1px solid var(--color-border, #ececec);
  border-radius: var(--radius-md, 8px);
  background: #fff;
  overflow: hidden;
}
.filter-panel__head {
  width: 100%;
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px;
  background: #fafafa;
  border: none; cursor: pointer;
  font-size: 14px; font-weight: 600; color: #222; text-align: left;
}
.filter-panel__caret { color: #999; transition: transform .2s ease; }
.filter-panel:not(.is-open) .filter-panel__caret { transform: rotate(-90deg); }
.filter-panel__body {
  display: flex; flex-direction: column; gap: 2px;
  padding: 8px 14px 14px;
}
.filter-panel:not(.is-open) .filter-panel__body { display: none; }
.filter-link {
  display: block; padding: 7px 10px;
  border-radius: 6px; font-size: 13px; color: #444;
  text-decoration: none; transition: background .15s, color .15s;
}
.filter-link:hover { background: #f4f4f5; color: var(--color-accent, #fc3f1e); }
.filter-link.is-active { background: var(--color-accent, #fc3f1e); color: #fff; font-weight: 500; }

.filter-applied { margin-top: var(--space-4); padding-top: var(--space-4); border-top: 1px dashed #e2e2e2; }
.filter-applied__title { display: block; font-size: 12px; color: #999; margin-bottom: 8px; }
.filter-chip {
  display: inline-flex; align-items: center; gap: 6px;
  margin: 0 6px 6px 0; padding: 5px 10px;
  border-radius: 999px; background: #f4f4f5; color: #333; font-size: 12px; text-decoration: none;
}
.filter-chip__x { color: var(--color-accent, #fc3f1e); font-weight: 700; }
.filter-clear { display: inline-block; margin-top: 2px; font-size: 12px; color: var(--color-accent, #fc3f1e); text-decoration: none; font-weight: 500; }
.filter-clear:hover { text-decoration: underline; }

/* ============================================================
   Pelican-style — product card: hover image swap + CTA button
   ============================================================ */
.pcard__media { position: relative; overflow: hidden; }
.pcard__img { display: block; width: 100%; height: 100%; object-fit: cover; transition: opacity .3s ease, transform .5s ease; }
.pcard__img--hover { position: absolute; inset: 0; opacity: 0; }
.pcard:hover .pcard__img { opacity: 0; }
.pcard:hover .pcard__img--hover { opacity: 1; transform: scale(1.05); }
.pcard__footer { padding: 12px 14px 16px; }
.pcard__btn {
  display: block; width: 100%; text-align: center;
  padding: 10px 0; background: var(--color-accent, #fc3f1e); color: #fff;
  border-radius: var(--radius-md, 8px); font-size: 13px; font-weight: 500;
  text-decoration: none; transition: background .15s, transform .1s;
}
.pcard__btn:hover { background: #e23617; }
.pcard__btn:active { transform: translateY(1px); }

/* ============================================================
   Pelican-style — detail tabs (overview / specs / docs / reviews)
   ============================================================ */
.psp .woocommerce-tabs { margin: 0; }
.psp .woocommerce-tabs .wc-tabs {
  display: flex; flex-wrap: wrap; gap: 2px;
  list-style: none; margin: 0 0 var(--space-5); padding: 0;
  border-bottom: 1px solid #ececec;
}
.psp .woocommerce-tabs .wc-tabs li { margin: 0; padding: 0; border: none; background: none; }
.psp .woocommerce-tabs .wc-tabs li a {
  display: block; padding: 12px 18px; font-size: 14px; color: #555;
  text-decoration: none; border-bottom: 2px solid transparent; font-weight: 500;
}
.psp .woocommerce-tabs .wc-tabs li.active a,
.psp .woocommerce-tabs .wc-tabs li:hover a {
  color: var(--color-accent, #fc3f1e); border-bottom-color: var(--color-accent, #fc3f1e);
}
.psp .woocommerce-tabs .woocommerce-Tabs-panel {
  background: #fff; border: 1px solid #ececec; border-radius: var(--radius-lg, 12px);
  padding: var(--space-6); margin-bottom: var(--space-6);
}
.psp .woocommerce-tabs .woocommerce-Tabs-panel h2 { font-size: 18px; margin-top: 0; }
.psp-docs { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.psp-docs a {
  display: inline-flex; align-items: center; gap: 8px;
  color: var(--color-accent, #fc3f1e); text-decoration: none; font-weight: 500;
}
.psp-docs a:hover { text-decoration: underline; }

/* Variation configurator (color / configuration / latch) */
.psp__cart table.variations { width: 100%; border-collapse: collapse; margin-bottom: var(--space-4); }
.psp__cart table.variations th,
.psp__cart table.variations td { padding: 8px 0; text-align: left; vertical-align: middle; }
.psp__cart table.variations th.label { width: 96px; font-size: 13px; color: #555; font-weight: 500; padding-right: 12px; }
.psp__cart table.variations td.value select {
  width: 100%; max-width: 280px;
  appearance: none; -webkit-appearance: none;
  border: 1px solid #ddd; border-radius: var(--radius-md, 8px);
  padding: 9px 32px 9px 12px; font-size: 14px; color: #222; background-color: #fff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%23999' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
.psp__cart table.variations td.value select:focus { outline: none; border-color: var(--color-accent, #fc3f1e); }

/* ============================================================
   Pelican-style — brand selling-points / quality promise
   ============================================================ */
.psp-features { margin-top: var(--space-8); }
.psp-features__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
.psp-feature {
  background: #fff; border: 1px solid #ececec; border-radius: var(--radius-lg, 12px);
  padding: var(--space-5); text-align: center;
}
.psp-feature__icon { width: 34px; height: 34px; color: var(--color-accent, #fc3f1e); margin: 0 auto var(--space-3); }
.psp-feature__t { font-size: 15px; font-weight: 600; color: #222; margin-bottom: 6px; }
.psp-feature__d { font-size: 13px; color: #777; line-height: 1.5; }

/* ============================================================
   Responsive — stack sidebar, wrap toolbar
   ============================================================ */
@media (max-width: 1024px) {
  .shop-layout { grid-template-columns: 1fr; }
  .shop-sidebar { position: static; margin-bottom: var(--space-6); }
  .psp-features__grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
  .shop-toolbar { flex-direction: column; align-items: flex-start; gap: var(--space-3); }
  .psp-features__grid { grid-template-columns: 1fr; }
}

/* ============================================================
   问题1：单品页隐藏 WooCommerce 默认面包屑（白底块，与主题 hero 面包屑重复）
   仅 archive 页之前已隐藏；single-product 页补上同样的隐藏。
   ============================================================ */
.single-product .woocommerce-breadcrumb { display: none; }