/* 语风官网 · 移动端增强 (PWA) —— 仅在窄屏生效，桌面端零影响 */
:root { --yf-theme: #ff9b25; --yf-bar-h: 56px; }

/* 顶部阅读进度条 */
#yfProgress {
  position: fixed; top: 0; left: 0; height: 2px; width: 0;
  background: var(--yf-theme); z-index: 9998; transition: width .1s linear;
}

/* 底部快捷工具栏 */
.yf-mbar {
  display: none;
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 9997;
  height: calc(var(--yf-bar-h) + env(safe-area-inset-bottom, 0px));
  padding-bottom: env(safe-area-inset-bottom, 0px);
  background: rgba(255, 255, 255, .97);
  -webkit-backdrop-filter: saturate(180%) blur(12px);
  backdrop-filter: saturate(180%) blur(12px);
  border-top: 1px solid rgba(0, 0, 0, .08);
  box-shadow: 0 -2px 14px rgba(0, 0, 0, .08);
  align-items: stretch; justify-content: space-around;
}
.yf-mbar-i {
  flex: 1 1 0; display: flex; flex-direction: column;
  align-items: center; justify-content: center; gap: 2px;
  color: #5a5a5a; text-decoration: none; font-size: 11px; line-height: 1.2;
  background: none; border: 0; padding: 0; margin: 0; cursor: pointer;
  font-family: inherit; -webkit-tap-highlight-color: transparent;
}
.yf-mbar-i:active { background: rgba(255, 155, 37, .1); }
.yf-mi { font-size: 19px; line-height: 1; color: var(--yf-theme); }
.yf-mbar-i em { font-style: normal; }
.yf-mbar-i[href="tel:18661199988"] { color: var(--yf-theme); font-weight: 600; }

/* PWA 安装提示条 */
#yfInstallTip {
  position: fixed; left: 12px; right: 12px; bottom: calc(var(--yf-bar-h) + env(safe-area-inset-bottom, 0px) + 12px);
  z-index: 9996; display: none; align-items: center; gap: 10px;
  background: #fff; border: 1px solid rgba(0, 0, 0, .08); border-radius: 12px;
  padding: 10px 12px; box-shadow: 0 6px 24px rgba(0, 0, 0, .14); font-size: 13px; color: #323232;
}
#yfInstallTip.show { display: flex; }
#yfInstallTip b { color: var(--yf-theme); }
#yfInstallTip button {
  margin-left: auto; border: 0; border-radius: 999px; padding: 7px 14px;
  background: var(--yf-theme); color: #fff; font-size: 13px; cursor: pointer;
}
#yfInstallTip .yf-close { background: none; color: #999; font-size: 18px; padding: 0 4px; margin: 0; }

/* 回顶部圆钮（宽屏也可用的悬浮态，这里仅窄屏显示） */
#yfTopBtn { -webkit-tap-highlight-color: transparent; }

@media (max-width: 768px) {
  .yf-mbar { display: flex; }
  /* 避免工具栏遮挡页脚最后一块内容 */
  body { padding-bottom: calc(var(--yf-bar-h) + env(safe-area-inset-bottom, 0px)); }
}
@media (min-width: 769px) {
  .yf-mbar, #yfInstallTip { display: none !important; }
}
@media print { .yf-mbar, #yfInstallTip, #yfProgress { display: none !important; } }

/* 尊重减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  #yfProgress { transition: none; }
}

/* ===== 手机端图片适配（Boss 反馈"图很大很难看"专项优化）===== */
@media (max-width: 768px) {
  /* 1) 全局兜底：任何图片不超出屏幕宽度 */
  img { max-width: 100%; }

  /* 2) "暂无图片"占位图缩小居中 —— 之前 500x400 的占位图在手机上占半屏，非常难看 */
  img[src*="nopic"] {
    width: 138px !important;
    height: auto !important;
    display: block;
    margin: 0 auto;
    opacity: .55;
  }
  /* 占位图所在的卡片容器：压掉多余留白，铺浅灰底 */
  .x-product-list li .img,
  .x-case-item .img,
  .xypg-product-list li .img,
  .xypg-case-list li .img {
    background: #f6f6f6;
  }

  /* 3) 详情页正文里的富文本图片：防固定宽度撑破 */
  .xypg-detail img,
  .x-news-detail img,
  .news-content img,
  .article-content img,
  .detail-content img,
  .xypg-jod-detail img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* 占位图容器精修：高度自适应 + 浅灰底（实际 DOM 为 .cover-item .item-first .img） */
@media (max-width: 768px) {
  .item-first .img:has(img[src*="nopic"]),
  .cover-item .img:has(img[src*="nopic"]),
  .x-product-list li .img:has(img[src*="nopic"]),
  .xypg-product-list li .img:has(img[src*="nopic"]),
  .x-case-item .img:has(img[src*="nopic"]) {
    height: auto !important;
    min-height: 0 !important;
    padding: 16px 0;
    background: #f7f7f7;
    border-radius: 6px;
  }
}