/* 公让云覆盖层 · 灵感AI App 深蓝主题（GW-261108-033，A 版定稿 preview-app-a）
   只覆盖上游 app.css 的设计令牌 + 少量组件外观；index.html 在 app.css / maodao.css 之后引入，同优先级后者胜。
   色值与对比度沿用 GW-261108-030 逐元素 WCAG 自查：带白字的交互蓝用 #1268E8（#1677FF 上白字仅 4.0），未读红用 #D63A40。 */

:root {
  color-scheme: dark;
  --bg: #061A44; --bg-soft: #0A2257; --card: #0E2A63; --card-2: #13367C; --outside: #04122F; --chat-bg: #061A44;
  --chip-bg: rgba(255,255,255,.09); --chip-text: #B4C4E2;
  --text: #EEF3FB; --sub: #B4C4E2; --faint: #93A8CF;
  --brand: #1268E8; --brand-deep: #0F5ACB; --on-brand: #FFFFFF; --brand-dim: rgba(22,119,255,.32); --glow-brand: 0 0 0 3px rgba(22,119,255,.25);
  --down: #D63A40; --down-bg: rgba(214,58,64,.16);
  --wx-link: #7DB2FF; --gold-text: #D4AF37;
  --bubble-mine: #1268E8; --bubble-mine-text: #FFFFFF; --bubble-mine-quote: rgba(255,255,255,.16);
  --bubble-peer: #13367C; --bubble-peer-text: #EEF3FB; --bubble-peer-quote: rgba(255,255,255,.08);
  --border: #1D3F82; --border-soft: #16356F; --avatar-bg: #1D3F82;
  --shadow-1: 0 2px 10px rgba(2,10,30,.45); --shadow-2: 0 10px 30px rgba(2,10,30,.55);
  --gr-navy: #0B3A8C; --gr-gold: #D4AF37; --gr-yellow: #FFC300; --gr-tab-on: #FFD666;
}
html.light {
  color-scheme: light;
  --bg: #F2F5FA; --bg-soft: #FFFFFF; --card: #FFFFFF; --card-2: #EEF2F8; --outside: #E3E8F0; --chat-bg: #EEF2F8;
  --chip-bg: #EAF1FF; --chip-text: #475266;
  --text: #172033; --sub: #475266; --faint: #5C677A;
  --brand: #1268E8; --brand-deep: #0F5ACB; --on-brand: #FFFFFF; --brand-dim: rgba(18,104,232,.22); --glow-brand: 0 0 0 3px rgba(18,104,232,.18);
  --down: #D63A40;
  --wx-link: #0B5BD3; --gold-text: #7A5B00;
  --bubble-mine: #1268E8; --bubble-mine-text: #FFFFFF;
  --bubble-peer: #FFFFFF; --bubble-peer-text: #172033;
  --border: #E3E8F0; --border-soft: #EBEFF5; --avatar-bg: #DCE4F2;
  --gr-tab-on: #0B5BD3;
}
html, body { background: var(--bg); }
html.light ::selection { background: rgba(18,104,232,.22); }

/* —— 顶栏：深浅模式统一深蓝条 + 白字（A 版） —— */
.navbar.wx-nav, .navbar { background: var(--gr-navy); border-bottom-color: var(--gr-navy); color: #FFFFFF; }
.navbar .nav-title, .navbar .nav-title .sub, .navbar .nav-back, .navbar .nav-action { color: #FFFFFF; }
.navbar .nav-title .sub { color: #C9D7F2; }
.navbar .nav-action:active { background: rgba(255,255,255,.14); }
.list-search { background: var(--bg); }
.list-search .search-box { background: var(--card); border: 1px solid var(--border-soft); }

/* —— 底栏：四栏，选中金（深）/ 蓝（浅） —— */
.tabbar { background: var(--card); border-top-color: var(--border-soft); }
.tab-item.on { color: var(--gr-tab-on); }
.tab-item .tab-label { font-weight: 500; }

/* —— 会话列表顶部：快捷宫格 + 官方号置顶行 —— */
.gr-list-head { background: var(--bg); }
.gr-quick { display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; margin: 6px 12px 8px; padding: 12px 4px 10px; background: var(--card); border: 1px solid var(--border-soft); border-radius: 16px; }
.gr-quick-it { background: none; border: 0; display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 2px 0; color: var(--text); font-size: 12.5px; cursor: pointer; }
.gr-quick-ic { width: 46px; height: 46px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #FFFFFF; }
.gr-quick-it:active .gr-quick-ic { transform: scale(.92); }
.gr-off { background: var(--card); }
.gr-off + .gr-off::before { content: ""; position: absolute; left: 70px; right: 0; top: 0; border-top: 1px solid var(--border-soft); }
.gr-off:last-child { border-bottom: 6px solid var(--bg); }
.gr-off-av { overflow: hidden; }
.gr-off-av.ai, .gr-off-av.mall { background: var(--gr-navy); box-shadow: inset 0 0 0 1.5px rgba(212,175,55,.65); }
.gr-off-av.gr { background: #014083; }
.gr-off-av.ai, .gr-off-av.mall { padding: 0; overflow: visible; }
.gr-av-badge { position: absolute; right: -4px; bottom: -4px; width: 20px; height: 20px; border-radius: 7px; background: var(--gr-gold); color: #1F1600; display: flex; align-items: center; justify-content: center; border: 2px solid var(--card); }
.gr-off-name { display: flex; align-items: center; gap: 6px; }
.gr-off-tag { font-size: 10.5px; font-weight: 700; line-height: 16px; padding: 0 4px; border-radius: 3px; background: var(--gr-gold); color: #1F1600; }

/* —— 服务 tab —— */
.gr-svc { background: var(--bg); padding: 4px 0 16px; }
.gr-sec { margin: 10px 12px 0; padding: 14px 10px 6px; background: var(--card); border: 1px solid var(--border-soft); border-radius: 16px; }
.gr-sec-hd { margin: 0 0 8px 6px; font-size: 15px; font-weight: 700; color: var(--text); display: flex; align-items: center; gap: 8px; }
.gr-sec-lead { display: flex; color: var(--gr-gold); }
.gr-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2px 0; }
.gr-grid-it { background: none; border: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 6px 0 10px; font-size: 12.5px; color: var(--text); cursor: pointer; }
.gr-grid-ic { width: 44px; height: 44px; border-radius: 14px; display: flex; align-items: center; justify-content: center; color: #FFFFFF; }
.gr-grid-it:active .gr-grid-ic { transform: scale(.92); }
.gr-svc-note { margin: 14px 16px 0; font-size: 12px; color: var(--faint); text-align: center; line-height: 1.6; }

/* —— 商城 tab：承载壳 —— */
.gr-mall { display: flex; flex-direction: column; overflow: hidden; background: var(--bg); }
.gr-mall-box { flex: 1; min-height: 0; position: relative; display: flex; }
.gr-mall-frame { flex: 1; width: 100%; border: 0; display: block; background: var(--bg); }
.gr-mall-loading { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; gap: 10px; color: var(--sub); font-size: 14px; }
.gr-spin { width: 18px; height: 18px; border-radius: 50%; border: 2px solid var(--border); border-top-color: var(--gr-gold); animation: grSpin .8s linear infinite; }
@keyframes grSpin { to { transform: rotate(360deg); } }
.gr-mall-gate { margin: auto; padding: 28px 24px; width: calc(100% - 48px); max-width: 340px; text-align: center; background: var(--card); border: 1px solid var(--border-soft); border-radius: 20px; display: flex; flex-direction: column; align-items: center; gap: 8px; color: var(--text); }
.gr-mall-gate-ic { width: 64px; height: 64px; border-radius: 20px; background: var(--gr-navy); color: var(--gr-gold); display: flex; align-items: center; justify-content: center; box-shadow: inset 0 0 0 1.5px rgba(212,175,55,.65); }
.gr-mall-gate b { font-size: 17px; margin-top: 6px; }
.gr-mall-gate p { margin: 0 0 8px; color: var(--sub); font-size: 13.5px; }
.gr-btn { border: 0; border-radius: 12px; background: var(--brand); color: #FFFFFF; font-size: 15px; font-weight: 600; padding: 11px 26px; cursor: pointer; }

/* —— 「我」页：头像卡深蓝底 + 资产卡 —— */
.me-head { background: var(--gr-navy); color: #FFFFFF; margin-bottom: 0; }
.me-head .me-name { color: #FFFFFF; }
.me-head .wx-cell-sub { color: #C9D7F2; }
.me-head .wx-cell-arrow { color: #C9D7F2; }
.gr-assets { display: grid; grid-template-columns: repeat(3, 1fr); margin: 10px 12px; padding: 12px 0; background: var(--card); border: 1px solid var(--border-soft); border-radius: 16px; }
.gr-asset { background: none; border: 0; display: flex; flex-direction: column; align-items: center; gap: 4px; color: var(--faint); font-size: 12px; cursor: pointer; }
.gr-asset b { font-size: 19px; font-weight: 700; color: var(--gr-gold); font-variant-numeric: tabular-nums; min-height: 24px; display: flex; align-items: center; }
html.light .gr-asset b { color: var(--gr-navy); }
.gr-asset + .gr-asset { border-left: 1px solid var(--border-soft); }
.me-group { border-radius: 16px; margin: 0 12px 10px; overflow: hidden; border: 1px solid var(--border-soft); }
.me-group .wx-cell:last-child { border-bottom: 0; }

/* —— 零猫元素：登录页猫头标志 → 公让云标志；AI 客服活猫头像 → 灵感AI 吉祥物（官方定稿）（底图换掉、跟手眼睛层隐藏） —— */
.login-logo.ic-cat, html.light .login-logo.ic-cat { -webkit-mask: none; mask: none; background: url(../img/gr-logo.svg?v=1426) center / contain no-repeat; filter: none; }
.live-kefu > img { content: url(../img/gr-mascot-avatar.svg?v=1426); }
.live-kefu-eyes, .live-kefu-fx { display: none; }

/* —— 对比度补丁（WCAG AA 自查发现的上游色）—— */
:root:not(.light) .btn-wx-danger-ghost { color: #FF8A8F; }                     /* 深色卡片上的危险红：2.97 → 达标 */
.wx-cell-ico[style*="rgb(62, 181, 117)"] { background: #127A6B !important; }    /* 外观 / 字体 / 语言 行的微信绿图标底 → 深蓝体系青色（白字 Aa 达标） */

/* —— 登录页：去掉上游微信绿光晕，换深蓝 + 金色微光（标志已换公让云盾徽） —— */
.login-page {
  background:
    radial-gradient(720px 420px at 50% 8%, rgba(22,119,255,.30) 0%, rgba(22,119,255,.08) 42%, transparent 72%),
    radial-gradient(520px 320px at 50% 100%, rgba(212,175,55,.10) 0%, transparent 70%),
    #061A44;
}
html.light .login-page {
  background:
    radial-gradient(720px 420px at 50% 8%, rgba(22,119,255,.20) 0%, rgba(22,119,255,.05) 42%, transparent 72%),
    #F2F5FA;
}
.login-logo, html.light .login-logo { filter: drop-shadow(0 6px 22px rgba(22,119,255,.45)); animation: grBreathe 3.2s ease-in-out infinite; }
@keyframes grBreathe { 0%, 100% { filter: drop-shadow(0 0 14px rgba(22,119,255,.35)); transform: scale(1); } 50% { filter: drop-shadow(0 0 28px rgba(212,175,55,.45)); transform: scale(1.035); } }
@media (prefers-reduced-motion: reduce) { .login-logo, html.light .login-logo { animation: none; } }

/* —— 会员星级 V1-V7（GW-261108-036，参考图 ref-1：深蓝 + 金环 + 七星） —— */
.gr-vip { position: relative; display: inline-flex; align-items: center; justify-content: center; flex: none; }
.gr-vip > .conv-avatar { position: relative; z-index: 1; }
.gr-vip-ring { position: absolute; inset: 0; pointer-events: none; z-index: 2; }
.gr-vip-chip { display: inline-flex; align-items: center; gap: 3px; margin-left: 8px; padding: 1px 8px 1px 6px; border-radius: 10px; background: #12234B; border: 1px solid #D4AF37; color: #FFE08E; font-size: 12px; font-weight: 700; line-height: 18px; vertical-align: 2px; letter-spacing: .02em; }
.gr-vip-row { cursor: default; }
.gr-vip-row .gr-vip-chip { margin-left: 0; }

/* —— 以下由 tools/regen.py 自动生成：深色模式品牌色文字 → 提亮链接蓝（37 个上游选择器）—— */
:root:not(.light) .admin-card .ops button,
:root:not(.light) .admin-tabs button.on,
:root:not(.light) .aud-done,
:root:not(.light) .aud-summary,
:root:not(.light) .dt-btn.track,
:root:not(.light) .dt-done,
:root:not(.light) .dt-pill.started,
:root:not(.light) .dt-tracking,
:root:not(.light) .emoji-tabs .tab.on,
:root:not(.light) .fg-new,
:root:not(.light) .fg-save,
:root:not(.light) .input-bar .btn-voice.recording,
:root:not(.light) .login-agree a,
:root:not(.light) .login-reg-link,
:root:not(.light) .login-switch,
:root:not(.light) .md-admin-sec .op,
:root:not(.light) .md-ops button,
:root:not(.light) .md-options button.on,
:root:not(.light) .md-pick.picked,
:root:not(.light) .md-stat .v,
:root:not(.light) .md-stepper button,
:root:not(.light) .md-track-entry,
:root:not(.light) .md-track-pill.live,
:root:not(.light) .md-track-pill.started,
:root:not(.light) .modal .m-foot .strong,
:root:not(.light) .msg-status.read,
:root:not(.light) .mx-ncopy-tag,
:root:not(.light) .mx-notice-tag.confirm,
:root:not(.light) .mx-sel-opt.on,
:root:not(.light) .mx-select.open .mx-sel-chev,
:root:not(.light) .new-msg-bar,
:root:not(.light) .pk-newgroup,
:root:not(.light) .px-link,
:root:not(.light) .role-tag.official,
:root:not(.light) .role-tag.owner,
:root:not(.light) .search-item mark,
:root:not(.light) .unread-jump-bar { color: var(--wx-link); }