/* ============================================================ HGBOX · 天府八吉好运文创商店 — 统一主题系统 v7 Donezo Dashboard 风格 · 深绿主色 · 卡片化布局 适用于：default.aspx, vip.aspx, hlpforms/*.aspx ============================================================ */ /* Google Fonts */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Noto+Sans+SC:wght@300;400;500;700&display=swap'); /* ===================== CSS 变量 ===================== */ :root { /* Donezo 绿色系 */ --hg-primary: #0066CC; --hg-primary-deep: #0052A3; --hg-primary-light: #4D8FE0; --hg-primary-pale: #D6E7F9; --hg-primary-soft: #EBF3FC; --hg-primary-dark: #003D7A; /* 标题与下方绿线的统一间距（禁止渐变，纯色实线）。全站所有标题分隔线共用此值 */ --hg-title-gap: 8px; /* 深色次要色 */ --hg-secondary: #111827; --hg-secondary-deep:#000000; --hg-secondary-light:#374151; /* 强调色 */ --hg-accent: #F59E0B; --hg-accent-deep: #D97706; /* 兼容旧变量名 */ --hg-orange: var(--hg-accent); --hg-orange-deep: var(--hg-accent-deep); --hg-orange-light: #FCD34D; --hg-orange-pale: #FEF3C7; /* 中性色 */ --hg-ink: #111827; --hg-muted: #6B7280; --hg-faint: #9CA3AF; --hg-canvas: #F9FAFB; --hg-surface: #FFFFFF; --hg-gray: #F3F4F6; --hg-gray-hover: #E5E7EB; --hg-border: #E5E7EB; --hg-border-light: #F3F4F6; --hg-divider: #D1D5DB; /* 语义色 */ --hg-success: #0066CC; --hg-danger: #EF4444; --hg-warning: #F59E0B; --hg-info: #3B82F6; /* 弹窗成功图标专用绿勾（2026-08-21 全站统一：成功=绿勾，与主色蓝区分） */ --hg-ok: #059669; /* 阴影 — Donezo 柔和阴影 */ --hg-shadow-sm: 0 1px 2px rgba(0,0,0,.04); --hg-shadow: 0 1px 3px rgba(0,0,0,.05); --hg-shadow-md: 0 4px 12px rgba(0,0,0,.05); --hg-shadow-lg: 0 8px 24px rgba(0,0,0,.06); --hg-shadow-xl: 0 16px 40px rgba(0,0,0,.08); /* 圆角 — 大圆角 */ --hg-radius-xs: 6px; --hg-radius-sm: 8px; --hg-radius: 12px; --hg-radius-lg: 16px; --hg-radius-xl: 20px; --hg-radius-full: 9999px; /* 布局 */ --hg-maxw: 1440px; --hg-topbar-h: 72px; --hg-sidebar-w: 240px; /* 控件统一高度（输入框/下拉/日期/按钮等高，2026-08-10 用户要求） */ --hg-control-h: 40px; /* 字体 */ --hg-font: Inter, "Noto Sans SC", "PingFang SC", "Microsoft YaHei", Arial, sans-serif; --hg-font-mono: "SF Mono", "Cascadia Code", Consolas, monospace; /* 过渡 */ --hg-ease: cubic-bezier(.25,.1,.25,1); --hg-ease-spring: cubic-bezier(.34,1.56,.64,1); --hg-ease-standard: cubic-bezier(.4,0,.2,1); } /* ===================== 全局重置 ===================== */ *, *::before, *::after { box-sizing: border-box; } html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; /* 始终为右侧垂直滚动条预留槽位：有/无滚动条的页面切换时， 视口可用宽度恒定 → 左侧菜单、顶部 logo、右侧内容框不再左右跳动 */ scrollbar-gutter: stable; scrollbar-width: thin; /* Firefox 细滚动条 */ scrollbar-color: #9CA3AF #E5E7EB; /* 滑块中性灰 / 轨道浅灰 */ } /* WebKit（Chrome/Edge）细滚动条，观感更接近浮层 */ html::-webkit-scrollbar { width: 10px; } html::-webkit-scrollbar-thumb { background: #9CA3AF; border-radius: var(--hg-radius-sm); } html::-webkit-scrollbar-thumb:hover { background: #6B7280; } html::-webkit-scrollbar-track { background: transparent; } /* 旧浏览器（不支持 scrollbar-gutter）回退：始终显示滚动条，同样消除跳动 */ @supports not (scrollbar-gutter: stable) { html { overflow-y: scroll; } } body { margin: 0; padding: 0; font-family: var(--hg-font); font-size: 14px; line-height: 1.55; color: var(--hg-ink); background: var(--hg-canvas); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a { color: inherit; text-decoration: none; } img { max-width: 100%; height: auto; display: block; } ul, ol { list-style: none; padding: 0; margin: 0; } /* ===================== 顶部导航（Donezo App Bar）===================== */ .hg-topbar { position: sticky; top: 0; z-index: 100; background: var(--hg-surface); border-bottom: 1px solid var(--hg-border); } .hg-topbar-inner { max-width: var(--hg-maxw); margin: 0 auto; height: var(--hg-topbar-h); padding: 0 28px; display: flex; align-items: center; gap: 20px; } /* 品牌标识 */ .hg-brand { display: flex; align-items: center; gap: 12px; font-size: 18px; font-weight: 700; letter-spacing: -.02em; color: var(--hg-ink); transition: opacity .2s var(--hg-ease-standard); } .hg-brand:hover { opacity: .85; } .hg-brand .hg-mark { width: 38px; height: 38px; border-radius: var(--hg-radius); display: grid; place-items: center; background: var(--hg-primary); color: #fff; font-size: 10.5px; font-weight: 700; letter-spacing: .5px; box-shadow: 0 4px 12px rgba(0, 102, 204, .25); } .hg-brand small { font-weight: 400; color: var(--hg-faint); font-size: 11px; margin-left: 4px; letter-spacing: .04em; } /* 搜索框 */ .hg-search { flex: 1; max-width: 400px; position: relative; } .hg-search input { width: 100%; padding: 10px 16px 10px 40px; font-family: var(--hg-font); font-size: 14px; background: var(--hg-gray); border: 1px solid transparent; border-radius: var(--hg-radius-full); outline: none; transition: all .2s var(--hg-ease-standard); } .hg-search input:focus { background: var(--hg-surface); border-color: var(--hg-primary); box-shadow: 0 0 0 3px var(--hg-primary-pale); } .hg-search::before { content: "\1F50D"; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); font-size: 14px; opacity: .5; } /* 顶部标题区 */ .hg-page-title { font-size: 24px; font-weight: 800; color: var(--hg-ink); letter-spacing: -.02em; } .hg-page-subtitle { font-size: 13px; color: var(--hg-muted); margin-top: 2px; } /* 顶部操作区 */ .hg-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 16px; } .hg-topbar-icon { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center; background: var(--hg-gray); color: var(--hg-muted); cursor: pointer; transition: all .2s var(--hg-ease-standard); font-size: 16px; position: relative; } .hg-topbar-icon:hover { background: var(--hg-primary-soft); color: var(--hg-primary); } /* 铃铛右上角未读站内信角标（空值不显示） */ .hg-topbar-icon[data-badge]:not([data-badge=""])::after { content: attr(data-badge); position: absolute; top: -4px; right: -4px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: var(--hg-radius-full); background: var(--hg-danger); color: #fff; font-size: 10px; font-weight: 700; display: grid; place-items: center; border: 2px solid var(--hg-surface); } /* 头像改为图片 */ .hg-topbar-avatar-img { width: 38px; height: 38px; border-radius: 50%; object-fit: cover; border: 2px solid var(--hg-border); cursor: pointer; } .hg-topbar-avatar { width: 38px; height: 38px; border-radius: 50%; background: var(--hg-primary-soft); border: 2px solid var(--hg-border); display: grid; place-items: center; font-size: 14px; font-weight: 700; color: var(--hg-primary-deep); cursor: pointer; display: none; /* 默认隐藏文字头像 */ } .hg-topbar-user-link { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; cursor: pointer; background: none; border: 0; padding: 0; } .hg-topbar-user { display: flex; flex-direction: column; line-height: 1.3; } .hg-topbar-user-name { font-size: 13px; font-weight: 600; color: var(--hg-ink); } .hg-topbar-user-email { font-size: 11px; color: var(--hg-faint); } /* 汉堡菜单按钮（2026-08-15 用户确认：初始即深绿背景 + 白色三条杠） */ .hg-menu-toggle { display: none; margin-left: auto; border: 0; background: var(--hg-primary-deep); cursor: pointer; width: 44px; height: 44px; position: relative; color: var(--hg-ink); border-radius: var(--hg-radius-full); transition: background .2s var(--hg-ease-standard); } .hg-menu-toggle:hover { background: var(--hg-primary); } .hg-menu-toggle span { display: block; width: 20px; height: 2px; background: #fff; border-radius: 2px; /* 白色三条杠 */ position: absolute; left: 12px; transition: transform .25s var(--hg-ease-standard), opacity .2s var(--hg-ease-standard), background .2s var(--hg-ease-standard); } .hg-menu-toggle:hover span { background: #fff; } .hg-menu-toggle span:nth-child(1) { top: 15px; } .hg-menu-toggle span:nth-child(2) { top: 21px; } .hg-menu-toggle span:nth-child(3) { top: 27px; } .hg-menu-toggle.hg-open span:nth-child(1) { transform: translateY(6px) rotate(45deg); } .hg-menu-toggle.hg-open span:nth-child(2) { opacity: 0; } .hg-menu-toggle.hg-open span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); } /* 系统/浏览器深色模式：保持深绿按钮 + 白色线条（深色顶栏下同样醒目） */ @media (prefers-color-scheme: dark) { .hg-menu-toggle { background: var(--hg-primary-deep); } .hg-menu-toggle span { background: #fff; } .hg-menu-toggle:hover { background: var(--hg-primary); } .hg-menu-toggle:hover span { background: #fff; } } /* ===================== 按钮系统 ===================== */ .hg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 20px; border: 0; border-radius: var(--hg-radius); font-family: var(--hg-font); font-size: 14px; font-weight: 500; cursor: pointer; transition: all .2s var(--hg-ease-standard); text-align: center; line-height: 1.4; user-select: none; white-space: nowrap; letter-spacing: -.01em; box-shadow: var(--hg-shadow-sm); } .hg-btn:hover { box-shadow: var(--hg-shadow-md); transform: translateY(-1px); } .hg-btn:active { transform: translateY(0); box-shadow: var(--hg-shadow-sm); } .hg-btn-primary { background: var(--hg-primary); color: #fff; } .hg-btn-primary:hover { background: var(--hg-primary-deep); } .hg-btn-secondary { background: var(--hg-secondary); color: #fff; } .hg-btn-secondary:hover { background: var(--hg-secondary-deep); } .hg-btn-accent { background: var(--hg-accent); color: #fff; } .hg-btn-accent:hover { background: var(--hg-accent-deep); } .hg-btn-outline { background: transparent; color: var(--hg-ink); border: 1px solid var(--hg-border); box-shadow: none; } .hg-btn-outline:hover { border-color: var(--hg-primary); color: var(--hg-primary); background: var(--hg-primary-soft); box-shadow: none; } .hg-btn-ghost { background: transparent; color: var(--hg-ink); box-shadow: none; } .hg-btn-ghost:hover { color: var(--hg-primary); background: var(--hg-primary-soft); box-shadow: none; } .hg-btn-danger { background: var(--hg-danger); color: #fff; } .hg-btn-danger:hover { opacity: .92; } .hg-btn-sm { padding: 7px 14px; font-size: 13px; } .hg-btn-lg { padding: 14px 28px; font-size: 16px; } .hg-btn-block { display: flex; width: 100%; } /* Floating Action Button */ .hg-fab { width: 56px; height: 56px; border-radius: var(--hg-radius-full); display: grid; place-items: center; background: var(--hg-primary); color: #fff; border: 0; box-shadow: var(--hg-shadow-md); cursor: pointer; transition: transform .2s var(--hg-ease-standard), box-shadow .2s var(--hg-ease-standard); } .hg-fab:hover { box-shadow: var(--hg-shadow-lg); } .hg-fab:active { transform: scale(.95); } .hg-fab-sm { width: 40px; height: 40px; } /* ===================== 卡片系统 ===================== */ .hg-card { background: var(--hg-surface); border: 0; border-radius: var(--hg-radius-xl); padding: 24px; box-shadow: var(--hg-shadow-md); transition: transform .2s var(--hg-ease-standard), box-shadow .2s var(--hg-ease-standard); } .hg-card:hover { box-shadow: var(--hg-shadow-lg); } .hg-card-flat { border: 1px solid var(--hg-border); box-shadow: none; } .hg-card-flat:hover { box-shadow: var(--hg-shadow-sm); } .hg-card-highlight { border: 0; box-shadow: 0 0 0 2px var(--hg-primary), var(--hg-shadow-md); } .hg-card-header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; padding-bottom: 12px; border-bottom: 1px solid var(--hg-border-light); } .hg-card-header h2, .hg-card-header h3 { margin: 0; font-size: 17px; font-weight: 700; } /* KPI 卡片 — Donezo 风格 */ .hg-kpi-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 20px; } .hg-kpi { background: var(--hg-surface); border-radius: var(--hg-radius-xl); padding: 20px; box-shadow: var(--hg-shadow-md); border: 1px solid var(--hg-border); position: relative; } .hg-kpi-label { font-size: 12px; font-weight: 600; color: var(--hg-muted); text-transform: uppercase; letter-spacing: .04em; margin-bottom: 8px; } .hg-kpi-value { font-size: 28px; font-weight: 800; color: var(--hg-ink); letter-spacing: -.02em; } .hg-kpi-change { font-size: 12px; font-weight: 600; margin-top: 6px; display: inline-flex; align-items: center; gap: 4px; } .hg-kpi-change.up { color: var(--hg-success); } .hg-kpi-change.down { color: var(--hg-danger); } .hg-kpi-icon { position: absolute; top: 20px; right: 20px; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--hg-gray); color: var(--hg-muted); font-size: 14px; } /* 绿色大 KPI 卡片 */ .hg-kpi-primary { background: var(--hg-primary); color: #fff; border: 0; } .hg-kpi-primary .hg-kpi-label { color: rgba(255,255,255,.8); } .hg-kpi-primary .hg-kpi-value { color: #fff; font-size: 36px; } .hg-kpi-primary .hg-kpi-change { color: rgba(255,255,255,.9); } .hg-kpi-primary .hg-kpi-icon { background: rgba(255,255,255,.2); color: #fff; } /* 深色卡片（Reminders / Time Tracker / Download App） */ .hg-card-dark { background: var(--hg-primary-dark); color: #fff; border: 0; } .hg-card-dark .hg-kpi-label, .hg-card-dark h3 { color: rgba(255,255,255,.9); } .hg-card-dark p { color: rgba(255,255,255,.7); } /* ===================== 表单控件 ===================== */ .hg-label { display: block; margin-bottom: 6px; font-size: 12px; font-weight: 500; color: var(--hg-muted); letter-spacing: .02em; } /* 2026-08-14 panelInfo 内容统一居左对齐（用户确认，修复内容靠右/分散问题） */ #pgForm [id$="panelInfo"], .hg-myprod [id$="panelInfo"] { text-align: left !important; } /* 输入框清除叉（2026-08-14 全局机制，用户确认）： 由 default.aspx hgInitInputClear 给 .hg-input 自动包 .hg-input-wrap（relative）并注入清除按钮， 点击清空内容；仅 input 有值时显示叉。 */ .hg-input-wrap { position: relative; display: inline-block; vertical-align: middle; } .hg-input-wrap > .hg-input { padding-right: 30px; } .hg-input-clear { position: absolute; right: 6px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; display: none; align-items: center; justify-content: center; border: none; background: none; padding: 0; cursor: pointer; color: var(--hg-faint); font-size: 14px; line-height: 1; border-radius: 50%; transition: background .15s, color .15s; } /* 输入框有内容时才显示叉（2026-08-14 用户确认：空时无叉，输入后出现） */ .hg-input-wrap.has-value .hg-input-clear { display: inline-flex; } .hg-input-clear:hover { color: var(--hg-ink); background: var(--hg-primary-soft); } .hg-input, .hg-select, .hg-textarea { width: 100%; padding: 11px 14px; font-family: var(--hg-font); font-size: 14px; color: var(--hg-ink); background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); transition: border-color .2s var(--hg-ease-standard), box-shadow .2s var(--hg-ease-standard); outline: none; line-height: 1.5; /* 2026-08-16 统一输入框高度：disabled/readonly input 在某些 Chromium 渲染下 浏览器默认不应用 padding（导致 .hg-input 计算高度只有 ~18px），与其他 input/edtAmount 等有 wrap 的 input 高度不一致。强制 min-height:42px （=11*2 padding + 20 content） + box-sizing:border-box 防 padding 撑爆。 */ min-height: 42px !important; box-sizing: border-box !important; } /* 2026-09-09：小宽度数字输入框（wcShopPrinterSet 模板行 行/列/左边距/宽度）专用样式。 覆盖 .hg-input 的 11px×14px padding（在小宽 input 上 padding 几乎吃掉全部内容区） + min-height:42px（小框不需要这么高） + 居中显示数字。 关键：必须把 .hg-input-wrap > .hg-input 的 padding-right:30px（给清除叉留位）覆盖掉， 小数字框不需要清除叉。 */ .hg-input-wrap > .hg-input-num, .hg-input-num { padding: 4px 6px !important; min-height: 28px !important; height: 28px !important; text-align: center; } .hg-input-wrap > .hg-input-num { padding-right: 6px !important; } .hg-input-num::-webkit-inner-spin-button, .hg-input-num::-webkit-outer-spin-button { opacity: 1; } /* 保留 spinner 方便微调 */ .hg-input:focus, .hg-select:focus, .hg-textarea:focus { border-color: var(--hg-primary); box-shadow: 0 0 0 3px var(--hg-primary-pale); } /* 2026-08-26：Secret 已设置锁定态（readonly 灰色禁编辑，配「修改」按钮解锁） */ .hg-input.hg-secret-locked { background: #F3F4F6; color: #9CA3AF; cursor: not-allowed; } .hg-input.hg-secret-locked:focus { border-color: var(--hg-border); box-shadow: none; } .hg-input::placeholder, .hg-textarea::placeholder { color: var(--hg-faint); } .hg-textarea { min-height: 100px; resize: vertical; } /* 2026-09-02 窄输入框（CX Dlg 让折扣/限量数字字段 4 条件同排） */ .hg-filter-group .hg-input--narrow { width: 100px; flex: 0 0 100px; } .hg-filter-group .hg-input--narrow::placeholder { font-size: 12px; } .hg-select { appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M6 8L1 3h10z' fill='%236B7280'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; padding-right: 38px; } .hg-form-row { display: flex; gap: 16px; margin-bottom: 16px; align-items: center; } .hg-form-row > .hg-form-label { flex: 0 0 auto; } .hg-form-row > .hg-form-field { flex: 1 1 0; min-width: 0; } /* 促销 Dlg 行间距紧凑（2026-09-02 用户要求：wcCXTJ 对齐销售查询行距） */ .hg-cx-dlg .hg-form-row { margin-bottom: 6px; gap: 12px; align-items: center; } /* 促销 Dlg 空 span（无 id 也无 ASP.NET 控件的占位）收缩到 0，避免被 .hg-form-row > * 残留撑出空白块 */ .hg-cx-dlg .hg-form-row > span:not([class*="hg-form-"]):empty { display: none; } .hg-cx-dlg .hg-form-row > span.hg-form-label:empty, .hg-cx-dlg .hg-form-row > span.hg-form-field:empty { flex: 0 0 0; min-width: 0; padding: 0; margin: 0; } /* 促销 Dlg 章节小标题行（不在 form-row 内，独立 .hg-form-field 包裹），margin 紧贴上下行 */ .hg-cx-dlg > .hg-form-field > .hg-sec-title { margin: 6px 0; } /* 参与店铺 CheckBoxList 强制一行内横排（2026-09-02，对齐销售查询视觉密度） */ .hg-cx-dlg .hg-form-field:has(.hg-shop-inline) { flex: 1 1 auto; min-width: 0; } .hg-cx-dlg .hg-form-field .hg-shop-inline { display: inline-flex !important; flex-wrap: nowrap; align-items: center; gap: 16px; width: 100%; box-sizing: border-box; } .hg-cx-dlg .hg-form-field .hg-shop-inline > tbody { display: inline-flex; flex-wrap: nowrap; } .hg-cx-dlg .hg-form-field .hg-shop-inline > tr { display: inline-flex; align-items: center; gap: 16px; } .hg-cx-dlg .hg-form-field .hg-shop-inline > td { display: inline-flex; align-items: center; gap: 4px; padding: 0 !important; border: 0 !important; white-space: nowrap; } /* 2026-09-14 电子券定义「适用门店」多选（wcEVoucherProdDfDlg）： .hg-form-row .hg-form-field 是 flex 容器，`
` 在 flex 中不产生换行（提示语会漂到门店块右侧）→ 让 CheckBoxList 与提示语各自 flex-basis:100%，强制分行，提示语另起一行贴在门店块下方。 ── 2026-09-15 左对齐修正（用户：「居左对齐」）──────────────────────────── 🔴 居中根因（Playwright 实测祖先链，非推测）： default.aspx 外壳 的**中间 标准渲染 + 回退（ASP.NET GridView 在 tbody 内渲染表头行）。 手册 §3.2 要求选择器同时兼容 tr:first-child > th 与 tr:first-child > td */ #pgForm .hg-sales-grid thead tr > th, #pgForm .hg-sales-grid thead tr > td, #pgForm .hg-sales-grid tbody:first-child tr:first-child > th, #pgForm .hg-sales-grid tbody:first-child tr:first-child > td { font-weight: 700 !important; text-align: center; background: #f3f4f6; color: var(--hg-muted); white-space: normal !important; } #pgForm .hg-sales-grid.hg-sticky-head { overflow: clip; /* 取消滚动容器、不建立 sticky 包含块，同时按 border-radius 裁剪内容 */ } #pgForm .hg-sales-grid.hg-sticky-head thead th, #pgForm .hg-sales-grid.hg-sticky-head tbody:first-child tr:first-child > th { position: sticky; top: var(--hg-topbar-h); z-index: 50; background: #f3f4f6 !important; box-shadow: 0 1px 0 #E6E8EB; } /* 表格第一数据行（排除表头/footer/pager/summary）去加粗+黑色： 2014 .cs Grd_RowDataBound 给 RowIndex==0 加 Font-Bold + ForeColor=#000（inline style 优先级最高， 普通 CSS !important 盖不住）。统一为全站规范的灰色 #6B7280，与其他行一致。 有 时 tbody 第一行 = 第一数据行（hgBuildNewThead 已建 thead 触发此场景）； 无 thead 时 tbody 第一行 = 表头(th)，> td 不匹配 th，安全。 子元素 inline color（如金额涨跌红绿、链接主题绿）不受父 td !important 影响，保留特殊色。 */ #pgForm .hg-sales-grid tbody tr:first-of-type:not(.hg-grid-footer):not(.hg-grid-pager):not(.hg-grid-summary) > td { font-weight: 400 !important; color: var(--hg-muted) !important; } /* 商品档案（.hg-prod-grid）：悬浮表头表格不包 .hg-table-scroll 容器（容器 overflow 会破坏 sticky 吸顶）， 故移动端列宽无法走 .hg-mobile-fit 规则，需独立适配。列宽值与 .hg-mobile-fit 商品列表等价： 编码/金额 64px(min48)、结算方式 64px(min48)、状态 48px(min40)、名称/操作列弹性。 */ @media (max-width: 768px) { /* 2026-08-14 商品档案移动端列宽：已由全局移动端列宽契约（hg-col-*）统一接管，本段不再覆盖列宽。 2026-08-26：商品名称列随全局移动契约 name 60/60（原 auto/0 弹性特例已删，fixed 下 auto 塌至 11px）。 */ } /* 2026-08-14 已删除全局 nth-child 列规则（1547-1569 行历史残留）： 这些规则按 DOM 位置选中所有 .hg-sales-grid 的第 2/3/4/5-8 列，用 #pgForm(ID 特异性 1,1,1) 压过 .hg-col-*(0,2,1) 语义类的 min-width（盒主 70→20px、名称 60→40px）， 导致店铺收货处理等表格"最窄宽度不是 min-width"。 所有表格已由 classifyTable(default.aspx) 注入 hg-col-* 语义类，对齐/宽度/换行 由下方 1955-2094 行全局契约完整管理；wcRptSaleBill 也已弃用 nth-child（JS 重排会错位）。 金额列换行改由 JS(hgWrapMoney) 注入 处理。 */ .hg-num-int { white-space: nowrap; } .hg-num-frac { white-space: nowrap; } /* 数据行悬停反色（排除页脚行、分页行） */ #pgForm .hg-sales-grid tbody tr:not(.hg-grid-footer):not(.hg-grid-pager):hover > td { background: #e6f2fa !important; color: var(--hg-primary) !important; } /* hover 行内子元素（链接/内联色 span/font）也变蓝（用户要求"选中行文字蓝字"），避免白字看不清 */ #pgForm .hg-sales-grid tbody tr:not(.hg-grid-footer):not(.hg-grid-pager):hover > td * { color: var(--hg-primary) !important; } /* 2026-08-31 复选框选中的行（点击行首 checkbox，GridView SelectedRowStyle 是 inline 白字）： # 用 :has() 选中 + !important 强制把内联白字覆盖为蓝字，背景保留 GridView 浅蓝 */ /* 页脚“本页合计” */ #pgForm .hg-sales-grid .hg-grid-footer td { font-weight: 700; background: var(--hg-primary-soft); color: var(--hg-primary-deep); border-bottom: 0; } /* 空数据提示行（GridView EmptyDataText，2026-08-26 上货查询等） */ #pgForm .hg-sales-grid .hg-grid-empty td { text-align: center !important; color: var(--hg-muted); padding: 28px 12px !important; font-size: 13px; } /* 汇总行（“本页合计” / “总计” 等）：销量(5)/销售金额(7)/提成后收入(8) 右对齐 */ #pgForm .hg-sales-grid tr.hg-grid-footer td:nth-child(5), #pgForm .hg-sales-grid tr.hg-grid-footer td:nth-child(7), #pgForm .hg-sales-grid tr.hg-grid-footer td:nth-child(8), #pgForm .hg-sales-grid tr.hg-grid-summary td:nth-child(5), #pgForm .hg-sales-grid tr.hg-grid-summary td:nth-child(7), #pgForm .hg-sales-grid tr.hg-grid-summary td:nth-child(8) { text-align: right !important; font-variant-numeric: tabular-nums; white-space: normal !important; } /* 在线销售（wcSale）合计行：销售数量是第 4 列，全局只对齐了 5/7/8，此处按页补齐。 列序 0序号 1商品编码 2商品名称 3销售数量(→nth-child 4) 4单价 5折扣 6优惠 7实收金额 8操作 */ #pgForm .hg-sales-grid.hg-sale-grid tr.hg-grid-footer td:nth-child(4) { text-align: right !important; font-variant-numeric: tabular-nums; white-space: normal !important; } /* 零售单查询合计行「汇总单数」（2026-09-05）：销售单号列放单数，居中、等宽数字、主色强调 */ #pgForm .hg-sales-grid tr.hg-grid-footer td.hg-foot-cnt, #pgForm .hg-sales-grid tr.hg-grid-summary td.hg-foot-cnt { text-align: center !important; font-variant-numeric: tabular-nums; white-space: normal !important; color: var(--hg-primary); } /* 分页行（JS 规范化前后兜底） */ #pgForm .hg-sales-grid .hg-grid-pager td { text-align: center; color: var(--hg-muted); background: transparent; } /* JS hgNormalizePager() 把页码重建为 flex 容器：统一间距，彻底消除 ASP.NET 默认分页 在页码间生成的不对称空占位
带 text-align:center** → .hg-content-card → .hg-form-row → .hg-evshop-field 一路继承 center， 而 .hg-shop-inline / .hg-hint 都是「只含行内内容」的块级 flex 项（未 blockify 前是 span/文本），于是内容整体被居中（实测 pad=288px：field.x=320 / 首个 checkbox.x=608）。 其它字段行看着正常，只因里面的 input/下拉是定宽 flex 项，不受 text-align 影响 —— **这个坑对所有「行内文本/多选/纯文字」的行都成立，排查同类页先看 td 继承**。 顺带收敛：field 原为 flex:0 0 auto，因内部 flex-basis:100% 子项把宽度顶到外壳宽 （实测 1181 > row 1120，溢出 61px）→ 改 flex:1 1 auto + min-width:0 占满 label 右侧剩余。 ── 2026-09-15 二次修正（用户：「店铺列表应在适用门店后面，与有效天数输入框左对齐」）────── 🔴 实测（Playwright）：row 是 flex-wrap:wrap，field flex-basis:auto = max-content(5 个店名很宽) → 装不下 → **整块掉到 label 下一行行首**（field.y−label.y=36，checkbox.x=320=row.x）， 而有效天数输入框 x=420（label 84 + gap 16）。 修法：basis 改 0（flex:1 1 0）→ field 恒在 label 右侧，checkbox/hint 左缘自然 = 420 对齐； 门店过多时 .hg-shop-inline（block）内部自动折行，hint 仍贴其下。 */ .hg-form-row .hg-form-field.hg-evshop-field { flex: 1 1 0; min-width: 0; align-items: flex-start; justify-content: flex-start; text-align: left; } /* field 现在含「复选框行 + hint 行」两行，row 的 align-items:center 会把 label 垂直夹在两行中间 （实测 label 中心比首个复选框中心低 13.5px）→ label 顶对齐 field 顶， line-height 24px 下文字中心 448 ≈ 复选框中心 448.5，自然对齐首行。 */ .hg-form-row:has(> .hg-form-field.hg-evshop-field) > .hg-form-label { align-self: flex-start; } .hg-form-row .hg-form-field.hg-evshop-field > .hg-shop-inline { flex: 1 1 100%; min-width: 0; text-align: left; } /* 浏览器给 input[type=checkbox] 的 UA 默认 margin 是 3px 3px 3px 4px → 首个复选框会整体右移 4px，与下方 .hg-hint 的左边缘（严格 0）差 4px，肉眼可见不齐。 只清 margin-left（保留上下右，维持复选框与文字的天然间距）。 */ .hg-form-row .hg-form-field.hg-evshop-field > .hg-shop-inline input[type="checkbox"] { margin-left: 0; } .hg-form-row .hg-form-field.hg-evshop-field > .hg-hint { flex: 1 1 100%; margin: 4px 0 0; text-align: left; } /* 2026-09-14 电子券「适用门店设置」专用弹窗（wcEVoucherShopDlg，菜单 118 / G_PageCmd=2）： 门店多选占满整行；行高兜底防 #pgForm{line-height:0} 行盒塌陷（技能 hgbox-css-lh0-collapse）。 本页不在 .hg-evpd 作用域内，故行高需单独声明。 */ :where(.hg-evshop-dlg .hg-form-row) { line-height: 1.6; } .hg-evshop-dlg .hg-form-label { min-width: 72px; } .hg-evshop-dlg .hg-evshop-info { font-size: 13px; color: var(--hg-ink); line-height: 1.6; word-break: break-all; } /* 2026-09-14 电子券定义列表（菜单 118，根 .hg-evpdf）列宽契约： - 电子券号：17 位/10 位数字绝不折行（原先被 auto 布局压成「1000000 (换行) 015」） - 适用门店：内容 =「门店名 + 设置链接」两块，给足下限，避免挤成三行 本页列多、总宽紧，故只钉这两列，其余列沿用全局 hg-col-* 契约。 */ #pgForm .hg-evpdf .hg-sales-grid th.hg-col-code, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-code { width: 96px !important; min-width: 92px !important; white-space: nowrap !important; } /* 2026-09-14 新增「复制」操作列（本页 op 列 2→3）后总宽更紧，出现两处回退： ① 窄列表头被压成竖排（「有效天数」断 3 行、「折扣券」断 2 行）→ 给类型/状态/有效天数最低宽度； ② 名称列本是唯一宽列却被 auto 均分到 91px，券名折成 4 行 → 给它 min-width 兜底， 并让日期/创建人列不折行、门店列略收，把宽度让给名称。 ⚠️ hg-col-center 也用在「适用门店」列上 —— 靠下方 evshop 规则（同特异性、源序更后）覆盖，勿调换顺序。 总账（1280 视口容器 950px）：96+66*3+150+186+92+72+45*3 = 929 < 950，不横滚。 */ #pgForm .hg-evpdf .hg-sales-grid th.hg-col-num, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-num { width: 68px !important; min-width: 66px !important; } #pgForm .hg-evpdf .hg-sales-grid th.hg-col-center, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-center { width: 68px !important; min-width: 66px !important; } #pgForm .hg-evpdf .hg-sales-grid th.hg-col-name, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-name { min-width: 186px !important; } #pgForm .hg-evpdf .hg-sales-grid th.hg-col-date, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-date { min-width: 92px !important; white-space: nowrap !important; } #pgForm .hg-evpdf .hg-sales-grid th.hg-col-boxer, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-boxer { min-width: 72px !important; white-space: nowrap !important; } #pgForm .hg-evpdf .hg-sales-grid th.hg-col-evshop, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-evshop { width: 150px !important; min-width: 140px !important; } @media (max-width: 768px) { #pgForm .hg-evpdf .hg-sales-grid th.hg-col-evshop, #pgForm .hg-evpdf .hg-sales-grid td.hg-col-evshop { width: 92px !important; min-width: 76px !important; } } .hg-form-group { margin-bottom: 16px; } .hg-form-hint { font-size: 12px; color: var(--hg-faint); margin-top: 4px; } /* 在线销售专项 */ .hg-sale-first { background: #fff; } .hg-sale-change { font-size: 16px; font-weight: 700; color: var(--hg-primary); } .hg-sale-chk, .hg-sale-chk label { color: var(--hg-muted); } .hg-checkbox, .hg-radio { display: inline-flex; align-items: center; gap: 10px; cursor: pointer; font-size: 14px; color: var(--hg-muted); } .hg-checkbox input, .hg-radio input { width: 18px; height: 18px; accent-color: var(--hg-primary); } /* 强调变体（商品档案对话框"连续新增"等）：文字深绿色加粗 */ .hg-checkbox--strong, .hg-checkbox--strong label { color: var(--hg-primary-deep); font-weight: 700; } /* 商品收货处理：将“上货后打印条码”勾选文字染成主题绿 */ .hg-green-label, .hg-green-label label { color: var(--hg-primary); } /* 开关变体（hg-switch-check）下保留绿色文字：.hg-switch-check label 的同特异性规则在文件中更靠后， 会覆盖 hg-green-label 的绿色，此处用更高特异性保持（2026-08-14） */ .hg-switch-check.hg-green-label label { color: var(--hg-primary); font-weight: 700; } /* Switch */ .hg-switch { position: relative; display: inline-block; width: 44px; height: 24px; } .hg-switch input { opacity: 0; width: 0; height: 0; } .hg-switch-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background: #D1D5DB; border-radius: 24px; transition: .2s; } .hg-switch-slider:before { position: absolute; content: ""; height: 18px; width: 18px; left: 3px; bottom: 3px; background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 2px rgba(0,0,0,.2); } .hg-switch input:checked + .hg-switch-slider { background: var(--hg-primary); } .hg-switch input:checked + .hg-switch-slider:before { transform: translateX(20px); } /* Switch 变体（ASP.NET CheckBox 渲染结构 input+label 兄弟，如快速下货"扫码输入"勾选）： 隐藏原生勾选框，label 前置轨道+滑块；勾选后轨道变主题绿、滑块右移。 用法：（2026-08-13） */ .hg-switch-check { position: relative; display: inline-flex; align-items: center; cursor: pointer; } .hg-switch-check input { position: absolute; opacity: 0; width: 0; height: 0; } .hg-switch-check label { position: relative; padding-left: 44px; cursor: pointer; color: var(--hg-muted); font-size: 14px; line-height: 24px; } .hg-switch-check label::before { /* 轨道 */ content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 38px; height: 20px; border-radius: 20px; background: #D1D5DB; transition: background .2s; } .hg-switch-check label::after { /* 滑块 */ content: ""; position: absolute; left: 2px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.2); transition: transform .2s; } .hg-switch-check input:checked + label::before { background: var(--hg-primary); } .hg-switch-check input:checked + label::after { transform: translate(18px, -50%); } /* hg-tip 紧凑变体：去掉默认左右 2px margin，与紧邻元素零间隙（用于"扫码开关+"紧挨输入框等场景，2026-08-13） */ .hg-tip--flush { margin: 0 !important; } /* ===== 扫码数量确认浮层（快速下货扫描枪"多件"，2026-08-13）===== 结构：mask(固定遮罩) > box(白卡) > title + input(大号数字) + actions(确定/取消)。 扫描命中后弹出，默认 1 全选，回车=确认；输数字=一次下货多件。 */ .hg-scan-qty-mask { position: fixed; inset: 0; z-index: 200; background: rgba(17, 24, 39, .45); display: flex; align-items: center; justify-content: center; } .hg-scan-qty-box { width: 280px; background: #fff; border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-lg); padding: 24px 28px; text-align: center; } .hg-scan-qty-title { font-size: 16px; font-weight: 600; color: var(--hg-ink); margin-bottom: 16px; } .hg-scan-qty-input { width: 100%; box-sizing: border-box; text-align: center; font-size: 28px; font-weight: 700; padding: 8px 12px; border: 1px solid var(--hg-border); border-radius: var(--hg-radius); color: var(--hg-primary-deep); outline: none; } .hg-scan-qty-input:focus { border-color: var(--hg-primary); } .hg-scan-qty-actions { display: flex; gap: 10px; margin-top: 16px; } .hg-scan-qty-actions .hg-filter-btn { flex: 1; justify-content: center; } /* ===================== 标签/徽章 ===================== */ .hg-badge { display: inline-flex; align-items: center; padding: 4px 12px; border-radius: var(--hg-radius-full); font-size: 12px; font-weight: 500; letter-spacing: .02em; line-height: 1.5; } .hg-badge-primary { background: var(--hg-primary-soft); color: var(--hg-primary-deep); } .hg-badge-secondary { background: var(--hg-gray); color: var(--hg-muted); } .hg-badge-green { background: rgba(0, 102, 204, .10); color: #0052A3; } .hg-badge-red { background: rgba(239,68,68,.10); color: #B91C1C; } .hg-badge-blue { background: rgba(59,130,246,.10); color: #1D4ED8; } .hg-badge-orange { background: var(--hg-orange-pale); color: var(--hg-orange-deep); } /* 节假日徽标：日销售分析「星期」列用。纯色圆点无文字，节日名/星期/倍数走 title 悬停。 数据源 BasHoliday 主表 + 日系数表倍数；颜色语义：红=节假日(连休) 蓝=补班(调休上班日)。 ⚠️ min-width 不可省：全局「老布局表格内的 Label/span」那条 .hg-sales-grid td span 规则 特异度更高且 width 带 !important，会把空内容的圆点压成 0 宽（不可见）， min-width 不受 width 影响可兜底。（2026-09-16 同源问题另见 .hg-touch-dot） */ .hg-hol-dot { display: inline-block; width: 10px; min-width: 10px; height: 10px; border-radius: 50%; vertical-align: middle; cursor: help; } .hg-hol-rest { background: #B91C1C; } .hg-hol-work { background: #1D4ED8; } /* 触达方式三圆点（会员信息列表 wcXcxVip「触达方式」列）：小程序 / 公众号 / 企微，内含渠道首字。 ⚠️⚠️ min-width:18px 不可省（同 .hg-hol-dot 的坑）：全局那条「老布局表格内的 Label/span」规则选择器为 .hg-sales-grid td span（特异度 0,1,2，高于本类 0,1,0），它把 width 强制成 auto !important → 内容只有 10px（10px 字号一个汉字）、height 仍 18px → 渲染成 10×18 竖椭圆（2026-09-16 实测复现）。 加 min-width 后实测回到 18×18 正圆；min-width 不受 width 覆盖影响，可兜底。 ⚠️ 圆点撑宽了触达列，配套见下面 .hg-col-touch 契约（列宽 96px，否则 1080 及以下会竖排）。 */ .hg-touch-dot { display: inline-block; width: 18px; min-width: 18px; height: 18px; border-radius: 50%; color: #fff; font-size: 10px; font-weight: 600; text-align: center; line-height: 18px; margin-right: 4px; box-sizing: border-box; cursor: help; } .hg-touch-dot--on { background: #059669; } .hg-touch-dot--off { background: #D1D5DB; } /* ===================== 分隔线 ===================== */ .hg-divider { border: 0; height: 1px; background: var(--hg-border); margin: 24px 0; } .hg-divider-primary { height: 3px; border: 0; border-radius: 2px; background: var(--hg-primary); margin: 20px 0; } /* ===================== 通知/提示 ===================== */ .hg-alert { padding: 14px 18px; border-radius: var(--hg-radius); font-size: 14px; line-height: 1.5; margin-bottom: 16px; display: flex; align-items: flex-start; gap: 10px; box-shadow: var(--hg-shadow-sm); } .hg-alert-info { background: rgba(59,130,246,.08); color: #1D4ED8; } .hg-alert-success { background: rgba(0, 102, 204, .08); color: #0052A3; } .hg-alert-warning { background: rgba(245,158,11,.08); color: #B45309; } .hg-alert-danger { background: rgba(239,68,68,.08); color: #B91C1C; } /* ===================== 加载动画 ===================== */ .hg-spinner { width: 24px; height: 24px; border: 3px solid var(--hg-border); border-top-color: var(--hg-primary); border-radius: 50%; animation: hg-spin .6s linear infinite; } @keyframes hg-spin { to { transform: rotate(360deg); } } /* ===================== 动画工具类 ===================== */ @keyframes hgFadeIn { from { opacity: 0; } to { opacity: 1; } } @keyframes hgSlideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } } @keyframes hgScaleIn { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } } @keyframes hgPulse { 0%,100% { opacity: 1; } 50% { opacity: .5; } } .hg-fade-in { animation: hgFadeIn .4s var(--hg-ease-standard) both; } .hg-slide-up { animation: hgSlideUp .45s var(--hg-ease-spring) both; } .hg-scale-in { animation: hgScaleIn .35s var(--hg-ease-standard) both; } .hg-pulse { animation: hgPulse 2s var(--hg-ease-standard) infinite; } .hg-stagger > * { animation: hgSlideUp .45s var(--hg-ease-spring) both; } .hg-stagger > *:nth-child(1) { animation-delay: .05s; } .hg-stagger > *:nth-child(2) { animation-delay: .1s; } .hg-stagger > *:nth-child(3) { animation-delay: .15s; } .hg-stagger > *:nth-child(4) { animation-delay: .2s; } .hg-stagger > *:nth-child(5) { animation-delay: .25s; } .hg-stagger > *:nth-child(6) { animation-delay: .3s; } /* ===================== 页脚（按内容卡片同样风格适配） ===================== */ .hg-footer { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow); padding: 28px 28px 22px; margin-top: 24px; text-align: center; } .hg-footer-inner { max-width: var(--hg-maxw); margin: 0 auto; } .hg-footer-grid { display: flex; justify-content: center; gap: 64px; flex-wrap: wrap; margin-bottom: 24px; } .hg-footer-col { min-width: 120px; text-align: left; } .hg-footer-col h4 { font-size: 12px; font-weight: 700; color: var(--hg-muted); text-transform: uppercase; letter-spacing: .06em; margin: 0 0 12px; } .hg-footer-col a { display: block; font-size: 14px; color: var(--hg-faint); padding: 4px 0; transition: color .2s var(--hg-ease-standard); } .hg-footer-col a:hover { color: var(--hg-primary); } .hg-footer-bottom { padding-top: 0; border-top: 0; font-size: 12px; color: var(--hg-faint); line-height: 1.9; } /* 横向一排链接（移除“产品服务/支持/欢迎语”标题后） */ .hg-footer-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 28px; margin-bottom: 18px; } .hg-footer-links a { font-size: 14px; color: var(--hg-muted); transition: color .2s var(--hg-ease-standard); } .hg-footer-links a:hover { color: var(--hg-primary); } /* 备案号行（[图标]公安网备号 + 两空格 + ICP备案号）与上一行版权文字同色（用户 2026-09-15： 「川公网安备…|蜀ICP备… 的颜色都改成 Copyright 行的颜色」）。 原来 a 继承的是 --hg-muted(#6B7280 更深)、span 是 --hg-divider(#D1D5DB 更浅)， 与版权行的 --hg-faint(#9CA3AF) 不一致，视觉上两行明显不同色 → 整行统一 --hg-faint。 hover 仍保留 --hg-primary，链接可点性不变。 分隔符：原为 |（margin: 0 4px）；用户 2026-09-15 改成「2 个空格」 → HTML 侧输出   （U+00A0 不被 HTML 折叠）。 🔴 两条硬规则： ① margin 必须为 0 —— 否则间距 = 4px + 2空格 + 4px ≈ 14px，比原来的竖线还宽， 而用户要的是「像空格一样的分隔」，紧贴两个空格的宽度（12px 字 ≈ 6.6px）。 ② 不用普通空格字符 —— HTML 会把连续空格折叠成 1 个；也不能用  /  （固定 0.5em/1em，与字体空格宽不等，视觉上不是「两个空格」）。 */ .hg-footer-bottom a { color: var(--hg-faint); } .hg-footer-bottom a:hover { color: var(--hg-primary); text-decoration: underline; } .hg-footer-bottom span { color: var(--hg-faint); margin: 0; } /* ===================== 页面容器 ===================== */ .hg-page { width: 100%; max-width: var(--hg-maxw); margin: 0 auto; padding: 28px 28px 40px; } /* ===================== 帮助/内容页 ===================== */ .hg-content { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-xl); padding: 32px 36px; line-height: 1.8; box-shadow: var(--hg-shadow-sm); } .hg-content h1, .hg-content h2, .hg-content h3 { color: var(--hg-ink); margin-top: 1.2em; margin-bottom: .5em; font-weight: 700; } .hg-content h1 { font-size: 28px; text-align: center; color: var(--hg-primary-deep); } .hg-content h2 { font-size: 22px; } .hg-content h3 { font-size: 16px; } .hg-content p { margin: 0 0 1em; color: var(--hg-muted); } .hg-content strong { color: var(--hg-ink); font-weight: 600; } .hg-content hr { border: 0; height: 1px; background: var(--hg-border); margin: 28px 0; } /* ===================== 工具类 ===================== */ .hg-text-center { text-align: center; } .hg-text-right { text-align: right; } .hg-text-muted { color: var(--hg-faint); } .hg-text-primary { color: var(--hg-primary); } .hg-text-sm { font-size: 12px; } .hg-text-lg { font-size: 20px; } .hg-text-xl { font-size: 28px; } .hg-font-bold { font-weight: 700; } .hg-font-medium { font-weight: 500; } .hg-mt-0 { margin-top: 0; } .hg-mt-1 { margin-top: 8px; } .hg-mt-2 { margin-top: 16px; } .hg-mt-3 { margin-top: 24px; } .hg-mt-4 { margin-top: 32px; } .hg-mb-0 { margin-bottom: 0; } .hg-mb-1 { margin-bottom: 8px; } .hg-mb-2 { margin-bottom: 16px; } .hg-mb-3 { margin-bottom: 24px; } .hg-mb-4 { margin-bottom: 32px; } .hg-gap-1 { gap: 8px; } .hg-gap-2 { gap: 16px; } .hg-gap-3 { gap: 24px; } .hg-flex { display: flex; } .hg-flex-wrap { flex-wrap: wrap; } .hg-items-center { align-items: center; } .hg-justify-center { justify-content: center; } .hg-justify-between { justify-content: space-between; } .hg-hidden { display: none; } .hg-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; } /* ===================== 链接增强 ===================== */ .hg-link { color: var(--hg-primary); font-weight: 500; transition: color .2s var(--hg-ease-standard); } .hg-link:hover { color: var(--hg-primary-deep); text-decoration: underline; } /* ===================== 表格美化（通用）===================== */ .hg-table { width: 100%; border-collapse: collapse; font-size: 14px; } .hg-table th { text-align: left; padding: 12px 16px; font-weight: 600; color: var(--hg-muted); font-size: 12px; letter-spacing: .04em; border-bottom: 2px solid var(--hg-border); } .hg-table td { padding: 12px 16px; border-bottom: 1px solid var(--hg-border-light); } /* ===================== 响应式 ===================== */ @media (max-width: 1024px) { .hg-page { max-width: 100%; } /* 2026-08-21 中等屏（769-1024）顶栏左 padding 收窄到 8px，与内容贴边（#pgForm padding-left:0）对齐 */ .hg-topbar-inner { padding: 0 8px; } } @media (max-width: 768px) { .hg-content { padding: 20px; border-radius: var(--hg-radius-lg); } /* 2026-08-21 用户：移动端表单字段上下排列（标签一行、输入框一行），替代横排（label 右对齐 + field 挤占）。 影响全站 .hg-form-row 表单（新增公告/拆壳表单页等） */ .hg-form-row { flex-direction: column; align-items: stretch; gap: 6px; } .hg-form-row .hg-form-label { text-align: left; margin-right: 0; } .hg-form-row .hg-form-field { width: 100%; } .hg-footer-grid { gap: 32px; } .hg-footer-col { min-width: 100px; } .hg-content h1 { font-size: 24px; } .hg-content h2 { font-size: 20px; } .hg-footer-col { text-align: center; } .hg-page-title { font-size: 20px; } .hg-topbar-inner { padding: 0 8px; gap: 12px; } .hg-brand small { display: none; } .hg-search { max-width: 200px; } .hg-search-kbd { display: none; } .hg-topbar-user { display: none; } } @media (max-width: 640px) { body { font-size: 14px; } .hg-content { padding: 16px; } .hg-modal { padding: 12px; } .hg-modal-panel { max-height: 92vh; } .hg-footer-grid { gap: 20px; flex-direction: column; align-items: center; text-align: center; } .hg-card { padding: 18px; } .hg-kpi-value { font-size: 24px; } .hg-kpi-primary .hg-kpi-value { font-size: 28px; } .hg-search { display: none; } } @media (max-width: 480px) { .hg-content { padding: 14px; font-size: 14px; } .hg-btn { padding: 10px 16px; } } /* ============================================================ HGBOX · 真实页面 (default.aspx) 主题锚点 — Donezo Dashboard 绿色 所有真实渲染 DOM 的样式集中于此；default.aspx 与 preview-default.html 共用本文件，避免样式漂移。 ============================================================ */ /* 移动端遮罩 */ #mask { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 200; display: none; } /* ===================== 公告悬浮信息窗口 ===================== */ .hg-modal { position: fixed; inset: 0; z-index: 300; display: none; align-items: center; justify-content: center; padding: 32px; overflow: auto; } .hg-modal.hg-show { display: flex; } .hg-modal-backdrop { /* 2026-08-31 absolute → fixed：遮罩相对视口全屏，避免绝对定位相对页面内容时 贡献横向滚动（POS 折扣弹窗在 375px 视口下出现 1px 横向溢出） */ position: fixed; inset: 0; background: rgba(17, 24, 39, .45); backdrop-filter: blur(2px); } .hg-modal-panel { position: relative; width: min(900px, 94vw); max-height: 90vh; margin: auto; background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-lg); overflow: hidden; display: flex; flex-direction: column; /* 2026-09-11 统一兜底：弹窗内容挂在 #pgForm(line-height:0) 下，未声明行高的 // 行盒会塌成 0（文字挤成一团、带背景的标签「背景比字小」）。 此前是逐块补（.hg-tender-hd/.rows/.sum/.ft 各自 1.45），POS 各弹窗（行卡/选赠卡/ 赠池/取单/查找/券/会员标签）仍漏。此处对弹窗壳统一恢复 1.5，子块自有声明优先。 */ line-height: 1.5; } .hg-modal-close { position: absolute; top: 10px; right: 12px; z-index: 2; width: 34px; height: 34px; line-height: 1; border: 0; border-radius: 50%; background: rgba(255,255,255,.85); color: var(--hg-ink); font-size: 22px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: background .15s var(--hg-ease-standard), color .15s var(--hg-ease-standard); } .hg-modal-close:hover { background: var(--hg-primary); color: #fff; } .hg-modal-frame { width: 100%; flex: 0 0 auto; border: 0; background: #fff; display: block; } /* 外壳表格 */ .hg-shell { width: 100%; max-width: var(--hg-maxw); margin: 24px auto 0; border: 0; border-collapse: separate; border-spacing: 0; background: transparent; table-layout: fixed; } .hg-shell > tbody > tr > td { vertical-align: top; } /* 锁定第一列（左侧菜单）宽度，展开/折叠任意一级菜单时整体宽度不再变化 */ .hg-shell > tbody > tr > td:first-child { width: var(--hg-sidebar-w); min-width: var(--hg-sidebar-w); max-width: var(--hg-sidebar-w); } /* 左侧边栏 — Donezo 风格 */ #pgTool { width: var(--hg-sidebar-w); padding: 20px 16px; background: var(--hg-surface); border-right: 1px solid var(--hg-border); vertical-align: top; border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-md); margin-right: 20px; } #pgTool > table { width: 100%; } #pgTool > table > tbody > tr > td:first-child { width: 0; padding: 0; font-size: 0; } /* TreeView 用 nowrap 属性（非 style），必须覆盖 */ #pgTool td[nowrap] { white-space: normal !important; } #pgTool td[style*="white-space:nowrap"] { white-space: normal !important; } /* 左侧小标题（菜单分组） */ .hg-nav-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--hg-faint); padding: 16px 12px 6px; } /* 内容区 section 标题（替换 JPG 图片标题）— 深绿字 + 2px 实线绿（与 .hg-page-title--underline 一致，无渐变） */ .hg-section-title { display: inline-block; font-size: 20px; font-weight: 700; color: var(--hg-green-d); letter-spacing: -.01em; margin: 0 0 16px; padding-bottom: 8px; border-bottom: 2px solid var(--hg-primary); }题到卡片左边框的距离一致（= 卡片 padding） */ #pgForm td:has(> .hg-section-title) { text-align: left !important; padding-left: 0 !important; padding-right: 0 !important; } /* 首页最新公告：单色小喇叭图标（替换 公告前缀.gif） */ #pgForm .hg-ann-ico { display: inline-block; width: 16px; height: 16px; flex: 0 0 auto; background-color: var(--hg-primary); -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2011l11-7v14l-11-7z%27%2F%3E%3Cpath%20d%3D%27M14%208a4%204%200%200%201%200%208%27%2F%3E%3Cpath%20d%3D%27M3%2013v3a2%202%200%200%200%202%202h1%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2011l11-7v14l-11-7z%27%2F%3E%3Cpath%20d%3D%27M14%208a4%204%200%200%201%200%208%27%2F%3E%3Cpath%20d%3D%27M3%2013v3a2%202%200%200%200%202%202h1%27%2F%3E%3C%2Fsvg%3E") center / contain no-repeat; vertical-align: middle; } #pgForm td:has(> .hg-ann-ico) { vertical-align: middle !important; padding: 0 !important; width: 1px; white-space: nowrap; } #pgForm tr:has(.hg-ann-ico) td { vertical-align: middle !important; } #pgForm tr:has(.hg-ann-ico) td:has(a) { padding: 4px 0 4px 10px !important; } /* 子页面（非首页）标题上移 + 绿色下划线（与首页一致） */ #pgForm table.hg-page-card .hg-subtitle-td { padding: 0 0 4px !important; vertical-align: top; } #pgForm table.hg-page-card .hg-spacer-row { display: none !important; } #pgForm table.hg-page-card hr.hg-red-hr-hide { display: none !important; } #pgForm table.hg-page-card hr.hg-red-hr-green { border: 0 !important; height: 2px !important; background: var(--hg-primary) !important; color: var(--hg-primary) !important; } /* 用户条（登录后）— 按用户要求隐藏头像/ID/数字 */ [id$="_pnUser"] { display: none; } [id$="_ImageFile"] { display: none; } [id$="_lnkUser"] { display: none; } [id$="_btnEmail"] { display: none; } /* TreeView 菜单（登录后）— Donezo 风格 */ [id$="_treeJiongBoxMenus"] { display: block; } [id$="_treeJiongBoxMenus"] > table { width: 100%; margin: 2px 0; } #pgTool [id$="_treeJiongBoxMenus"] a[id], #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"] { display: flex; align-items: center; gap: 10px; width: 100%; box-sizing: border-box; padding: 11px 12px 11px 34px; border-radius: var(--hg-radius); color: var(--hg-muted); font-size: 14px; font-weight: 500; line-height: 1.35; transition: color .15s var(--hg-ease-standard), background .15s var(--hg-ease-standard), border-color .15s var(--hg-ease-standard); border-left: 3px solid transparent; min-width: 0; overflow: visible; text-overflow: unset; white-space: normal; } /* 菜单图标 — 单色线条（currentColor，随文字颜色自动变化：常态灰、hover 绿、选中白） */ #pgTool [id$="_treeJiongBoxMenus"] a[id]::before, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"]::before { content: ""; width: 19px; height: 19px; flex-shrink: 0; background-color: currentColor; -webkit-mask: var(--hg-ico) center / contain no-repeat; mask: var(--hg-ico) center / contain no-repeat; transition: background-color .15s var(--hg-ease-standard); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-home::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%209l9-7%209%207v11a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2z%27%2F%3E%3Cpath%20d%3D%27M9%2022V12h6v10%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-bolt::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M13%202L3%2014h9l-1%208%2010-12h-9z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-inbox::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M22%2012h-6l-2%203h-4l-2-3H2%27%2F%3E%3Cpath%20d%3D%27M5.45%205.11%202%2012v6a2%202%200%200%200%202%202h16a2%202%200%200%200%202-2v-6l-3.45-6.89A2%202%200%200%200%2016.76%204H7.24a2%202%200%200%200-1.79%201.11z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-bell::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M18%208A6%206%200%200%200%206%208c0%207-3%209-3%209h18s-3-2-3-9%27%2F%3E%3Cpath%20d%3D%27M13.73%2021a2%202%200%200%201-3.46%200%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-gift::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%2012v10H4V12%27%2F%3E%3Cpath%20d%3D%27M2%207h20v5H2z%27%2F%3E%3Cpath%20d%3D%27M12%2022V7%27%2F%3E%3Cpath%20d%3D%27M12%207H7.5a2.5%202.5%200%200%201%200-5C11%202%2012%207%2012%207z%27%2F%3E%3Cpath%20d%3D%27M12%207h4.5a2.5%202.5%200%200%200%200-5C13%202%2012%207%2012%207z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-box::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M16.5%209.4%207.55%204.24%27%2F%3E%3Cpath%20d%3D%27M21%2016V8a2%202%200%200%200-1-1.73l-7-4a2%202%200%200%200-2%200l-7%204A2%202%200%200%200%203%208v8a2%202%200%200%200%201%201.73l7%204a2%202%200%200%200%202%200l7-4A2%202%200%200%200%2021%2016z%27%2F%3E%3Cpath%20d%3D%27M3.27%206.96%2012%2012.01l8.73-5.05%27%2F%3E%3Cpath%20d%3D%27M12%2022.08V12%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-shop::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%202%203%206v14a2%202%200%200%200%202%202h14a2%202%200%200%200%202-2V6l-3-4z%27%2F%3E%3Cpath%20d%3D%27M3%206h18%27%2F%3E%3Cpath%20d%3D%27M16%2010a4%204%200%200%201-8%200%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-return::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2012a9%209%200%200%201%209-9%209.75%209.75%200%200%201%206.74%202.74L21%208%27%2F%3E%3Cpath%20d%3D%27M21%203v5h-5%27%2F%3E%3Cpath%20d%3D%27M21%2012a9%209%200%200%201-9%209%209.75%209.75%200%200%201-6.74-2.74L3%2016%27%2F%3E%3Cpath%20d%3D%27M3%2021v-5h5%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-card::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M1%204h22v16H1z%27%2F%3E%3Cpath%20d%3D%27M1%2010h22%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-money::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M21%2012V7H5a2%202%200%200%201%200-4h14a2%202%200%200%201%202%202v4%27%2F%3E%3Cpath%20d%3D%27M23%2018H5a2%202%200%200%201%200-4h16%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-headset::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M3%2018v-6a9%209%200%200%201%2018%200v6%27%2F%3E%3Cpath%20d%3D%27M21%2019a2%202%200%200%201-2%202h-1a2%202%200%200%201-2-2v-3a2%202%200%200%201%202-2h3z%27%2F%3E%3Cpath%20d%3D%27M3%2019a2%202%200%200%200%202%202h1a2%202%200%200%200%202-2v-3a2%202%200%200%200-2-2H3z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-mail::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%204h16c1.1%200%202%20.9%202%202v12c0%201.1-.9%202-2%202H4c-1.1%200-2-.9-2-2V6c0-1.1.9-2%202-2z%27%2F%3E%3Cpath%20d%3D%27M22%206l-10%207L2%206%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-tag::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20.59%2013.41%2013.42%2020.6a2%202%200%200%201-2.83%200L2%2012V2h10l8.59%208.59a2%202%200%200%201%200%202.82z%27%2F%3E%3Cpath%20d%3D%27M7%207h.01%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-chart::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M23%206l-9.5%209.5-5-5L1%2018%27%2F%3E%3Cpath%20d%3D%27M17%206h6v6%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-gear::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M19.4%2015a1.65%201.65%200%200%200%20.33%201.82l.06.06a2%202%200%201%201-2.83%202.83l-.06-.06a1.65%201.65%200%200%200-1.82-.33%201.65%201.65%200%200%200-1%201.51V21a2%202%200%200%201-4%200v-.09A1.65%201.65%200%200%200%209%2019.4a1.65%201.65%200%200%200-1.82.33l-.06.06a2%202%200%201%201-2.83-2.83l.06-.06a1.65%201.65%200%200%200%20.33-1.82%201.65%201.65%200%200%200-1.51-1H3a2%202%200%200%201%200-4h.09A1.65%201.65%200%200%200%204.6%209a1.65%201.65%200%200%200-.33-1.82l-.06-.06a2%202%200%201%201%202.83-2.83l.06.06a1.65%201.65%200%200%200%201.82.33H9a1.65%201.65%200%200%200%201-1.51V3a2%202%200%200%201%204%200v.09a1.65%201.65%200%200%200%201%201.51%201.65%201.65%200%200%200%201.82-.33l.06-.06a2%202%200%201%201%202.83%202.83l-.06.06a1.65%201.65%200%200%200-.33%201.82V9a1.65%201.65%200%200%200%201.51%201H21a2%202%200%200%201%200%204h-.09a1.65%201.65%200%200%200-1.51%201z%27%2F%3E%3Cpath%20d%3D%27M12%2015a3%203%200%201%200%200-6%203%203%200%200%200%200%206z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-user::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M20%2021v-2a4%204%200%200%200-4-4H8a4%204%200%200%200-4%204v2%27%2F%3E%3Cpath%20d%3D%27M12%2011a4%204%200%201%200%200-8%204%204%200%200%200%200%208z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-exit::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%2021H5a2%202%200%200%201-2-2V5a2%202%200%200%201%202-2h4%27%2F%3E%3Cpath%20d%3D%27M16%2017l5-5-5-5%27%2F%3E%3Cpath%20d%3D%27M21%2012H9%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-doc::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M14%202H6a2%202%200%200%200-2%202v16a2%202%200%200%200%202%202h12a2%202%200%200%200%202-2V8z%27%2F%3E%3Cpath%20d%3D%27M14%202v6h6%27%2F%3E%3Cpath%20d%3D%27M16%2013H8%27%2F%3E%3Cpath%20d%3D%27M16%2017H8%27%2F%3E%3Cpath%20d%3D%27M10%209H8%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-star::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M12%202%2015.09%208.26%2022%209.27%2017%2014.14%2018.18%2021.02%2012%2017.77%205.82%2021.02%207%2014.14%202%209.27%208.91%208.26z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-flag::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2015s1-1%204-1%205%202%208%202%204-1%204-1V3s-1%201-4%201-5-2-8-2-4%201-4%201z%27%2F%3E%3Cpath%20d%3D%27M4%2022v-7%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-book::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M4%2019.5A2.5%202.5%200%200%201%206.5%2017H20%27%2F%3E%3Cpath%20d%3D%27M6.5%202H20v20H6.5A2.5%202.0%200%200%201%204%2019.5v-15A2.5%202.5%200%200%201%206.5%202z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-camera::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M23%2019a2%202%200%200%201-2%202H3a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h4l2-3h6l2%203h4a2%202%200%200%201%202%202z%27%2F%3E%3Cpath%20d%3D%27M12%2017a4%204%200%201%200%200-8%204%204%200%200%200%200%208z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-music::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%2018V5l12-2v13%27%2F%3E%3Cpath%20d%3D%27M9%2018a3%203%200%201%201-6%200%203%203%200%200%201%206%200z%27%2F%3E%3Cpath%20d%3D%27M21%2016a3%203%200%201%201-6%200%203%203%200%200%201%206%200z%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-map::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M9%2018l-6-3v-13l6%203%206-3%206%203v13l-6-3-6%203z%27%2F%3E%3Cpath%20d%3D%27M9%209v13%27%2F%3E%3Cpath%20d%3D%27M15%2012v13%27%2F%3E%3C%2Fsvg%3E"); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-icon-cup::before { --hg-ico: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%20stroke%3D%27black%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%3E%3Cpath%20d%3D%27M6%209H4.5a2.5%202.5%200%200%201%200-5H6%27%2F%3E%3Cpath%20d%3D%27M18%209h1.5a2.5%202.5%200%200%200%200-5H18%27%2F%3E%3Cpath%20d%3D%27M6%202h12v7a6%206%200%200%201-12%200V2z%27%2F%3E%3Cpath%20d%3D%27M8%2022h8%27%2F%3E%3Cpath%20d%3D%27M12%2015v7%27%2F%3E%3C%2Fsvg%3E"); } /* 二级子菜单：全部统一为同一个实心小圆点（不使用各自不同的线形图标）。 覆盖上面通用 ::before 的 SVG mask，改为 currentColor 实心圆。 颜色随文字变化：常态灰、hover 绿、选中白（与一级图标一致）。 */ #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[id]::before, #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[class*="treeJiongBoxMenus_0"]::before { /* 2026-08-14 二级圆点最终布局（高特异性，压过任何其他规则）： ::before 绝对定位在 a 左 20px，6×6 实心圆，颜色 currentColor 跟随文字（常态灰、hover 绿、选中白）。 文字由下方 a 的 padding-left:44px 统一对齐，圆点↔文字间距 18px。 */ content: "" !important; position: absolute !important; left: 48px !important; top: 50% !important; width: 5px !important; height: 5px !important; margin-top: -2.5px !important; border-radius: 50% !important; background: currentColor !important; -webkit-mask: none !important; mask: none !important; } #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[id] img, #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[class*="treeJiongBoxMenus_0"] img { display: none !important; } #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[id], #pgTool [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[class*="treeJiongBoxMenus_0"] { display: block; text-align: left !important; padding: 9px 12px 9px 68px; /* 一级 padding-left:34px，二级 68px（缩进 34px） */ font-size: 13px; position: relative; background-image: none; /* 圆点由 ::before 绘制，禁止 background 圆点 */ } /* TreeView 展开/折叠切换链接（内含 tree_open/tree_close 图）： 文字链接本身即可触发展开，隐藏切换链接避免出现双图标 */ #pgTool [id$="_treeJiongBoxMenus"] a.hg-expander { display: none !important; width: 0 !important; height: 0 !important; padding: 0 !important; margin: 0 !important; } #pgTool [id$="_treeJiongBoxMenus"] a.hg-expander::before { content: none !important; } #pgTool [id$="_treeJiongBoxMenus"] td:has(> a.hg-expander) { width: 0 !important; padding: 0 !important; font-size: 0 !important; } /* 兜底：TreeView 展开/折叠切换链接即使没有 hg-expander 类（空文字、无子元素）也强制隐藏 */ #pgTool [id$="_treeJiongBoxMenus"] a[id]:empty, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"]:empty { display: none !important; width: 0 !important; height: 0 !important; } /* hover 状态 */ #pgTool [id$="_treeJiongBoxMenus"] a[id]:hover, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"]:hover { color: var(--hg-primary-deep) !important; border-left-color: var(--hg-primary); background-color: var(--hg-primary-soft) !important; } #pgTool [id$="_treeJiongBoxMenus"] a[id]:hover::before, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"]:hover::before { background-color: var(--hg-primary); } #pgTool [id$="_treeJiongBoxMenus"] a[id]:active, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"]:active { background-color: var(--hg-primary-pale) !important; } /* 当前选中项 — Donezo 绿色背景 */ #pgTool [id$="_treeJiongBoxMenus"] a[id].hg-active, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"].hg-active { background-color: var(--hg-primary) !important; color: #fff !important; border-left-color: var(--hg-primary-deep); } #pgTool [id$="_treeJiongBoxMenus"] a[id].hg-active:hover, #pgTool [id$="_treeJiongBoxMenus"] a[class*="treeJiongBoxMenus_0"].hg-active:hover { background-color: var(--hg-primary-deep) !important; color: #fff !important; border-left-color: var(--hg-primary-deep); } /* 彻底隐藏 TreeView 所有节点图标/展开折叠 img，统一用 ::before 单色 SVG 图标替代。 之前只隐藏了二级菜单 img 与 expander 内 img，导致一级叶子节点（我的账户/安全退出） 和 NoExpandImageUrl 默认图标（images/菜单图标.gif 绿色方块）始终显示。 */ #pgTool [id$="_treeJiongBoxMenus"] img { display: none !important; } [id$="_treeJiongBoxMenus"] a.hg-expander img { display: none !important; } [id$="_treeJiongBoxMenus"] a[href*="doPostBack"] img { display: none !important; } /* 父菜单箭头：始终在右侧，折叠=朝下，展开=朝上（二级菜单无箭头） */ #pgTool [id$="_treeJiongBoxMenus"] a.hg-parent { position: relative; padding-right: 36px; } #pgTool [id$="_treeJiongBoxMenus"] a.hg-parent::after { content: ""; position: absolute; right: 14px; top: 50%; width: 7px; height: 7px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: translateY(-65%) rotate(45deg); opacity: .55; transition: transform .2s var(--hg-ease-standard), border-color .2s var(--hg-ease-standard), opacity .2s var(--hg-ease-standard); pointer-events: none; } #pgTool [id$="_treeJiongBoxMenus"] a.hg-parent.hg-expanded::after { transform: translateY(-35%) rotate(225deg); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-parent:hover::after { opacity: 1; border-color: var(--hg-primary); } #pgTool [id$="_treeJiongBoxMenus"] a.hg-parent.hg-active::after { opacity: 1; border-color: #fff; } /* 子菜单：块级通栏，悬浮/选中反色覆盖整行（不再仅文字宽度）。 2026-08-14 此段为低特异性兜底（无 #pgTool 前缀），padding/位置以高特异性段为准； background 圆点已废弃（圆点由 ::before 绝对定位绘制），此处禁止 background-image。 */ [id$="_treeJiongBoxMenus"] div[id$="Nodes"] table { width: 100%; } [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[id], [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[class*="treeJiongBoxMenus_0"] { display: block; text-align: left !important; width: 100%; box-sizing: border-box; padding: 9px 12px 9px 68px; color: var(--hg-muted); font-size: 13px; font-weight: 500; background-image: none !important; /* 禁止 background 圆点，统一由 ::before 绘制 */ } [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[id]:hover, [id$="_treeJiongBoxMenus"] div[id$="Nodes"] a[class*="treeJiongBoxMenus_0"]:hover { color: var(--hg-primary-deep) !important; background-color: var(--hg-primary-soft) !important; } /* 登录框 — 不依赖固定 ID 前缀 */ [id$="_edtUserName"], [id$="_edtPasswrd"] { width: 100% !important; max-width: 220px; padding: 11px 14px; font-size: 14px; color: var(--hg-ink); background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); outline: none; transition: border-color .2s var(--hg-ease-standard), box-shadow .2s var(--hg-ease-standard); margin-bottom: 10px; } [id$="_edtUserName"]:focus, [id$="_edtPasswrd"]:focus { border-color: var(--hg-primary) !important; box-shadow: 0 0 0 3px var(--hg-primary-pale) !important; } [id$="_chkCookie"] { accent-color: var(--hg-primary); width: 16px; height: 16px; } [id$="_btnEnter"], [id$="_btnGetPasswrd"], [id$="_btnReg"] { height: 34px; width: auto; border-radius: var(--hg-radius); transition: transform .15s var(--hg-ease-standard), box-shadow .15s var(--hg-ease-standard); cursor: pointer; } [id$="_btnGetPasswrd"]:hover, [id$="_btnReg"]:hover { transform: translateY(-1px); box-shadow: var(--hg-shadow-sm); } /* [id$="_btnEnter"] 已从上方 hover 规则移除（原 translateY(-1px) 让全站所有提交按钮 hover 时上移 1px， 与选择文件等按钮 hover 只变背景的行为不一致，2026-08-10 用户反馈） */ /* 原 [id$="_btnEnter"] { filter: hue-rotate(-10deg) saturate(1.1); } 滤镜导致提交按钮颜色与选择文件不一致（2026-08-10 用户反馈），删除 */ /* 验证器提示 */ [id$="_RequiredFieldValidator1"], [id$="_RequiredFieldValidator2"], [id$="_ValidationSummary1"] { color: var(--hg-danger); font-size: 12px; } /* 主内容区 — Donezo 风格 */ #pgForm { padding: 0 0 0 24px; background: transparent; vertical-align: top; line-height: 0; /* 2026-09-02 消除 #pgForm 顶部 22px 经典 BOM gap：#pgForm 是 ，继承 body line-height:1.55(=21.7px)，首子文本节点 "\ufeff\n\n" 撑出 22px 空隙使卡片标题比左侧菜单项下沉 22px。 ⚠️ 子元素（tr/td/.hg-page-title/.hg-filter-* 等）必须各自显式 声明 line-height，否则会坍塌（销售查询 GridView 已踩坑）。 */ } /* 兜底：表格行/单元格显式恢复行高，避免继承 #pgForm line-height:0 后整张表坍塌 */ #pgForm table tr, #pgForm table th, #pgForm table td { line-height: 1.55; } #pgForm .hg-page-title { line-height: 26px; } #pgForm .hg-filter-label, #pgForm .hg-filter-btn { line-height: 1.55; } /* 2026-09-12 参与盒主范围回显（满额促销「已选盒主」）；块级文字必须显式 line-height，防继承 line-height:0 坍塌重叠 */ #pgForm .hg-boxer-scope { font-size: 13px; line-height: 1.7; font-weight: 600; color: var(--hg-primary-deep); } /* 2026-09-03 POS 端兜底（修复在线收银 KPI 值/标签/TOP10 行/收款区 label 因继承 line-height:0 坍塌叠在一行） */ #pgForm .hg-pos-kpi > div, #pgForm .hg-pos-kpi b, #pgForm .hg-pos-kpi span, #pgForm .hg-pos-mhead, #pgForm .hg-pos-mname, #pgForm .hg-pos-mbadge, #pgForm .hg-pos-mphone, #pgForm .hg-pos-mmeta, #pgForm .hg-pos-coupon, #pgForm .hg-pos-coupon > span, #pgForm .hg-pos-coupon > b, #pgForm .hg-pos-coupon-link, #pgForm .hg-pos-coupon-sel, #pgForm .hg-pos-coupon-sel .lbl, #pgForm .hg-pos-coupon-sel .val, #pgForm .hg-pos-refund, #pgForm .hg-pos-refund .hg-filter-label, #pgForm .hg-pos-refcheck, #pgForm .hg-pos-tags, #pgForm .hg-pos-topbuy, #pgForm .hg-pos-topbuy-hd, #pgForm .hg-pos-topbuy-hd > i, #pgForm .hg-pos-topbuy li, #pgForm .hg-pos-topbuy .rank, #pgForm .hg-pos-topbuy .nm, #pgForm .hg-pos-topbuy .cnt, #pgForm .hg-pos-tender, #pgForm .hg-pos-tender .hg-tender-cell, #pgForm .hg-pos-tender .hg-tender-cell > span { line-height: 1.45; } #pgForm > table { width: 100%; } #pgForm > table > tbody > tr > td:first-child { padding-right: 24px; } #pgForm > table > tbody > tr > td:first-child > table { width: 100%; background: var(--hg-surface); border: 0; border-radius: var(--hg-radius-xl); padding: 22px 24px; margin-bottom: 20px; box-shadow: var(--hg-shadow-md); transition: box-shadow .2s var(--hg-ease-standard); } /* 钱包查询卡片不需要阴影（自己有轻框样式） */ #pgForm table.hg-accquery { box-shadow: none !important; } /* 子页面（非首页）右侧内容统一包裹为圆角卡片，与首页分区卡片风格一致 */ #pgForm > table.hg-page-card { width: 100%; background: var(--hg-surface); border: 0; border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-md); padding: 22px 24px; margin-bottom: 20px; } #pgForm > table > tbody > tr > td:first-child > table:hover { box-shadow: var(--hg-shadow-lg); } #pgForm > table > tbody > tr > td:first-child > table tr:first-child img { display: block; margin-bottom: 16px; } #pgForm a[href*="wcJour"] { display: inline-flex; align-items: center; gap: 6px; color: var(--hg-ink); font-size: 14px; padding: 5px 0; transition: color .15s var(--hg-ease-standard); } #pgForm a[href*="wcJour"]:hover { color: var(--hg-primary) !important; } #pgForm font { color: var(--hg-primary) !important; } #pgForm td { font-size: 14px; color: var(--hg-ink); padding: 6px 8px; } #pgForm b { font-weight: 600; } #pgForm div[style*="dotted"] { border-top-color: var(--hg-border) !important; } #pgForm > table > tbody > tr > td:last-child { vertical-align: top; } /* 仅首页右侧两个 iframe（销售直播 wcSaleHots / 我的钱包 wcAcc）走此卡片化样式。 注意：绝不能用裸 “#pgForm iframe”——编辑对话框（活动/公告等）里的 FreeTextBox 富文本编辑器本身就是一个 iframe，也注入在 #pgForm 内，会被误伤成无边框白底方块， 导致“看不到文本框”。故此处必须按 src 精确限定。 */ #pgForm iframe[src*="wcSaleHots"], #pgForm iframe[src*="wcAcc"] { width: 240px; max-width: 100%; height: 280px; border: 0; border-radius: var(--hg-radius-xl); display: block; margin-bottom: 16px; background: var(--hg-surface); box-shadow: var(--hg-shadow-md); } /* 首页新三栏布局：最新公告 / 销售直播 / 我的钱包 一行三等分，占满右侧；最新销售整行 */ .hg-home { display: flex; flex-direction: column; gap: 12px; } .hg-home-row { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: stretch; } .hg-col { background: var(--hg-surface); border: 0; border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-md); padding: 22px 24px; min-width: 0; display: flex; flex-direction: column; } /* 懒加载列：初始隐藏（保留布局空间），数字看板渲染后显示 */ .hg-col-lazy { visibility: hidden; } .hg-col > table { background: transparent !important; box-shadow: none !important; border: 0 !important; padding: 0 !important; margin: 0 !important; } /* 裸列：去掉卡片背景/阴影/圆角/内边距，内容自行控制外观（如钱包 iframe） */ .hg-col-naked { background:transparent !important; box-shadow:none !important; border-radius:0 !important; padding:0 !important; } /* 列内的 iframe 填满卡片，去掉自身圆角/阴影（由 .hg-col 提供外观），标题位置与文字卡片一致 */ .hg-col iframe { width: 100% !important; flex: none; min-height: 280px; height: 280px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; display: block; margin: 0 !important; } /* 首页四栏内容文字统一：同源字体栈、相同字号（与 iframe 内 13px 一致） */ .hg-col, .hg-col td, .hg-col a { font-size: 13px; } .hg-col a[href*="wcJour"] { font-size: 13px !important; } /* 右侧列：数字看板在上、我的钱包在下，竖向堆叠。 2026-08-28 收窄作用域为 .hg-home（首页专用）：原裸写 .hg-col-right 会命中 GridView 合计金额 th（类 hg-col-right hg-col-amt）→ th 被强制 display:flex + min-width:0， fixed 布局列宽计算被破坏 → 零售单查询桌面列不等比放大、右侧留白 525px（用户 01:25 反馈）。 */ .hg-home .hg-col-right { display: flex; flex-direction: column; gap: 12px; min-width: 0; } /* 店铺目标 · 数字看板 */ .hg-shopplan { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius-xl); box-shadow: var(--hg-shadow-md); padding: 20px 22px; } .hg-shopplan-raw { font-size: 13px; color: var(--hg-muted); line-height: 1.9; padding: 18px 20px; } .hg-shopplan-head { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; margin-bottom: 14px; } .hg-shopplan-name { font-size: 18px; font-weight: 700; color: var(--hg-ink); } .hg-shopplan-date { font-size: 13px; color: var(--hg-faint); } .hg-shopplan-section { font-size: 13px; font-weight: 600; color: var(--hg-primary); margin: 6px 0 10px; letter-spacing: .02em; } .hg-shopplan-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; } .hg-kpi { background: var(--hg-canvas); border: 1px solid var(--hg-border-light); border-radius: var(--hg-radius); padding: 12px 8px; text-align: center; } .hg-kpi-label { font-size: 13px; color: var(--hg-muted); line-height: 1.4; margin-bottom: 6px; } .hg-kpi-value { font-size: 20px; font-weight: 400; color: var(--hg-ink); font-variant-numeric: tabular-nums; } .hg-kpi-note { font-size: 13px; color: var(--hg-muted); margin-top: 4px; } .hg-kpi-accent { background: var(--hg-primary-soft); border-color: var(--hg-primary-light); } .hg-kpi-accent .hg-kpi-value { color: var(--hg-primary-deep); } .hg-kpi-accent .hg-kpi-note { color: var(--hg-primary); font-weight: 600; } /* KPI 数字看板：置于三列上方、单独一行、横向铺满。 注意：间距统一由父级 .hg-home 的 flex gap 控制，此处不能再设 margin-bottom， 否则 KPI→三栏 会比 三栏→最新销售 多出一截，造成两段间距不一致。 */ .hg-kpi-row { width: 100%; margin-bottom: 0; } .hg-kpi-row .hg-shopplan { margin: 0; } /* 2026-08-17 总部经营看板（wcBoxerHQ.ascx）：外层不再用 .hg-content-card（去掉"中间那层"大白底卡）， 只保留 .hg-kpi-card-wrap 的 padding 30/24/24/30 给"经营看板"标题顶部留白； 下面 18 个 KPI（今日/会员/本月 各 6 个）每张用独立 .hg-kpi 白底卡包起来（默认样式，不覆盖）。 */ .hg-kpi-card-wrap { padding: 30px 24px 24px 30px !important; margin-bottom: 16px; } /* 正式盒主首页销售看板（VI 设计手册卡片语言）： 白底卡片、圆角 12px、边框 #E5E7EB、轻阴影；标签 VI 灰 #6B7280； 数值深墨 tabular-nums；变化行涨绿跌红（涨=绿字浅绿底 / 跌=红字浅红底）； hover 浅绿阴影微浮起。作用域限定 .hg-sales-kpi，不影响 shopplan 等其它 hg-kpi 组件； 间距由父级 .hg-home 的 flex gap 控制，此处不设 margin-bottom。 */ /* 2026-08-17 经营看板 KPI 区域：响应式网格——宽屏 6 列，随浏览器宽度递减为 3/2/1 列。 每个 KPI 独立白底卡片。 */ .hg-kpi-grid.hg-sales-kpi { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; width: 100%; } /* 平板：一行 3 个 */ @media (max-width: 1024px) { .hg-kpi-grid.hg-sales-kpi { grid-template-columns: repeat(3, minmax(0, 1fr)); } } /* 手机（竖屏/横屏）：一行 2 个（2026-08-22 用户要求手机端也分列显示，不再 1 列占满整行） */ @media (max-width: 640px) { .hg-kpi-grid.hg-sales-kpi { grid-template-columns: repeat(2, minmax(0, 1fr)); } } .hg-sales-kpi .hg-kpi { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); padding: 14px 10px; text-align: center; box-shadow: 0 1px 2px rgba(17, 24, 39, .04); transition: box-shadow .18s ease, transform .18s ease; } .hg-sales-kpi .hg-kpi:hover { box-shadow: 0 8px 24px rgba(0, 102, 204, .14); transform: translateY(-2px); } .hg-sales-kpi .hg-kpi-label { font-size: 13px; font-weight: 500; color: var(--hg-muted); text-transform: none; letter-spacing: 0; margin-bottom: 8px; text-align: center; } .hg-sales-kpi .hg-kpi-value { font-size: 26px; font-weight: 400; color: var(--hg-ink); font-variant-numeric: tabular-nums; letter-spacing: -.01em; line-height: 1.25; } .hg-sales-kpi .hg-kpi-change { font-size: 12px; font-weight: 600; margin-top: 10px; display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: var(--hg-radius-full); line-height: 1.6; } .hg-sales-kpi .hg-kpi-change.up { color: var(--hg-primary-deep); background: var(--hg-primary-soft); } .hg-sales-kpi .hg-kpi-change.down { color: #DC2626; background: #FEF2F2; } /* 移动端：字体/间距微调（列数由上方 6→3→2→1 响应式规则控制，2026-08-17 移除旧的强制单列） */ @media (max-width: 768px) { .hg-sales-kpi .hg-kpi { padding: 12px 14px; } .hg-sales-kpi .hg-kpi-value { font-size: 22px; } .hg-sales-kpi .hg-kpi-label { font-size: 12px; } .hg-sales-kpi .hg-kpi-change { font-size: 11px; padding: 1px 7px; } } /* 最新销售表格：表头居中+浅灰底；文本列（商品名称/店铺/销量/销售日期）内容居中； 金额列（单价/销售额/提成后收入）标题居中、金额右对齐；列宽随浏览器自适应； 行间隔仅一条黑色线；无横向滚动条 */ .hg-sales, .hg-col.hg-sales { overflow-x: hidden; } .hg-sales table { width: 100%; border-collapse: collapse; table-layout: auto; } #pgForm .hg-sales table th, #pgForm .hg-sales table td { padding: 10px 12px; font-size: 13px; border-bottom: 1px solid #E6E8EB; white-space: normal; overflow-wrap: anywhere; } /* 列间竖线分隔（与行分隔线同色 #E6E8EB）；最右列不加竖线避免悬空（首页卡片无外边框） */ #pgForm .hg-sales table th:not(:last-child), #pgForm .hg-sales table td:not(:last-child) { border-right: 1px solid #E6E8EB; } /* 表头行（VI 手册之外的表格样式）：浅灰底、标题居中、文字同钱包灰；灰底只落表头，不波及数据行 */ #pgForm .hg-sales table thead th, #pgForm .hg-sales table tbody tr:first-child > th { font-weight: 700; text-align: center; background: #f3f4f6; color: var(--hg-muted); } #pgForm .hg-sales table td { color: var(--hg-muted); text-align: left; } /* 金额列（单价/销售额/提成后收入）右对齐、销量居中；列宽随浏览器自适应，无横向滚动条 */ #pgForm .hg-sales table td:nth-child(3) { text-align: center; } #pgForm .hg-sales table td:nth-child(4), #pgForm .hg-sales table td:nth-child(5), #pgForm .hg-sales table td:nth-child(6) { text-align: right; } #pgForm .hg-sales table tbody tr:last-child td { border-bottom: 0; } /* 首页「最新销售」表格：与报表页表格一致，整表圆角 + 隐藏溢出，使灰表头四角圆润 （border-collapse 必须是 separate，collapse 会让 border-radius 失效） */ #pgForm .hg-wallet-mod .hg-sales table { border-collapse: separate; border-spacing: 0; border-radius: var(--hg-radius); overflow: hidden; } /* 原模板自带的虚线分隔行：隐藏，避免与分隔线叠加成双线 */ .hg-sales table tr:has(div[style*="dotted"]) > td { border: 0 !important; padding: 0 !important; } .hg-sales table tr:has(div[style*="dotted"]) div[style*="dotted"] { display: none !important; } .hg-sales table td:nth-child(1), .hg-sales table td:nth-child(2), .hg-sales table td:nth-child(3), .hg-sales table td:nth-child(7) { text-align: center; } .hg-sales table td:nth-child(4), .hg-sales table td:nth-child(5), .hg-sales table td:nth-child(6) { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap !important; overflow-wrap: normal; } /* 鼠标悬停行反色 */ .hg-sales table tr:not(:first-child):not(:nth-child(2)):hover > td { background: var(--hg-primary); color: #ffffff !important; } .hg-sales table tr:not(:first-child):not(:nth-child(2)):hover > td a { color: #ffffff !important; } .hg-sales table tr:not(:first-child):not(:nth-child(2)):hover > td .hg-amt-dec { color: #ffffff !important; } /* 金额拆行：默认整段一行；窄屏下整数一行、小数点及分数另起一行，各自均不换行 */ .hg-sales table td .hg-amt-int, .hg-sales table td .hg-amt-dec { white-space: nowrap; } .hg-sales table td .hg-amt-dec { color: #6b7280; } /* 首页「最新公告 / 最新销售」模块：复用「我的钱包」(forms/wcAcc) 的绿色主题。 全部使用站点既有变量（= 我的钱包 实际使用的颜色），不新增任何硬编码色值： 标题绿 = --hg-primary-deep (#0052A3，与我的钱包标题一致) 下划线/链接绿 = --hg-primary (#0066CC，与我的钱包链接/下划线一致) 卡片白底 = --hg-surface (#FFFFFF) 描边 = --hg-border (#E5E7EB，≈ 我的钱包 #E6E8EB) 正文 = --hg-secondary-light (#374151) 次级文字 = --hg-muted (#6B7280) 标题字 = --hg-ink (#111827) */ .hg-wallet-mod { background: var(--hg-surface); border: 1px solid var(--hg-border); border-radius: var(--hg-radius); box-shadow: var(--hg-shadow-sm); padding: 18px 20px 20px; margin: 0 0 12px; } .hg-wallet-mod > tbody > tr:first-child td { padding-top: 0; padding-left: 0; } .hg-wallet-title { display: inline-block; font-size: 20px; font-weight: 700; color: var(--hg-primary-deep); letter-spacing: -.01em; margin: 0 0 12px; padding-bottom: 8px; border-bottom: 2px solid var(--hg-primary); } /* 首页卡片标题去掉绿色下划线：VI 手册外表格不应在表头上方出现分隔线，与报表页一致 */ .hg-wallet-mod .hg-wallet-title { border-bottom: 0; padding-bottom: 0; } .hg-wallet-mod, .hg-wallet-mod td { color: var(--hg-secondary-light); font-size: 13px; line-height: 1.9; } .hg-wallet-mod a { color: var(--hg-primary); text-decoration: none; } .hg-wallet-mod a:hover { color: var(--hg-primary-deep); text-decoration: underline; } /* 销售查询 GridView 表格：与首页“最新销售”表格完全一致 注：本表位于 #pgForm 内，#pgForm td 默认规则会覆盖普通选择器，故全部加 #pgForm 前缀以保证优先级 */ #pgForm .hg-table-scroll { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; } /* 销售查询 — 筛选栏（干净筛选条：浅灰底、大圆角、标签左置） 关键属性全部 !important：原生
/  间隙；只有当前页（直接子 ）高亮为绿色。 */ #pgForm .hg-sales-grid .hg-pager-wrap { display: flex; flex-wrap: nowrap; overflow-x: auto; max-width: 100%; justify-content: center; align-items: center; width: 100%; gap: 4px; } #pgForm .hg-sales-grid .hg-pager-wrap > a, #pgForm .hg-sales-grid .hg-pager-wrap > span { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; padding: 6px 8px; border-radius: var(--hg-radius-sm); text-align: center; text-decoration: none; background: #f3f4f6; color: var(--hg-muted); font-weight: 400; white-space: nowrap; cursor: pointer; } #pgForm .hg-sales-grid .hg-pager-wrap > a:hover, #pgForm .hg-sales-grid .hg-pager-wrap > .hg-pg-link:hover { background: var(--hg-primary); color: #ffffff; } /* 当前页：JS 显式打 .hg-pg-current（服务端把“当前页”渲染成无链接的 时）。 只有它染主色，不再“所有 span 都绿”，避免把被误渲染成 的其它页码也染绿。 */ #pgForm .hg-sales-grid .hg-pager-wrap > .hg-pg-current { background: var(--hg-primary); color: #ffffff; cursor: default; } /* 禁用导航（« » … 等）：灰色、不可点、淡化 */ #pgForm .hg-sales-grid .hg-pager-wrap > .hg-pg-disabled { background: transparent; color: var(--hg-muted); cursor: default; opacity: .45; } /* 链接内嵌套的 span 不继承高亮 */ #pgForm .hg-sales-grid .hg-pager-wrap > .hg-pg-link span, #pgForm .hg-sales-grid .hg-pager-wrap > a span { background: transparent; color: inherit; } /* 页脚（由 wcBar.ascx 输出 .hg-footer） 页脚 td 为 colspan=2，跨过左侧菜单列，宽度=侧边栏+内容区之和（与上方全部栏同宽）； 桌面/手机均保留圆角 */ .hg-shell > tbody > tr:last-child td { padding: 0; } .hg-shell > tbody > tr:last-child td .hg-footer { border-radius: var(--hg-radius-xl); margin-top: 24px; } /* ====== 响应式 ====== */ /* 中等屏：三栏仍等比缩小（grid minmax 已处理）；更窄时堆叠为三行 */ @media (max-width: 1024px) { .hg-shell { max-width: 100%; margin-top: 16px; } } /* 老布局根表格（table.hg-legacy-filter）撑满右侧面板：统一由全局 #pgForm > table { width:100% }（上方 L1118） 负责，各页无需重复声明（2026-08-13 清理：原 putprodquery/myprod/downqk 三条 width:100% 均被全局覆盖属冗余， 其中 putprodquery 已改 div 卡片布局、table 规则为死代码；专属类名保留，仅作页面专属覆盖的作用域锚点）。 */ /* 窄屏：首页三栏纵向堆叠为三行 */ @media (max-width: 880px) { .hg-home-row { grid-template-columns: 1fr; } } /* 2026-08-15 销售查询（wcSaleQuery 等 .hg-rpt-page 报表根 table）： 桌面端同样需要 width:100% + table-layout:fixed + display:table， 否则外层 table 默认 width:auto 会被内部 GridView（带 border+border-radius）撑宽， 视觉上"表格跑出 .hg-content-card 白底卡片"（之前只有 @media 768 内的规则，桌面端不生效） */ #pgForm > div.hg-content-card > table.hg-rpt-page, #pgForm > div.hg-content-card > table.hg-boxsale-page { display: table !important; table-layout: fixed !important; width: 100% !important; } #pgForm > div.hg-content-card > table.hg-rpt-page > tbody, #pgForm > div.hg-content-card > table.hg-boxsale-page > tbody { display: table-row-group !important; } #pgForm > div.hg-content-card > table.hg-rpt-page > tbody > tr, #pgForm > div.hg-content-card > table.hg-boxsale-page > tbody > tr { display: table-row !important; } #pgForm > div.hg-content-card > table.hg-rpt-page > tbody > tr > td, #pgForm > div.hg-content-card > table.hg-boxsale-page > tbody > tr > td { display: table-cell !important; width: 100% !important; } /* ============================================================ 中等屏（769~1024px）：左侧菜单折叠为汉堡抽屉，表格占满内容区 （原 768 断点的抽屉机制上移到 1024，解决中等屏表格被 240px 菜单列挤压； 2026-08-21，配合 default.aspx JS isMobile 判断 768→1024） ============================================================ */ @media (max-width: 1024px) { .hg-menu-toggle { display: block; } /* 2026-08-21 中等屏/移动端内容贴边：覆盖全局 #pgForm padding-left:24px（移动段另有完整 padding 声明，源序在后，需各自改 left） */ #pgForm { padding-left: 0; } /* 顶栏高于遮罩(200)与展开菜单(210)，保证汉堡按钮始终可点 */ .hg-topbar { z-index: 250; } /* 解除 pgTool 列 240px 锁定：内容区占满全宽（table-layout:fixed 下 width/min/max 全清） 2026-08-21 修复：选择器收紧到 tr:first-child（只针对菜单行的第一 td 折叠为 0 宽）； 原 tr > td:first-child 会误伤每个 tr 的第一 td（包括页脚 tr 的合并 td=0 宽→页脚容器被挤成内容宽、链接每字一行竖排） */ .hg-shell > tbody > tr:first-child > td:first-child { width: 0 !important; min-width: 0 !important; max-width: 0 !important; padding: 0 !important; } /* 修复 Edge 的 fixed 列分配 bug：td1 置 0 后 td2 只分到 50% 空间，显式 width:100% 让内容区真正占满 */ .hg-shell > tbody > tr > td:nth-child(2) { width: 100%; } /* 2026-08-27 用户截 955 视口：登录态下第一列 td 被某段（hg-prelogin fallback 或 line:870 var(--hg-sidebar-w)=240px 残留） 挤成 ~50% 宽度，内容卡片视觉偏左、表格列被严重压缩（销售金额 ¥92.00 断成两行）。 这里防御式加固第二列 td：用 !important 三件套（width:100% + min-width:0 + max-width:100%）覆盖任何残留 的 table-cell 宽度限制（包括 prelogin fallback / InProc session 失效回退 / devtools 视口元数据异常）。 保留 display:table-cell 与 hg-shell 桌列布局兼容——display:block 会破坏桌列布局，仅用三件套足以撬开父锁。 */ .hg-shell > tbody > tr:first-child > td:nth-child(2) { width: 100% !important; min-width: 0 !important; max-width: 100% !important; } #pgTool { position: fixed; top: var(--hg-topbar-h); left: 0; bottom: 0; width: 82% !important; max-width: 300px !important; background: var(--hg-surface); overflow: auto; z-index: 90; padding: 16px; border-right: 1px solid var(--hg-border); transform: translateX(-105%); transition: transform .3s var(--hg-ease-standard); box-shadow: var(--hg-shadow-lg); border-radius: 0; } #pgTool.hg-open { transform: translateX(0); z-index: 210; } /* 未登录（中等屏/移动）：登录表单流式显示，不弹遮罩、不自动展开抽屉。 同时必须恢复 td 宽度（上面 width:0 会把登录表单容器也压成 0）。 2026-08-27 修复：原 width:100% !important + line:1772 第二列 width:100% 在 table-layout:fixed 下被等分 50/50 → 内容卡片视觉偏左 ~50%。 改为 display:block 让第一列 td 脱离 table 列分配、流式占第一行； 第二列 td 保持 table-cell + line:1772 width:100% 占第二行（即登录表单下方的内容区）。 同时把登录表单外的 #pgTool 实际内容走 transform/width=0 隐藏，仅靠 #pgForm 内的 fallback 登录表单（如果存在）兜底—— 实测 default.aspx JS 在 isMobile && prelogin 时把登录表单直接挂在第一列 td 内显示（见 default.aspx:124-134）， 该容器由 prelogin 段靠边沿：position:static 不再 fixed、box-shadow 清掉。 */ /* 同时把第二列 td 折叠为 0（原 line:1772 width:100% 让 login/prelogin 都走 100%，与 prelogin 第一列 100% 在 table-layout:fixed 下被等分 50/50、内容卡片视觉偏左 ~50%。prelogin 时第二列没内容可显，干脆隐藏）。 */ body.hg-prelogin .hg-shell > tbody > tr > td:nth-child(2) { display: none !important; } body.hg-prelogin .hg-shell > tbody > tr:first-child > td:first-child { width: 100% !important; min-width: 0 !important; max-width: 100% !important; padding: 0 !important; } body.hg-prelogin .hg-menu-toggle { display: none; } /* 把 prelogin #pgTool 全部加 !important（覆盖通用段 line:1773 max-width:300px !important）。 */ body.hg-prelogin #pgTool { position: static !important; transform: none !important; width: 100% !important; max-width: 100% !important; z-index: auto !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; border-right: 0 !important; } } /* 2026-08-28 移动端未登录页也展示轮播广告： 上面 prelogin 段把第二列（#pgForm）整体隐藏了（移动端只留登录框），轮播会一起看不见。 这里让第二列以 block 流式出现在登录框下方（display:block 可避开 table-layout:fixed 的 50/50 等分问题）， 并继续隐藏里面的公告表格，保持原有「移动端未登录只给登录框」的体验，只是多一张广告图。 */ @media (max-width: 1024px) { /* 769~1024 区间 .hg-shell 仍是 display:table，td 直接改 block 会塌成 0 宽； 所以把 shell/tbody/tr 一并流式化，两列 td 都变块级上下排列（登录框在上、轮播在下）。 仅对 body.hg-prelogin（未登录）生效，不影响已登录后的任何布局。 */ body.hg-prelogin .hg-shell, body.hg-prelogin .hg-shell > tbody, body.hg-prelogin .hg-shell > tbody > tr { display: block !important; width: 100% !important; } /* 必须用与上面 prelogin 段【相同】的 :nth-child 选择器：那条是 (0,3,4) 且带 !important， 若这里写成 td（(0,2,4)）特异度更低，会被它的 display:none 反向覆盖。同特异度 + 源序靠后才生效。 */ body.hg-prelogin .hg-shell > tbody > tr > td:nth-child(1), body.hg-prelogin .hg-shell > tbody > tr > td:nth-child(2) { display: block !important; width: 100% !important; min-width: 0 !important; max-width: 100% !important; padding: 0 !important; } /* 2026-08-29 轮播已移进这张 table（作为 .hg-banner-row），不能再整表隐藏， 否则移动端轮播也会消失；改为只隐藏公告行，保留轮播行。 */ body.hg-prelogin #pgForm > table > tbody > tr:not(.hg-banner-row) { display: none; } } @media (max-width: 768px) { .hg-menu-toggle { display: block; } /* 移动端：顶栏必须高于遮罩(200)，否则汉堡按钮被遮罩盖住、菜单展开后无法再次点击收起。 同时高于展开后的侧边菜单(210)，保证顶栏始终可点。低于公告弹窗(300)不受影响。 */ .hg-topbar { z-index: 250; } .hg-sales table td .hg-amt-int, .hg-sales table td .hg-amt-dec { display: block; } .hg-shell, .hg-shell > tbody, .hg-shell > tbody > tr, .hg-shell > tbody > tr > td { display: block; width: 100% !important; } /* 防报表表格撑破整页：table→block 后 width:auto 会取内容 min-width 而超出视口， 连带把站点页脚（关于我们等 colspan=2 的 td）一起撑宽、视觉错位到表格上方。 强制 shell 占满视口；报表根卡片 table-layout:fixed 不随内容撑开； 表格横向滚动仍由内部 .hg-table-scroll(overflow-x:auto) 处理。 */ .hg-shell { width: 100% !important; } #pgForm { min-width: 0; } #pgForm > table.hg-page-card { table-layout: fixed; width: 100% !important; } /* 页脚 td(colspan=2) 也是其所在行的 :first-child，需解除侧边栏 260px 的 min/max 锁定，才能占满整宽 */ .hg-shell > tbody > tr > td:first-child { min-width: 0 !important; max-width: 100% !important; } #pgTool { position: fixed; top: var(--hg-topbar-h); left: 0; bottom: 0; width: 82% !important; max-width: 300px !important; background: var(--hg-surface); overflow: auto; z-index: 90; padding: 16px; border-right: 1px solid var(--hg-border); transform: translateX(-105%); transition: transform .3s var(--hg-ease-standard); box-shadow: var(--hg-shadow-lg); border-radius: 0; } #pgTool.hg-open { transform: translateX(0); z-index: 210; } /* 未登录（移动端）：登录表单直接流式显示，不弹灰色遮罩、不自动展开抽屉。 body.hg-prelogin 由 default.aspx 在未检测到登录态时添加。 */ body.hg-prelogin .hg-menu-toggle { display: none; } /* 把 prelogin #pgTool 全部加 !important（覆盖通用段 line:1773 max-width:300px !important）。 */ body.hg-prelogin #pgTool { position: static !important; transform: none !important; width: 100% !important; max-width: 100% !important; z-index: auto !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; border-right: 0 !important; } /* 移动端遮罩 #mask 的 z-index=200；展开菜单必须高于它，否则遮罩的半透明黑底压在菜单上 （视觉灰显）并拦截点击（菜单项点不动）。菜单置于遮罩之上、顶栏之下(250)。 */ #pgForm { padding: 16px 0 0 0; } #pgForm > table > tbody > tr > td:first-child { padding-right: 0; } #pgForm > table, #pgForm > table > tbody, #pgForm > table > tbody > tr, #pgForm > table > tbody > tr > td { display: block; width: 100% !important; } /* 报表页根 table：移动端恢复 table 布局，避免被上面 #pgForm > table{display:block} 破坏 table-layout:fixed，导致整页横向溢出、站点页脚(colspan=2)上浮到报表上方。 仅作用于带 .hg-rpt-page / .hg-boxsale-page 的报表根 table，首页等其它页面不受影响。 */ #pgForm > table.hg-rpt-page, #pgForm > table.hg-boxsale-page, /* 2026-08-13 销售查询外包 .hg-content-card 后根 table 不再直接子元素，需额外匹配 */ #pgForm > div.hg-content-card > table.hg-rpt-page { display: table !important; table-layout: fixed !important; width: 100% !important; } #pgForm > table.hg-rpt-page > tbody, #pgForm > table.hg-boxsale-page > tbody, #pgForm > div.hg-content-card > table.hg-rpt-page > tbody { display: table-row-group !important; } #pgForm > table.hg-rpt-page > tbody > tr, #pgForm > table.hg-boxsale-page > tbody > tr, #pgForm > div.hg-content-card > table.hg-rpt-page > tbody > tr { display: table-row !important; } #pgForm > table.hg-rpt-page > tbody > tr > td, #pgForm > table.hg-boxsale-page > tbody > tr > td, #pgForm > div.hg-content-card > table.hg-rpt-page > tbody > tr > td { display: table-cell !important; width: 100% !important; } /* 首页嵌套表（公告/最新销售）在窄屏强制 fixed+100%，防止 7 列表把整页撑宽、连带页脚(colspan=2)错位到上方； 报表页的 GridView 是 .hg-sales-grid，已用 :not() 排除，不受影响 */ #pgForm td > table:not(.hg-sales-grid) { table-layout: fixed; width: 100% !important; } .hg-col { display: block; } .hg-col iframe { flex: none; height: 320px !important; } [id$="_edtUserName"], [id$="_edtPasswrd"] { max-width: 100%; } .hg-shell > tbody > tr:last-child td { padding-left: 0; } .hg-shell > tbody > tr:last-child td .hg-footer { margin-top: 16px; } /* 销售查询：窄屏下表单字段纵向堆叠、输入框占满宽度（只作用于外层表单 table，不影响内部 GridView） */ table.hg-salequery > tbody, table.hg-salequery > tbody > tr, table.hg-salequery > tbody > tr > td { display: block; width: 100% !important; } table.hg-salequery > tbody > tr > td { padding: 4px 0; } table.hg-salequery input[type="text"], table.hg-salequery .hg-date-range, table.hg-salequery .hg-filter-input { width: 100% !important; max-width: 100%; box-sizing: border-box; } .hg-cselect-wrap { display: block; } /* 移动端下拉菜单：跟随 trigger 宽度展开（width:auto 由定位逻辑按最宽选项撑开 + minWidth=trigger 宽）， 不再强制 100vw 全屏——原 width:100%!important（position:fixed 下=视口全宽）压过定位逻辑的 width:auto， 菜单从 trigger 处铺满整屏、右缘溢出，且大范围盖住下方按钮造成视觉"重叠错乱"； max-width 兜底防右缘溢出（配合定位逻辑的左移修正）。 */ .hg-cselect-menu { width: auto !important; max-width: calc(100vw - 16px) !important; } /* 移动端：筛选栏竖排 + 所有条件（标签/下拉/勾选框/按钮）左对齐并占满整行。 必须 !important：全局桌面 .hg-filter-bar/.hg-filter-group(1280/1633 行) 与部分页 内联