/* [SITE-CHAT] 在线咨询前台样式，单独文件：只在本页显示在线咨询时由 layout.php 引入（与 front.css 解耦，便于并行改版合并）。 */
/* [SITE-CHAT] live chat panel (docs/specs/site-chat.md §4.2). Desktop: non-modal panel beside the floating toolbar;
   ≤720px: full-screen modal. The conversation itself is Live Helper Chat's own page in a lazy iframe. */
.gx-chat{position:fixed;inset:auto;inset-inline-end:88px;inset-block-end:24px;z-index:50;margin:0;padding:0;width:380px;max-width:calc(100vw - 112px);height:min(640px,calc(100vh - 48px));border:1px solid var(--gw-sep-soft);border-radius:var(--gw-r-xl);box-shadow:var(--gw-sh-2);background:var(--gw-surface);color:var(--gw-ink);overflow:hidden}
.gx-chat[open]{display:flex;flex-direction:column}
.gx-chat::backdrop{background:var(--dk-backdrop,rgba(26,31,58,.28))}
.gx-chat__head{display:flex;align-items:center;gap:12px;padding-block:14px;padding-inline:18px 14px;border-block-end:1px solid var(--gw-sep-soft)}
.gx-chat__mark{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:var(--gw-pill);background:var(--dk-tint,rgba(67,56,202,.10));color:var(--dk-accent-fg,var(--gw-accent))}
.gx-chat__id{flex:1;min-width:0}
.gx-chat__id h2{margin:0;font-size:17px;line-height:1.3;font-weight:700}
.gx-chat__id p{margin:2px 0 0;font-size:13px;color:var(--gw-muted)}
.gx-chat__id .gx-chat__hours{margin-top:0;font-size:12px}
.gx-chat__range{white-space:nowrap;unicode-bidi:isolate}
.gx-chat__head .gx-iconbtn{display:grid;flex:none}
.gx-chat__body{position:relative;flex:1;min-height:0;background:var(--gw-bg)}
.gx-chat__load{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-size:14px;color:var(--gw-muted)}
/* [r12 review #3/#8] the frame sits on the surface token in the page's color-scheme (no white canvas behind a dark LHC page) and fades in once LHC has painted */
.gx-chat__frame{position:relative;display:block;width:100%;height:100%;border:0;color-scheme:light;background:var(--gw-bg);visibility:hidden;opacity:0;transition:opacity .16s ease-out,visibility 0s .16s}
:root[data-theme=dark] .gx-chat__frame{color-scheme:dark}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .gx-chat__frame{color-scheme:dark}}
.gx-chat[data-loaded] .gx-chat__frame{visibility:visible;opacity:1;transition:opacity .16s ease-out}
@media (prefers-reduced-motion:reduce){.gx-chat__frame,.gx-chat[data-loaded] .gx-chat__frame{transition:none}}
.gx-chat[data-loaded] .gx-chat__load{display:none}
.gx-chat__foot{margin:0;padding:10px 18px 12px;font-size:12px;line-height:1.5;color:var(--gw-muted);border-block-start:1px solid var(--gw-sep-soft)}
.gx-chat__foot a{color:var(--gw-link);white-space:nowrap}
.gx-chat__foot .segs a{display:inline-flex;align-items:center;min-block-size:24px} /* [R2 #15] the links are flex segments now (no inline-text exemption): 24px targets when they wrap to two rows */
.gx-chat__note{display:block;margin-block-end:2px;text-wrap-style:pretty}
html[lang|=zh] .gx-chat{word-break:keep-all;overflow-wrap:anywhere}
.gx-chat .gx-iconbtn:focus-visible,.gx-chat__foot a:focus-visible,.floatbar__btn:focus-visible{outline:none;box-shadow:var(--gw-focus)}
@media (max-width:720px){
  .gx-chat{inset:0;width:100%;max-width:none;height:100%;max-height:none;border:0;border-radius:0;box-shadow:none}
  .gx-chat__head{padding-block:10px}
  .gx-tabbar--5{grid-template-columns:repeat(5,1fr)}
  .gx-dock--chat{grid-template-columns:auto auto minmax(0,1fr)}
}
/* Tablet 721–1100: the floating toolbar is hidden and the tab bar is phone-only, so the chat entry sits in the header (DESIGN.md Header) */
.gx-act--chat{display:none}
@media (min-width:721px) and (max-width:1100px){.gx-act--chat{display:inline-flex;justify-content:center;min-width:44px;min-height:44px;padding-inline:0}}