/* Shared desktop visual rules. Touch, narrow layouts and original brand artwork stay intact. */
@media (min-width: 1121px) and (hover: hover) and (pointer: fine) {
  body.qiai-ui-unified {
    --qiai-tools-green: #17633f;
    --qiai-tools-ink: #26362c;
    --qiai-tools-muted: #627168;
    --qiai-tools-paper: #f5f7f4;
    --qiai-tools-line: #d9e1da;
    --qiai-tools-font: "PingFang SC", "Microsoft YaHei", "Noto Sans CJK SC", sans-serif;
  }

  /* Keep the navigation state machine and its transition curtain unchanged. */
  body.qiai-ui-unified.home-page .qiai-header::before {
    background: rgba(255, 255, 255, .985) !important;
    border-bottom: 1px solid var(--qiai-tools-line) !important;
  }
  body.qiai-ui-unified.home-page .qiai-header :is(.qiai-header__brand, .qiai-nav__link, .qiai-nav__toggle, .qiai-header__search) {
    color: var(--qiai-tools-ink) !important;
  }
  body.qiai-ui-unified.home-page .qiai-header__brand img { filter: none !important; }
  body.qiai-ui-unified.home-page .qiai-header .qiai-header__consult {
    color: #fff !important;
    background: var(--qiai-tools-green) !important;
    border-color: var(--qiai-tools-green) !important;
  }
  body.qiai-ui-unified.home-page .qiai-nav__primary::before { background: var(--qiai-tools-green) !important; }

  /* Hide previous fixed tools only after the replacement has successfully mounted. */
  html body.qiai-ui-unified.qiai-ui-tools-ready :is(.floating-actions, .floating-qrcode, .qs-wechat, .qa-wechat, .qiai-brand-wechat, .ka-utilities, .floating-training-actions) { display: none !important; }
  .qiai-consult-rail {
    position: fixed; right: 16px; bottom: 32px; z-index: 1200; display: grid; gap: 8px; font-family: var(--qiai-tools-font); color: var(--qiai-tools-ink);
  }
  .qiai-consult-rail__item {
    box-sizing: border-box; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 64px; min-height: 64px; margin: 0; padding: 8px 4px;
    border: 1px solid var(--qiai-tools-line); border-radius: 4px; background: #fff; color: var(--qiai-tools-green); font-family: inherit; font-size: 12px; font-weight: 600; line-height: 1.4; text-decoration: none; cursor: pointer; box-shadow: 0 3px 14px rgba(23, 54, 38, .06);
  }
  .qiai-consult-rail__item svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
  .qiai-consult-rail__item:is(:hover, [aria-expanded="true"]) { background: var(--qiai-tools-green); color: #fff; border-color: var(--qiai-tools-green); }
  .qiai-consult-panel { position: absolute; right: 76px; bottom: 0; width: 328px; max-height: calc(100dvh - 120px); overflow-y: auto; padding: 22px; background: #fff; border: 1px solid var(--qiai-tools-line); border-radius: 6px; box-shadow: 0 12px 36px rgba(23, 54, 38, .12); }
  .qiai-consult-panel[hidden] { display: none !important; }
  .qiai-consult-panel__head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; }
  .qiai-consult-panel__head h2 { margin: 0; font-family: inherit; font-size: 18px; line-height: 1.5; color: var(--qiai-tools-ink); }
  .qiai-consult-panel__close { width: 32px; height: 32px; border: 1px solid var(--qiai-tools-line); border-radius: 4px; background: #fff; color: var(--qiai-tools-ink); font-size: 22px; cursor: pointer; }
  .qiai-consult-panel p { margin: 12px 0; font-size: 14px; line-height: 1.8; color: var(--qiai-tools-muted); }
  .qiai-consult-panel__codes { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .qiai-consult-panel figure { margin: 0; text-align: center; }
  .qiai-consult-panel img { display: block; width: 100%; height: auto; border: 1px solid var(--qiai-tools-line); }
  .qiai-consult-panel figcaption { font-size: 12px; line-height: 1.6; margin-top: 6px; color: var(--qiai-tools-muted); }
  .qiai-consult-panel__phone { display: inline-block; color: var(--qiai-tools-green); font-size: 24px; line-height: 1.5; font-weight: 600; }
}

/* Purchase-route improvements only apply to a desktop pointer. */
@media (min-width: 1121px) and (hover: hover) and (pointer: fine) {
  /* The shared document already reserves 80px for the main navigation. */
  html body.qiai-ui-unified.qiai-brand-card-actions .products-section :is(.product-card[id], .category-group[id]) {
    scroll-margin-top: 96px;
  }
  html body.qiai-ui-unified #contactForm { scroll-margin-top: 16px; }
  html body.qiai-ui-unified .qiai-buyer-links {
    display: flex; flex-wrap: wrap; gap: 8px 20px; align-items: center; margin-top: 16px;
  }
  html body.qiai-ui-unified .qiai-buyer-links a {
    display: inline-flex; align-items: center; min-height: 44px; color: var(--qiai-tools-green); font-size: 15px; font-weight: 600; line-height: 1.6;
    text-decoration: underline; text-underline-offset: 4px;
  }
  html body.qiai-ui-unified .qiai-buyer-request {
    padding: 16px 20px; margin-bottom: 24px; border: 1px solid var(--qiai-tools-line); border-left: 3px solid var(--qiai-tools-green);
    border-radius: 4px; background: var(--qiai-tools-paper); color: var(--qiai-tools-ink); font-family: var(--qiai-tools-font); font-size: 15px; line-height: 1.8;
  }
  html body.qiai-ui-unified .qiai-buyer-request strong { font-size: 17px; font-weight: 600; }
  html body.qiai-ui-unified .qiai-buyer-request p { margin: 8px 0; color: var(--qiai-tools-muted); font-size: 15px; line-height: 1.8; }
  html body.qiai-ui-unified .qiai-buyer-request a { color: var(--qiai-tools-green); text-decoration: underline; text-underline-offset: 4px; }
}

/* Preserve keyboard focus and avoid suggesting that non-links are clickable. */
@media (min-width: 1121px) and (hover: hover) and (pointer: fine) {
  body.qiai-ui-unified :is(a, button, summary):focus-visible { outline: 3px solid var(--qiai-tools-green); outline-offset: 4px; }
  html body.qiai-ui-unified main .keyword-card:not(a)::after { content: none !important; }
}
/* Expanded answers must remain readable; this is not a page template. */
@media (min-width: 1121px) and (hover: hover) and (pointer: fine) {
  html body.qiai-ui-unified.qiai-ui-procurement .faq-answer.show { max-height: none; }
}
