/* PAW/PWA safe-area baseline for viewport-fit=cover standalone pages.
   Injected into every admin / dealer / factory HTML page by
   apps/api/src/middleware/inject-global-html-assets.js.

   env(safe-area-inset-*, 0px) resolves to 0px in browsers without
   safe-area support, so these rules are inert outside iOS PWA/PAW.

   Selectors below are the concrete fixed/sticky edge-anchored elements
   found across the three apps, not wildcards. Each rule adds the inset
   on top of that element's ORIGINAL padding, and turns a fixed pixel
   height into min-height so the bar grows by the inset instead of
   clipping its contents. Elements that already compose env() in their
   own CSS (e.g. .jpb-header) are intentionally left alone. */

:root {
  --paw-safe-top: env(safe-area-inset-top, 0px);
  --paw-safe-right: env(safe-area-inset-right, 0px);
  --paw-safe-bottom: env(safe-area-inset-bottom, 0px);
  --paw-safe-left: env(safe-area-inset-left, 0px);
  --mobile-keyboard-height: 0px;
  --mobile-keyboard-offset: 0px;
}

/* Unified mobile IME viewport rule. When the keyboard is open, fixed bottom
   chrome follows the visible viewport bottom (the keyboard top). The runtime
   supplies 0px for PAW/WebViews that already resize the layout viewport, and
   a measured offset for browsers that keep the layout viewport unchanged. */
@media screen and (max-width: 768px) {
  html.keyboard-visible .bottom-nav,
  html.keyboard-visible .fixed-bottom,
  html.keyboard-visible .mobile-bottom-bar,
  html.keyboard-visible [data-fixed-bottom="true"] {
    bottom: var(--mobile-keyboard-offset, 0px) !important;
  }
  html.keyboard-visible body,
  html.keyboard-visible main {
    scroll-padding-bottom: calc(12px + var(--mobile-keyboard-offset, 0px));
  }
}

/* ---------- Page box ---------- */
html {
  min-height: 100%;
}

body {
  min-height: 100dvh;
  box-sizing: border-box;
  /* Horizontal insets: nothing clipped by rounded corners in landscape. */
  padding-left: max(0px, var(--paw-safe-left));
  padding-right: max(0px, var(--paw-safe-right));
}

@supports not (min-height: 100dvh) {
  body { min-height: 100vh; }
}

/* ---------- Fixed / sticky top app bars ---------- */

.aam-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.acm-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.admin-package-manage-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.admin-portal-topbar {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.ai-topbar {
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.arfm-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.aum-header {
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.batch-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.bd-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.chat-header {
  min-height: 52px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 10px / 10px */
}

.cm-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.dealer-product-sort-header {
  min-height: 44px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.factory-category-select-topbar {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.fc-header {
  min-height: 48px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.fpm-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.guest-header {
  min-height: 48px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.history-topbar {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
  /* original horizontal padding preserved: 10px / 10px */
}

.inv-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.jal-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.jca-header {
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.jcm-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.jfm-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.jsb-header {
  min-height: 44px;
  padding-top: var(--paw-safe-top);
}

.lg-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.manage-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.mc-import-header-tools {
  box-sizing: border-box;
  padding-top: calc(8px + var(--paw-safe-top));
  /* original horizontal padding preserved: 10px / 10px */
}

.mm-header {
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.of-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.page-header {
  box-sizing: border-box;
  padding-top: calc(12px + var(--paw-safe-top));
  /* original horizontal padding preserved: 16px / 16px */
}

.pc-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.pd-header {
  min-height: 46px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 8px / 8px */
}

.quote-top-sticky {
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
}

.r-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.recycle-header {
  min-height: 58px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: max(16px,calc((100vw / 1120px)/2)) */
}

.rfm-header {
  min-height: 44px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.rm-header {
  min-height: 44px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.sac-select-topbar {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.so-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.soc-header {
  min-height: calc(46px + var(--paw-safe-top));
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.ss-header {
  box-sizing: border-box;
  padding-top: calc(6px + var(--paw-safe-top));
}

.sticky-header {
  min-height: 44px;
  box-sizing: border-box;
  padding-top: var(--paw-safe-top);
  /* original horizontal padding preserved: 6px / 6px */
}

.toolbar {
  box-sizing: border-box;
  padding-top: calc(12px + var(--paw-safe-top));
  /* original horizontal padding preserved: 14px / 14px */
}

/* ---------- Fixed bottom bars and floating controls ---------- */

.ai-bottom-tools {
  padding-bottom: max(0px, var(--paw-safe-bottom));
}

.ai-control-strip {
  bottom: calc(64px + var(--paw-safe-bottom));
}

.detail-float-group {
  /* Stacked above the bottom nav; the nav itself carries the inset,
     so only the gap needs to stay above the Home Indicator. */
  bottom: calc(58px + var(--paw-safe-bottom));
}

.fsf-float-group {
  /* 52px bottom navigation plus a 6px visual gap. */
  bottom: calc(58px + var(--paw-safe-bottom));
}

.r-foot {
  padding-bottom: max(0px, var(--paw-safe-bottom));
}

.sf-float-group {
  /* 52px bottom navigation plus a 6px visual gap. */
  bottom: calc(58px + var(--paw-safe-bottom));
}

@media (max-width: 768px) {
  .fsf-footer,
  .sf-footer {
    box-sizing: border-box;
    align-items: stretch;
    height: calc(52px + var(--paw-safe-bottom));
    padding-bottom: var(--paw-safe-bottom);
  }

  .fsf-footer .fsf-nav-item,
  .sf-footer .sf-nav-item,
  .sf-footer .dealer-nav-item {
    box-sizing: border-box;
    height: 52px;
    min-height: 52px;
    align-self: flex-start;
    justify-content: center;
  }
}

/* Public storefronts keep the status-bar band fixed while content scrolls. */
.fsf-sticky-bar { top: var(--paw-safe-top); }
.sf-sticky-search { top: var(--paw-safe-top); }
.dealer-sticky-search { top: var(--paw-safe-top); }

@media (max-width: 768px) {
  .sf-main {
    padding-top: calc(62px + var(--paw-safe-top));
    padding-bottom: calc(52px + var(--paw-safe-bottom));
  }

  /* Product detail has no catalog search bar; do not inherit the catalog's
     62px top reservation when the page uses the shared storefront shell. */
  .dealer-product-detail-page .sf-main,
  body.dealer-product-detail-page .sf-main,
  body.dealer-storefront-detail-page .sf-main {
    padding-top: 0 !important;
  }

  .fsf-main,
  .fsf-detail-main {
    padding-bottom: calc(52px + var(--paw-safe-bottom));
  }
}

/* PAW storefront/detail/document pages: the top safe-area is a fixed chrome
   cover, not scrollable page padding. */
@media (display-mode: standalone) and (max-width: 768px) {
  .paw-fixed-safe-top-cover {
    --paw-safe-top-bg: #f5f7fa;
    --paw-fixed-safe-top-height: max(44px, env(safe-area-inset-top, 0px));
  }

  .paw-fixed-safe-top-cover.paw-compact-safe-top {
    --paw-fixed-safe-top-height: 5px;
  }

  .paw-fixed-safe-top-cover.paw-compact-safe-top .fsf-main,
  .paw-fixed-safe-top-cover.paw-compact-safe-top .fsf-detail-main,
  .paw-fixed-safe-top-cover.paw-compact-safe-top .sf-main,
  .paw-fixed-safe-top-cover.paw-compact-safe-top .detail-main {
    padding-top: 4px !important;
  }

  .paw-fixed-safe-top-cover::before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: var(--paw-fixed-safe-top-height);
    background: var(--paw-safe-top-bg, #f5f7fa);
    z-index: 2147483000;
    pointer-events: none;
  }

  .paw-fixed-safe-top-cover,
  .paw-fixed-safe-top-cover body {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  .paw-fixed-safe-top-cover .sf-main,
  .paw-fixed-safe-top-cover .fsf-main,
  .paw-fixed-safe-top-cover .fsf-detail-main,
  .paw-fixed-safe-top-cover .detail-main {
    padding-top: 0 !important;
  }

  .paw-fixed-safe-top-cover .sf-sticky-search,
  .paw-fixed-safe-top-cover .dealer-sticky-search,
  .paw-fixed-safe-top-cover .fsf-sticky-bar,
  .paw-fixed-safe-top-cover .sf-carousel-shell {
    top: 0 !important;
  }

  .paw-fixed-safe-top-cover .sticky-header {
    top: 0 !important;
  }

  .paw-fixed-safe-top-cover-node {
    display: block !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: env(safe-area-inset-top, 0px) !important;
    height: var(--paw-fixed-safe-top-height) !important;
    background: var(--paw-safe-top-bg, #f5f7fa) !important;
    z-index: 2147483647 !important;
    pointer-events: none !important;
  }
}

/* Final PAW chrome correction for the pages without a proven fixed header. */
@media (display-mode: standalone) and (max-width: 768px) {
  .paw-fixed-safe-top-cover .paw-fixed-safe-top-cover-node {
    height: var(--paw-fixed-safe-top-height, max(44px, env(safe-area-inset-top, 0px))) !important;
  }

  .paw-fixed-safe-top-cover .sticky-header {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    height: calc(44px + var(--paw-fixed-safe-top-height, max(44px, env(safe-area-inset-top, 0px)))) !important;
    min-height: calc(44px + var(--paw-fixed-safe-top-height, max(44px, env(safe-area-inset-top, 0px)))) !important;
    padding-top: var(--paw-fixed-safe-top-height, max(44px, env(safe-area-inset-top, 0px))) !important;
    z-index: 2147483001 !important;
  }

  .paw-fixed-safe-top-cover .detail-main {
    padding-top: calc(50px + var(--paw-fixed-safe-top-height, max(44px, env(safe-area-inset-top, 0px)))) !important;
  }
}

/* Desktop storefront layouts move the navigation to the top. Preserve their
   existing bottom gap instead of applying the mobile bottom-nav offset. */
@media (min-width: 769px) {
  .fsf-float-group {
    bottom: 12px;
  }
}

/* ---------- Full-bleed chat composer ---------- */
/* Chat pages are intentionally full viewport width. Their message column uses
   14px (12px on narrow screens) side padding, so the composer must explicitly
   grow back over that padding and over the page safe-area padding. */
body.chat-window-shell,
body.guest-chat-shell {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.chat-window-shell #chatView .composer,
.chat-window-shell .composer,
.guest-chat-shell .composer {
  width: calc(100% + 28px + var(--paw-safe-left) + var(--paw-safe-right));
  margin-left: calc(-14px - var(--paw-safe-left));
  margin-right: calc(-14px - var(--paw-safe-right));
  padding-bottom: max(10px, calc(10px + var(--paw-safe-bottom)));
}

@media (max-width: 390px) {
  .chat-window-shell #chatView .composer,
  .chat-window-shell .composer,
  .guest-chat-shell .composer {
    width: calc(100% + 24px + var(--paw-safe-left) + var(--paw-safe-right));
    margin-left: calc(-12px - var(--paw-safe-left));
    margin-right: calc(-12px - var(--paw-safe-right));
  }
}
/* ---------- BEM chat shell (injected fragment, no <head> of its own) ---- */
:where(.chat-shell__header) {
  padding-top: var(--paw-safe-top);
  height: auto;
  min-height: 52px;
  box-sizing: border-box;
}

:where(.chat-shell__composer) {
  padding-bottom: max(10px, calc(10px + var(--paw-safe-bottom)));
}
/* iOS PWA safe-area handling: keep the top inset in the fixed chrome and
   reserve only the bottom home-indicator inset instead of padding the page. */
html {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

body > * {
  box-sizing: border-box;
}

/* Avoid applying env() to the scrolling document. The browser can then
   scroll the content under the status bar without moving the header inset. */
[data-paw-safe-area="top"],
.paw-safe-area-top,
.safe-area-top {
  padding-top: max(0px, env(safe-area-inset-top)) !important;
}

[data-paw-safe-area="bottom"],
.paw-safe-area-bottom,
.safe-area-bottom {
  padding-bottom: max(0px, env(safe-area-inset-bottom)) !important;
}

/* iOS standalone/PWA chrome. Safe-area padding belongs to the fixed chrome,
   not to the element that owns the page's scrolling height. */
@media (display-mode: standalone) {
  header[role="banner"],
  .app-header,
  .site-header,
  .page-header {
    padding-top: max(0px, env(safe-area-inset-top)) !important;
  }

  /* Keep the safe-area spacer inside the fixed app bar rather than in the
     document flow. This prevents the status-bar band from scrolling away. */
  footer,
  .bottom-nav,
  .bottom-tabbar,
  .tabbar,
  .fixed-bottom {
    padding-bottom: max(0px, env(safe-area-inset-bottom)) !important;
  }
}

/* The iOS PAW webview already reserves the home-indicator area outside the
   storefront tab bar. Do not add safe-area-inset-bottom to the tab bar itself:
   that produced a large blank strip and made the navigation appear too tall. */
@media (max-width: 768px) {
  .is-standalone.is-factory-dealer .sf-footer,
  .is-standalone.is-factory-dealer .fsf-footer {
    box-sizing: border-box;
    height: 52px !important;
    min-height: 52px !important;
    padding-bottom: 0 !important;
  }

  .is-standalone.is-factory-dealer .sf-footer .sf-nav-item,
  .is-standalone.is-factory-dealer .sf-footer .dealer-nav-item,
  .is-standalone.is-factory-dealer .fsf-footer .fsf-nav-item {
    box-sizing: border-box;
    height: 52px !important;
    min-height: 52px !important;
    padding-bottom: 2px;
  }

  .is-standalone.is-factory-dealer .sf-main,
  .is-standalone.is-factory-dealer .fsf-main,
  .is-standalone.is-factory-dealer .fsf-detail-main {
    padding-bottom: 52px !important;
  }

  .is-standalone.is-factory-dealer .sf-float-group,
  .is-standalone.is-factory-dealer .fsf-float-group,
  .is-standalone.is-factory-dealer .detail-float-group {
    bottom: 58px !important;
  }
}

/* Keep the chat page's known-good independent message scroll layout.

   The title bar is a sticky header that still occupies normal flow (it is
   not position:fixed), so #chatView has to own the full viewport height and
   the message column must take only the remaining space. The previous rule
   forced .thread-main to a full 100dvh *and* added a header-sized
   padding-top on top of the in-flow header: the composer ended up one
   header (+ status bar) height below the fold, so the input bar was only
   reachable after manually scrolling the page, and a matching blank band
   appeared under the title bar. WeChat stayed correct because this rule is
   standalone-only. */
@media (max-width: 768px) {
  /* The chat page sets html,body{height:100%} and paw-safe-area.css adds
     body{min-height:100dvh}. On iOS standalone the webview reserves the
     home-indicator strip outside the page, so 100dvh is taller than the
     visible area: the document becomes scrollable by that leftover amount and
     the composer sits just past the fold. Pin the page box to the layout
     viewport instead and let the composer own the bottom inset. */
  html.is-standalone.is-factory-dealer body.chat-window-shell {
    height: 100%;
    min-height: 0;
    max-height: 100%;
    overflow: hidden;
  }

  /* factory-workbench-shell.js adds .factory-workbench-page to body on the
     factory chat page at every viewport width, so this must not exclude it. */
  .is-standalone.is-factory-dealer .chat-window-shell > #chatView {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    overflow: hidden;
  }

  .is-standalone.is-factory-dealer .chat-window-shell > #chatView > .thread-main {
    flex: 1 1 auto;
    height: auto;
    min-height: 0;
    box-sizing: border-box;
  }

  .is-standalone.is-factory-dealer .chat-window-shell > #chatView > .sticky-header {
    flex: 0 0 auto;
    height: calc(52px + var(--paw-safe-top));
    padding-top: calc(6px + var(--paw-safe-top));
  }

  /* #chatView now ends exactly at the bottom of the standalone viewport, so
     the composer is the element that must keep the home-indicator inset.

     Pin it to the bottom of the visual viewport instead of leaving it in
     normal flow. In-flow placement depends on the document being exactly as
     tall as the visible area; on iOS standalone the layout viewport and the
     visible area can differ by a few pixels (home-indicator strip, dvh
     rounding), which left the composer just past the fold ("还差一点").
     Fixed positioning removes that dependency entirely. The bottom offset is
     the same runtime variable mobile-keyboard.js uses while the IME is open,
     so the keyboard behaviour is unchanged.

     `html` + `body` are included in the selector because chat-window.css is
     loaded from <body> (after this stylesheet) and its
     `.is-standalone.is-factory-dealer … .composer{padding-bottom:8px}` rule
     would otherwise win on source order. z-index stays below the conversation
     drawer (80) so the drawer still covers the composer. */
  html.is-standalone.is-factory-dealer body.chat-window-shell
    #chatView .composer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: var(--mobile-keyboard-offset, 0px);
    z-index: 60;
    width: auto;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: max(10px, calc(10px + var(--paw-safe-bottom)));
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }

  /* The pinned composer is out of flow, so reserve its footprint on the
     message column instead. This keeps the product prompt and the last
     message above the composer instead of hidden behind it. */
  html.is-standalone.is-factory-dealer body.chat-window-shell
    #chatView > .thread-main {
    /* Matches the pinned composer's own height: 10px + 40px input +
       max(10px, 10px + safe-area-inset-bottom). */
    padding-bottom: calc(60px + var(--paw-safe-bottom));
  }

  html.is-standalone.is-factory-dealer body.chat-window-shell
    #chatView > .thread-main > .chat-thread {
    padding-bottom: 10px;
  }
}

/* WeChat iOS webviews already reserve their own bottom gesture area. Their
   env(safe-area-inset-bottom) value must not be added to the site's tab bar;
   otherwise the bar becomes visibly too tall and the content appears to
   expand with an empty block below it. */
.is-wechat {
  --paw-safe-top: 0px;
  --paw-safe-right: 0px;
  --paw-safe-bottom: 0px;
  --paw-safe-left: 0px;
}

.is-wechat body {
  padding-bottom: 0 !important;
}

/* These storefront rules use env() directly rather than the shared
   --paw-safe-* variables. Reset their top offset too; otherwise the white
   search/carousel band starts below the WeChat header and scrolls away with
   the page. */
.is-wechat .sf-sticky-search,
.is-wechat .sf-carousel-shell,
.is-wechat .fsf-sticky-bar,
.is-wechat .sf-sticky-bar,
.is-wechat .dealer-sticky-search {
  top: 0 !important;
}

.is-wechat .sf-footer,
.is-wechat .fsf-footer,
.is-wechat .bottom-nav,
.is-wechat .bottom-tabbar,
.is-wechat .tabbar {
  height: 52px !important;
  min-height: 52px !important;
  padding-bottom: 0 !important;
}

.is-wechat .sf-footer .sf-nav-item,
.is-wechat .sf-footer .dealer-nav-item,
.is-wechat .fsf-footer .fsf-nav-item {
  height: 52px !important;
  min-height: 52px !important;
}

.is-wechat .sf-main,
.is-wechat .fsf-main,
.is-wechat .fsf-detail-main {
  padding-bottom: 52px !important;
}

/* The verified sales-orders header uses a fixed bar and a matching content
   offset, rather than relying on sticky inside the PAW scroll container. */
.is-standalone .so-header {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  z-index: 1000;
}

.is-standalone .so-main {
  padding-top: calc(46px + 6px) !important;
}

/* 厂家开单页：与订单列表同一套固定头 + 内容顶距，避免 PAW 状态栏遮挡 */
.is-standalone .soc-header {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  z-index: 1000;
  height: calc(46px + var(--paw-safe-top)) !important;
  min-height: calc(46px + var(--paw-safe-top)) !important;
  padding-top: var(--paw-safe-top) !important;
}

.is-standalone .soc-main {
  padding-top: calc(46px + var(--paw-safe-top) + 8px) !important;
}

/* On iOS PAW, make ordinary page headers use the same fixed-chrome pattern
   only when the page explicitly opts in via this class. */
.is-standalone .paw-fixed-page-header {
  position: fixed !important;
  top: 0 !important;
  left: 0;
  right: 0;
  z-index: 1000;
}

.is-wechat .sf-float-group,
.is-wechat .fsf-float-group,
.is-wechat .detail-float-group {
  bottom: 58px !important;
}

/* PAW path allowlist in pwa-register.js promotes existing sticky page headers
   to fixed chrome, then reserves the measured height on the following content. */
.is-standalone .paw-existing-fixed-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  z-index: 1000 !important;
  box-sizing: border-box;
}

.is-standalone .paw-existing-fixed-content {
  padding-top: calc(var(--paw-existing-header-height, 46px) + 6px) !important;
}

/* Desktop factory workbench: never let promoted headers full-bleed over the
   left nav. Sidebar is z-index 999 / width 180px; page headers must sit in the
   content column only. pwa-register also skips promote on this viewport. */
@media (min-width: 769px) {
  body.factory-workbench-page .paw-existing-fixed-header,
  html.is-standalone.is-factory-dealer body.factory-workbench-page > header.paw-existing-fixed-header,
  html.is-standalone.is-factory-dealer body.factory-workbench-page > .paw-existing-fixed-header {
    top: 40px !important;
    left: 180px !important;
    right: 0 !important;
    width: auto !important;
    z-index: 998 !important;
  }
  body.factory-workbench-sidebar-hidden .paw-existing-fixed-header,
  html.is-standalone.is-factory-dealer body.factory-workbench-sidebar-hidden > header.paw-existing-fixed-header,
  html.is-standalone.is-factory-dealer body.factory-workbench-sidebar-hidden > .paw-existing-fixed-header {
    left: 0 !important;
  }
  /* Body already has workbench padding-top/left; avoid a second large content offset
     that pushes totals above the title (cost-manage etc.). */
  body.factory-workbench-page .paw-existing-fixed-content {
    padding-top: 0 !important;
  }
}

/* Dealer product detail has its own fixed header geometry. Do not let the
   generic PAW header rule add a second six-pixel content offset. */
.is-standalone.dealer-product-detail-page .sticky-header {
  display: none !important;
}

.is-standalone.dealer-product-detail-page .detail-main.paw-existing-fixed-content {
  padding-top: 0 !important;
}

/* Sales / shipment document pages are full-page printable canvases in PAW.
   They should not reserve an extra top safe-area band, while the bottom action
   bar should cover the iOS home-indicator strip instead of leaving white below. */
@media (display-mode: standalone) and (max-width: 767px) {
  .is-standalone.is-order-document-page,
  .is-standalone.is-order-document-page body {
    padding-top: 0 !important;
    margin-top: 0 !important;
    background: #fff !important;
  }

  .is-standalone.is-order-document-page .mo-main,
  .is-standalone.is-order-document-page .so-main {
    padding-top: 0 !important;
    margin-top: 0 !important;
  }

  .is-standalone.is-order-document-page .page-actions {
    display: none !important;
  }

  .is-standalone.is-order-document-page .bottom-nav {
    bottom: 0 !important;
    height: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
    min-height: calc(62px + env(safe-area-inset-bottom, 0px)) !important;
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
    background: #D4E4BC !important;
  }

  .is-standalone.is-order-document-page .bottom-nav .bottom-nav-btn {
    height: 62px !important;
    min-height: 62px !important;
    padding-bottom: 0 !important;
  }
}
