/* =================================================
   日本电商「精致版」最终样式（精准修复 quickview）
   - 去蓝色体系
   - 主按钮：#8F8989（高级暖灰）
   - NEW / SALE / DISCOUNT / PACK 标签统一风格
   - 修复手机端 Quick View（拡大/小眼睛）变白问题
     ✅ 你的主题实际 class：js-quickview（无短横线）
   适用于 PrestaShop 9 / hummingbird
   ================================================= */

/* ---------- 基础字体与正文 ---------- */
#page,
body {
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    "Hiragino Kaku Gothic ProN",
    "Hiragino Sans",
    "Yu Gothic",
    "Yu Gothic Medium",
    "Meiryo",
    Arial,
    sans-serif;

  font-size: 14px;
  line-height: 1.7;
  color: #111111;
}

/* =================================================
   链接（去蓝 → 深灰）
   ================================================= */
a,
a:visited {
  color: #222222;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #000000;
  text-decoration: underline;
}

/* =================================================
   产品列表标题
   ================================================= */
.product-title,
.product-title a,
.products .product-title a {
  color: #111111;
}

.product-title a:hover {
  color: #000000;
  text-decoration: underline;
}

/* =================================================
   价格
   ================================================= */
.price,
.product-price {
  color: #000000;
  font-size: 20px;
  font-weight: 600;
}

.old-price,
.regular-price {
  color: #666666;
  font-size: 14px;
}

/* =================================================
   按钮（主色：#8F8989）
   ================================================= */
.btn,
.btn-primary,
button {
  background-color: #8F8989;
  border-color: #8F8989;
  color: #ffffff;
}

.btn:hover,
.btn-primary:hover,
button:hover {
  background-color: #7A7474;
  border-color: #7A7474;
  color: #ffffff;
}

/* 次级按钮 */
.btn-secondary {
  background-color: #f5f5f5;
  border-color: #dddddd;
  color: #333333;
}

.btn-secondary:hover {
  background-color: #eeeeee;
  border-color: #cccccc;
}

/* ✅ 重要：btn-link 默认可能被主题设置成白色/浅色，这里统一为深灰 */
.btn-link {
  color: #222222;
}
.btn-link:hover,
.btn-link:focus {
  color: #000000;
  text-decoration: underline;
}

/* =================================================
   表单 / UI 文本
   ================================================= */
label,
input,
select,
textarea {
  color: #111111;
}

/* =================================================
   商品标签（NEW / SALE / DISCOUNT / PACK）
   ================================================= */
.product-flags .product-flag,
.product-flags .new,
.product-flags .on-sale,
.product-flags .discount,
.product-flags .pack,
.product-flag {
  background-color: #f6b1b1; /* 日系浅红 */
  color: #ffffff;
  font-size: 12px;
  border-radius: 4px;
  padding: 2px 6px;
  line-height: 1.4;
}
.product-flag.pack {
  background-color: #f6b1b1;
  color: #ffffff;
}

/* =================================================
   Checkout / 步骤标题（去蓝）
   ================================================= */
.checkout-step,
.checkout-step.-current,
.checkout-step.-reachable {
  color: #111111;
}

/* =================================================
   Footer（比正文更轻）
   ================================================= */
footer,
footer a {
  color: #555555;
}
footer a:hover {
  color: #000000;
}

/* =================================================
   ✅ 精准修复：商品列表 Quick View（拡大）按钮/图标颜色
   你的结构：
   button.product-miniature__quickview_button.btn.btn-link.js-quickview
   i.material-icons
   ================================================= */

/* 默认状态：按钮文字/图标都用深灰（防止变白） */
.product-miniature__quickview_button.js-quickview,
.product-miniature__quickview_button.js-quickview.btn-link {
  color: #333333 !important;
  background-color: transparent !important;
}

/* Material icon 颜色 */
.product-miniature__quickview_button.js-quickview .material-icons {
  color: #333333 !important;
}

/* hover/active：更深一点 */
.product-miniature__quickview_button.js-quickview:hover,
.product-miniature__quickview_button.js-quickview:active {
  color: #000000 !important;
}
.product-miniature__quickview_button.js-quickview:hover .material-icons,
.product-miniature__quickview_button.js-quickview:active .material-icons {
  color: #000000 !important;
}

/* 只在手机端再强制一遍（你主要问题在手机端） */
@media (max-width: 768px) {
  .product-miniature__quickview_button.js-quickview,
  .product-miniature__quickview_button.js-quickview.btn-link {
    color: #333333 !important;
  }
  .product-miniature__quickview_button.js-quickview .material-icons {
    color: #333333 !important;
  }
}

/* =================================================
   手机端字号微调
   ================================================= */
@media (max-width: 768px) {
  h1 { font-size: 22px; }
  h2 { font-size: 18px; }

  .price,
  .product-price {
    font-size: 18px;
  }
}
.cart-products-count,
.header .cart-products-count,
.blockcart .cart-products-count {
  display: inline-block !important;
  opacity: 1 !important;
  visibility: visible !important;
}
/* 图标 + badge 不拦截点击，点击穿透到外层链接 */
.header-block__icon,
.header-block__badge {
  pointer-events: none;
}
/* 让购物车按钮在 PC 有 hover 手型与反馈（a/span 都生效） */
@media (hover: hover) and (pointer: fine) {
  header .header-block__action-btn {
    cursor: pointer;
    transition: opacity 0.15s ease;
  }

  header .header-block__action-btn:hover {
    opacity: 0.85;
  }
}
