/* ===== 默认主题：微信黑白简约风（按参考图重构） ===== */
/* 全局聊天界面：白底、黑白描边气泡带尾巴、圆角浮动输入栏 */

/* ---------- 主题变量定义 ----------
   定义这些变量，让后加载的性能CSS（ios-perf/apk-perf/web-perf，
   它们用 var(--chat-input-bg, #fff) 等读取）统一拿到本主题的值，
   避免在 iOS/APK 上底栏/导航栏背景被回退成白色 */
body.theme-default {
    --chat-nav-bg: #ffffff;
    --chat-input-bg: #f7f7f7;
    --bubble-left: #ffffff;
    --bubble-right: #1a1a1a;
}

/* ---------- 聊天导航栏：纯白简洁 ---------- */
/* [FIX-美化兼容 2026-07-11] 有自定义全局CSS时不覆盖聊天导航栏样式，
   避免高特异性选择器(2ID+2class)的 !important 碾压用户CSS中
   #layer-chat .nav-title { font-size:0; color:transparent } 等布局规则，
   导致 .nav-title 与 .nav-name 同时显示（重影/歪位）。 */
body:not(.has-custom-global-css) #layer-chat > .nav-bar#chat-nav-bar {
    background: var(--chat-nav-bg, #ffffff) !important;
    border-bottom: var(--chat-nav-border, none) !important;
    box-shadow: var(--chat-nav-shadow, none) !important;
}
body:not(.has-custom-global-css) #layer-chat > .nav-bar#chat-nav-bar .nav-title {
    font-family: var(--chat-nav-font, inherit) !important;
    font-weight: var(--chat-nav-font-weight, 600) !important;
    letter-spacing: 0 !important;
    color: var(--chat-nav-color, #1a1a1a) !important;
    font-size: var(--chat-nav-font-size, 17px) !important;
}
body:not(.has-custom-global-css) #layer-chat > .nav-bar#chat-nav-bar .nav-icon {
    color: var(--chat-nav-icon-color, #1a1a1a) !important;
}
body:not(.has-custom-global-css) #layer-chat > .nav-bar#chat-nav-bar .nav-icon:active {
    opacity: 0.5 !important;
}

/* ---------- 聊天背景：纯白 ---------- */
#chat-history:not(.has-custom-bg) {
    background: #ffffff !important;
    background-image: none !important;
}
#layer-chat {
    background: #ffffff !important;
}
#chat-history.has-custom-bg {
    background-color: transparent !important;
    background-image: none;
    background-size: initial;
}

/* ---------- 聊天气泡：黑白描边 + 尾巴 ---------- */
#layer-chat .bubble {
    border-radius: var(--bubble-radius, 18px) !important;
    box-shadow: none !important;
    font-family: inherit !important;
    position: relative;
    transition: opacity 0.1s;
    overflow: visible !important;
}

/* 对方气泡：白底 + 黑色描边（写死颜色，不读被其他CSS污染的变量） */
#layer-chat .msg-row:not(.me) .bubble {
    background: #ffffff !important;
    border: 1.5px solid #1a1a1a !important;
    color: #1a1a1a !important;
}
/* 对方气泡尾巴：黑边白心三角，贴合气泡左侧 */
#layer-chat .msg-row:not(.me) .bubble::before {
    content: '' !important;
    position: absolute !important;
    left: -8px !important;
    top: 12px !important;
    right: auto !important;
    width: 0 !important;
    height: 0 !important;
    border-style: solid !important;
    border-width: 6px 8px 6px 0 !important;
    border-color: transparent #1a1a1a transparent transparent !important;
    background: none !important;
    box-shadow: none !important;
}
#layer-chat .msg-row:not(.me) .bubble::after {
    content: '' !important;
    position: absolute !important;
    left: -5px !important;
    top: 13px !important;
    right: auto !important;
    width: 0 !important;
    height: 0 !important;
    border-style: solid !important;
    border-width: 5px 7px 5px 0 !important;
    border-color: transparent #ffffff transparent transparent !important;
    background: none !important;
    box-shadow: none !important;
}

/* 自己气泡：黑底白字（写死颜色，不读被其他CSS污染的变量） */
#layer-chat .msg-row.me .bubble {
    background: #1a1a1a !important;
    border: 1.5px solid #1a1a1a !important;
    color: #ffffff !important;
}
/* 自己气泡尾巴：黑色实心三角，贴合气泡右侧 */
#layer-chat .msg-row.me .bubble::before {
    content: none !important;
    display: none !important;
}
#layer-chat .msg-row.me .bubble::after {
    content: '' !important;
    position: absolute !important;
    right: -7px !important;
    left: auto !important;
    top: 12px !important;
    width: 0 !important;
    height: 0 !important;
    border-style: solid !important;
    border-width: 6px 0 6px 8px !important;
    border-color: transparent transparent transparent #1a1a1a !important;
    background: none !important;
    box-shadow: none !important;
}

/* 气泡按压 */
#layer-chat .bubble:active {
    opacity: 0.85;
}

/* 气泡内图片 */
#layer-chat .bubble img:not(.emoji-img) {
    border: none;
    border-radius: 6px;
    filter: none;
}
#layer-chat .bubble:has(img:not(.emoji-img)):not(.voice) {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
}
#layer-chat .bubble:has(img:not(.emoji-img)):not(.voice)::before,
#layer-chat .bubble:has(img:not(.emoji-img)):not(.voice)::after {
    display: none !important;
    content: none !important;
}
#layer-chat .msg-row:not(.me) .bubble:has(img):not(.voice) {
    margin-left: 6px;
}
#layer-chat .msg-row.me .bubble:has(img):not(.voice) {
    margin-right: 6px;
}

/* ---------- 头像：小圆角方形（缩小至34px，更精致） ---------- */
body.theme-default #layer-chat .avatar-wrapper-chat .avatar,
body.theme-default #layer-chat .msg-row .avatar {
    border: none;
    border-radius: var(--avatar-radius, 6px);
    box-shadow: none;
    filter: none;
}
#layer-chat .msg-row {
    margin-bottom: var(--bubble-gap, 0px) !important;
}
/* [FIX-头像缩小-2026-06-13] 头像从40px缩小到34px */
/* [FIX-滑条共存-2026-06-14] 改用CSS变量，让聊天美化滑条能覆盖默认值 */
#layer-chat .msg-row .avatar {
    width: var(--avatar-size, 40px) !important;
    height: var(--avatar-size, 40px) !important;
    min-width: var(--avatar-size, 40px) !important;
    min-height: var(--avatar-size, 40px) !important;
}

/* ---------- 气泡：缩小尺寸，更紧凑 ---------- */
/* [FIX-气泡缩小-2026-06-13] max-width从220px缩小到200px */
/* [FIX-滑条共存-2026-06-14] 改用CSS变量，让聊天美化滑条能覆盖默认值 */
#layer-chat .bubble {
    max-width: var(--bubble-size, min(200px, calc(100vw - 110px))) !important;
    padding: var(--bubble-padding, 5px) !important;
    font-size: var(--bubble-font-size, 12px) !important;
    line-height: var(--bubble-spacing, 1.5) !important;
    min-height: 28px !important;
}

/* ---------- 时间戳：居中浅灰 ---------- */
#layer-chat .time-divider,
#layer-chat .msg-row .time-label {
    font-family: inherit;
    color: #b2b2b2;
    letter-spacing: 0;
    font-size: 12px;
    text-align: center;
}
#layer-chat .avatar-time-label,
#layer-chat .bubble-time-label {
    font-family: inherit;
    color: #b2b2b2;
    letter-spacing: 0;
    font-size: 11px;
    font-style: normal;
}

/* ---------- 底部输入栏：浅灰底贴底通栏（参考图风格） ---------- */
/* [FIX-美化兼容 2026-07-11] 有自定义全局CSS时让步，避免padding/border-radius等被覆盖 */
body:not(.has-custom-global-css) #layer-chat .input-bar,
body:not(.has-custom-global-css) #chat-input-bar {
    background-color: var(--chat-input-bg, #f7f7f7) !important;
    border-top: var(--chat-input-border, 1px solid #ededed) !important;
    border-left: none !important;
    border-right: none !important;
    border-bottom: none !important;
    border-radius: var(--chat-input-radius, 0) !important;
    box-shadow: var(--chat-input-shadow, none) !important;
    margin: 0 !important;
    margin-bottom: 0 !important;
    /* [FIX-贴底输入栏-2026-07-12] 上下对称；底部 safe-area 让整栏（输入框+按钮）一起抬升。
       根因：此前 padding-top:20px 只把栏背景往上撑，按钮仍贴屏幕底，视觉脱节。 */
    padding: 8px 12px !important;
    padding-bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
}

/* 输入框：白底 + 浅灰细描边 + 大圆角胶囊 */
#layer-chat .input-field,
#chat-input {
    border: 1px solid #dcdcdc !important;
    border-radius: 20px !important;
    background: #ffffff !important;
    font-family: inherit !important;
    color: #1a1a1a !important;
}
#layer-chat .input-field:focus,
#chat-input:focus {
    outline: none !important;
    background: #fff !important;
    box-shadow: none !important;
    border-color: #c5c5c5 !important;
}
#layer-chat .input-field::placeholder,
#chat-input::placeholder {
    color: #b5b5b5 !important;
}

/* 输入栏按钮：精致圆角方形 + 浅灰细描边（参考图：小巧轻盈） */
#layer-chat .btn-act {
    color: #4a4a4a !important;
    transition: opacity 0.15s !important;
    width: 34px !important;
    height: 34px !important;
    border: 0.75px solid #e0e0e0 !important;
    border-radius: 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #ffffff !important;
}
#layer-chat .btn-act svg {
    width: 17px !important;
    height: 17px !important;
}
#layer-chat .btn-act:active {
    opacity: 0.6 !important;
    background: #f5f5f5 !important;
}

/* 发送按钮：黑底白色图标，精致圆角方形 */
#layer-chat .btn-send {
    color: #ffffff !important;
    background: #1a1a1a !important;
    border: 1px solid #1a1a1a !important;
    border-radius: 10px !important;
    width: 34px !important;
    height: 34px !important;
    font-weight: 600 !important;
}
#layer-chat .btn-send svg {
    width: 16px !important;
    height: 16px !important;
}
#layer-chat .btn-send:active {
    opacity: 0.75 !important;
    background: #1a1a1a !important;
}

/* 生成按钮（闪电）：与其他图标按钮一致 */
#layer-chat .btn-gen {
    color: #4a4a4a !important;
}

/* 心声按钮：在输入框内部，无边框灰色小图标（参考图麦克风位置） */
#layer-chat .btn-thought {
    color: #9a9a9a !important;
    border: none !important;
    background: transparent !important;
    width: 26px !important;
    height: 26px !important;
    border-radius: 50% !important;
}
#layer-chat .btn-thought svg {
    width: 15px !important;
    height: 15px !important;
}
#layer-chat .input-field-wrap > .btn-thought:active {
    background: transparent !important;
    opacity: 0.5 !important;
}

/* ---------- 工具栏 ---------- */
#layer-chat .toolbar {
    background: #ffffff !important;
    border-top: 1px solid #ededed !important;
}
#layer-chat .toolbar i {
    color: #1a1a1a !important;
    transition: opacity 0.15s !important;
}
#layer-chat .toolbar i:active {
    opacity: 0.5 !important;
}

/* ---------- 引用预览条 ---------- */
#layer-chat .quote-preview {
    background: #f7f7f7 !important;
    border: 1px solid #e0e0e0 !important;
    border-left: 3px solid #1a1a1a !important;
    border-radius: 6px !important;
    color: #666 !important;
    font-family: inherit !important;
    font-size: 12px !important;
}

/* ---------- 消息弹出菜单 ---------- */
#layer-chat .pop-menu {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12) !important;
    border-radius: 12px !important;
}
#layer-chat .pop-opt {
    color: #1a1a1a !important;
    font-family: inherit !important;
    font-weight: 500 !important;
    border-bottom: none !important;
}
#layer-chat .pop-opt:active {
    background: #f0f0f0 !important;
    color: #1a1a1a !important;
}

/* ---------- 语音气泡 ---------- */
#layer-chat .bubble.voice {
    min-width: 90px;
}
#layer-chat .msg-row:not(.me) .bubble.voice .voice-wave-anim span {
    background: #1a1a1a !important;
}
#layer-chat .msg-row.me .bubble.voice .voice-wave-anim span {
    background: #ffffff !important;
}
#layer-chat .msg-row:not(.me) .bubble.voice .voice-sec {
    color: #888 !important;
}
#layer-chat .msg-row.me .bubble.voice .voice-sec {
    color: #ddd !important;
}

/* ---------- 撤回消息 ---------- */
#layer-chat .bubble.recalled {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    color: #999 !important;
    font-family: inherit !important;
    font-size: 12px !important;
}
#layer-chat .bubble.recalled::before,
#layer-chat .bubble.recalled::after {
    display: none !important;
    content: none !important;
}

/* ---------- 多选栏 ---------- */
#chat-select-bar {
    background: #ffffff !important;
    border-bottom: 1px solid #ededed !important;
    font-family: inherit !important;
    color: #1a1a1a !important;
}

/* ---------- 滚动到底部按钮 ---------- */
#chat-scroll-bottom-btn {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
    color: #1a1a1a !important;
}
#chat-scroll-bottom-btn:active {
    opacity: 0.7 !important;
}

/* ---------- 共读状态栏 ---------- */
#chat-read-banner {
    background: #f7f7f7 !important;
    border-bottom: 1px solid #ededed !important;
    color: #1a1a1a !important;
    font-family: inherit !important;
}

/* ---------- 表情面板 ---------- */
#layer-chat .sticker-panel {
    background: #ffffff !important;
    border-top: 1px solid #ededed !important;
}

/* ---------- 心声气泡 ---------- */
#layer-chat .thought-bubble {
    border: 1.5px dashed #bbb !important;
    background: #fafafa !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    color: #777 !important;
    font-style: italic !important;
}
#layer-chat .thought-bubble::before,
#layer-chat .thought-bubble::after {
    display: none !important;
    content: none !important;
}

/* ---------- 转账/红包/卡片气泡：取消气泡尾巴和描边 ---------- */
#layer-chat .bubble-transfer,
#layer-chat .bubble-redpacket,
#layer-chat .bubble-shared-post,
#layer-chat .bubble-location,
#layer-chat .bubble-copay,
#layer-chat .bubble-contact-card,
#layer-chat .bubble-gift-delivery,
#layer-chat .bubble-fav-product {
    border: 1px solid #e5e5e5 !important;
    border-radius: 10px !important;
    box-shadow: none !important;
    background: #ffffff !important;
}
#layer-chat .bubble-transfer::before, #layer-chat .bubble-transfer::after,
#layer-chat .bubble-redpacket::before, #layer-chat .bubble-redpacket::after,
#layer-chat .bubble-shared-post::before, #layer-chat .bubble-shared-post::after,
#layer-chat .bubble-location::before, #layer-chat .bubble-location::after,
#layer-chat .bubble-copay::before, #layer-chat .bubble-copay::after,
#layer-chat .bubble-contact-card::before, #layer-chat .bubble-contact-card::after,
#layer-chat .bubble-gift-delivery::before, #layer-chat .bubble-gift-delivery::after,
#layer-chat .bubble-fav-product::before, #layer-chat .bubble-fav-product::after {
    display: none !important;
    content: none !important;
}

/* [FIX-转账文字可见性] 默认黑白主题把转账气泡背景改成了白色，
   但 .transfer-top 的基础样式是白字白边（原本配橙色背景），
   导致白底白字、图标和文字看不见。这里把文字/图标改成深色。 */
#layer-chat .bubble-transfer .transfer-top {
    color: #1a1a1a !important;
}
#layer-chat .bubble-transfer .transfer-amt,
#layer-chat .bubble-transfer .transfer-desc,
#layer-chat .bubble-transfer .transfer-note,
#layer-chat .bubble-transfer .transfer-top i {
    color: #1a1a1a !important;
}
#layer-chat .bubble-transfer .transfer-icon {
    border-color: #1a1a1a !important;
    color: #1a1a1a !important;
}

/* [FIX-红包文字可见性] 同转账：默认黑白主题把红包气泡背景改成了白色，
   但 .rp-greeting/.rp-status/.rp-bottom 的基础样式是白字（原本配红色背景），
   导致白底白字、文字和图标看不见。这里把红包顶部恢复成红色背景（保留白字），
   底部条改成浅灰底深字，已领取(rp-done)则用灰色，保证任何状态都看得清。 */
#layer-chat .bubble-redpacket .rp-top {
    background: linear-gradient(135deg, #c0392b, #a93226) !important;
}
#layer-chat .bubble-redpacket .rp-greeting {
    color: #fff !important;
}
#layer-chat .bubble-redpacket .rp-status {
    color: rgba(255, 255, 255, 0.7) !important;
}
#layer-chat .bubble-redpacket .rp-bottom {
    background: #f3f3f3 !important;
    color: #888 !important;
    border-top: 1px solid #ececec !important;
}
#layer-chat .bubble-redpacket.rp-done .rp-top {
    background: linear-gradient(135deg, #b0b0b0, #999) !important;
}

/* ===================================================================
   联系人列表界面：简约白底风
   =================================================================== */
#tab-contacts > .nav-bar {
    background: #ffffff !important;
    border-bottom: none !important;
    box-shadow: none !important;
}
#tab-contacts > .nav-bar .nav-title {
    font-family: inherit !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    color: #1a1a1a !important;
    font-size: 17px !important;
}
#tab-contacts > .nav-bar .nav-icon {
    color: #1a1a1a !important;
}
/* [FIX-图标黑框] far 细体图标在部分环境缺字形会掉成方框(tofu)，
   强制用 Font Awesome Free 的 solid 字重(900)保证有字形渲染 */
#tab-contacts > .nav-bar .nav-icon i {
    font-family: "Font Awesome 6 Free", "Font Awesome 5 Free", "FontAwesome" !important;
    font-weight: 900 !important;
    color: #1a1a1a !important;
}
#contact-list {
    background: #ffffff !important;
    background-image: none !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
}
#contact-list .list-item {
    background: #ffffff !important;
    border: 1px solid #d8d8d8 !important;
    border-radius: 14px !important;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04) !important;
    margin: 0 0 4px 0 !important;
    padding: 10px 14px !important;
    transition: background 0.1s !important;
    /* [FIX-宽度拉长] 固定填满容器、内容超出不撑宽 */
    width: auto !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
}
/* [FIX-宽度拉长] 内容区可收缩，长文本截断为省略号，不把卡片撑宽 */
#contact-list .list-item .list-content,
#contact-list .list-item .list-title,
#contact-list .list-item .list-sub {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
#contact-list .list-item:active {
    background: #f5f5f5 !important;
}
#contact-list .list-item .list-title {
    font-family: inherit !important;
    font-weight: 500 !important;
    color: #1a1a1a !important;
    letter-spacing: 0 !important;
}
#contact-list .list-item .list-sub {
    font-family: inherit !important;
    color: #999 !important;
    font-size: 13px !important;
    letter-spacing: 0 !important;
}
body.theme-default #contact-list .list-item .avatar {
    border: none !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    filter: none !important;
    width: var(--list-avatar-size, 34px);
    height: var(--list-avatar-size, 34px);
}
#contact-list .list-item > i,
#contact-list .list-item .fa-thumbtack {
    color: #999 !important;
}
#contact-list .list-item .fa-users {
    color: #999 !important;
}

/* 联系人右键菜单 */
.contact-menu {
    background: #ffffff !important;
    border: 1px solid #e5e5e5 !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,0.12) !important;
}
.contact-menu-item {
    color: #1a1a1a !important;
    font-family: inherit !important;
    border-bottom-color: #f0f0f0 !important;
}
.contact-menu-item:active {
    background: #f0f0f0 !important;
    color: #1a1a1a !important;
}
#tab-contacts .nav-icon .fa-plus-circle {
    color: #1a1a1a !important;
}

/* ===================================================================
   [保护-微信透出桌面] 微信层永不透明，绝不能露出常驻在最底层的桌面
   ===================================================================
   桌面(#layer-desktop)按设计永远 active 垫底，靠微信层不透明底盖住。
   若 .page / #layer-wechat 背景被改成 transparent，桌面(含各app图标)会透出，
   表现为"微信内容正常、只是背景变成整个桌面"。微信层永远不该透明——
   全局壁纸只作用于 #tab-contacts/#tab-me 子层，强制微信层不透明不影响壁纸。
   深色主题自带不透明深色底，故排除 .theme-dark。 */
html body:not(.theme-dark) #device #layer-wechat {
    background-color: #f3f3f4 !important;
}

/* ===================================================================
   [FIX-短信/聊天透出桌面] 同微信：短信App层、聊天详情层绝不能透明露出垫底桌面。
   短信App是纯黑白白底设计、不支持全局壁纸 → 任何主题都强制白底(含子页 .sms-sublayer)。
   ★[FIX-透出specificity-2026-06-26] 加 #device(2个id)把护栏特异性顶到 (2,x,y)，
     使任何美化CSS的 `#device .layer{transparent}`(1id1class) 都压不过——之前短信护栏
     `html body #layer-sms`(1id0class) 被这类美化规则击败，而微信/聊天因带2个:not类(2class)
     侥幸没被击败，于是网页只剩短信透出。统一用 #device 双id后三层都铁定不透。
   聊天壁纸只设 inline `background-image`(15443行)不碰 background-color，故这里强制白底色
     不影响壁纸(图画在白底之上)，反而修好"有壁纸类但图加载失败/被改透明→透出桌面"。
   深色主题自带不透明深色底，故微信/聊天排除 .theme-dark；短信永远白底不排除。 */
html body #device #layer-sms,
html body #device #layer-sms .sms-sublayer {
    background-color: #ffffff !important;
}
html body:not(.theme-dark) #device #layer-chat {
    background-color: #ffffff !important;
}

/* ===================================================================
   微信底部Tab栏：简约白底风
   =================================================================== */
#layer-wechat > .wx-tab-bar,
.wx-tab-bar {
    background: #f3f3f4 !important;
    border-top: none !important;
    box-shadow: none !important;
}
#layer-wechat > .wx-tab-bar .nav-tab,
.wx-tab-bar .nav-tab {
    color: #b0b0b5 !important;
    font-family: inherit !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
}
#layer-wechat > .wx-tab-bar .nav-tab i,
.wx-tab-bar .nav-tab i {
    color: inherit !important;
    font-size: 18px !important;
}
#layer-wechat > .wx-tab-bar .nav-tab.active,
.wx-tab-bar .nav-tab.active,
#layer-wechat > .wx-tab-bar .nav-tab.active i,
.wx-tab-bar .nav-tab.active i {
    color: #3a3a3c !important;
}
.wx-tab-bar .nav-tab:active {
    opacity: 0.6 !important;
}

/* ===================================================================
   微信联系人页面导航栏：灰韩系风
   =================================================================== */
body.theme-default #tab-contacts > .nav-bar {
    background: #f3f3f4 !important;
    border-bottom: none !important;
    box-shadow: none !important;
    height: 36px !important;
    min-height: 36px !important;
    padding-top: 2px !important;
    padding-bottom: 2px !important;
}
body.theme-default #tab-contacts > .nav-bar .nav-title {
    font-size: 16px !important;
    font-weight: 600 !important;
    color: #2c2c2e !important;
}
body.theme-default #tab-contacts > .nav-bar .nav-icon {
    color: #8a8a8f !important;
    font-size: 15px !important;
}
body.theme-default #tab-contacts > .nav-bar .nav-icon i {
    font-size: 16px !important;
}
body.theme-default #contact-list {
    background: #f3f3f4 !important;
}

/* ===================================================================
   添加联系人弹窗：简约白底风
   =================================================================== */
#modal-contact .modal-box {
    background: #ffffff !important;
    border: none !important;
    border-radius: 16px !important;
    box-shadow: 0 8px 40px rgba(0,0,0,0.16) !important;
    padding: 24px 20px !important;
}
#modal-contact .modal-box::before,
#modal-contact .modal-box::after {
    display: none !important;
    content: none !important;
}
#modal-contact .modal-box h3 {
    font-family: inherit !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    color: #1a1a1a !important;
    font-size: 18px !important;
    text-align: center !important;
    padding-bottom: 12px !important;
    margin-bottom: 16px !important;
}
#modal-contact .upload-box {
    border: 1.5px solid #e0e0e0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    background: #f7f7f7 !important;
}
#modal-contact .upload-box i {
    color: #bbb !important;
}
#modal-contact .upload-box img {
    filter: none !important;
}
#modal-contact #new-contact-name,
#modal-contact #new-contact-remark,
#modal-contact #new-contact-remark-for-me,
#modal-contact #new-contact-signature,
#modal-contact #new-contact-persona {
    border: 1px solid #e0e0e0 !important;
    border-radius: 10px !important;
    background: #f7f7f7 !important;
    font-family: inherit !important;
    color: #1a1a1a !important;
    box-shadow: none !important;
}
#modal-contact #new-contact-name:focus,
#modal-contact #new-contact-remark:focus,
#modal-contact #new-contact-remark-for-me:focus,
#modal-contact #new-contact-signature:focus,
#modal-contact #new-contact-persona:focus {
    outline: none !important;
    background: #ffffff !important;
    box-shadow: none !important;
    border-color: #1a1a1a !important;
}
#modal-contact #new-contact-name::placeholder,
#modal-contact #new-contact-remark::placeholder,
#modal-contact #new-contact-remark-for-me::placeholder,
#modal-contact #new-contact-signature::placeholder,
#modal-contact #new-contact-persona::placeholder {
    color: #bbb !important;
    font-family: inherit !important;
    letter-spacing: 0 !important;
}
#modal-contact .modal-box button {
    border-radius: 10px !important;
    font-family: inherit !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    cursor: pointer !important;
    transition: opacity 0.15s !important;
}
#modal-contact .modal-btn-cancel {
    background: #f0f0f0 !important;
    color: #1a1a1a !important;
    border: none !important;
    box-shadow: none !important;
}
#modal-contact .modal-btn-cancel:active {
    opacity: 0.7 !important;
    transform: none !important;
}
#modal-contact .modal-btn-save {
    background: #1a1a1a !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: none !important;
}
#modal-contact .modal-btn-save:active {
    opacity: 0.8 !important;
    transform: none !important;
}
#modal-contact.modal-mask {
    background: rgba(0,0,0,0.4) !important;
}

/* ===================================================================
   [全局去绿色 + 韩系灰弹窗] 2026-07-06
   所有弹窗/按钮/确认框/支付框统一灰韩系风，禁止绿色和其他杂色
   =================================================================== */

/* 全局弹窗背景和主体 */
body.theme-default .modal-mask {
    background: rgba(0, 0, 0, 0.35) !important;
}
body.theme-default .modal-mask .modal-box {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10) !important;
}
body.theme-default .modal-mask .modal-box h3 {
    color: #2c2c2e !important;
}
body.theme-default .modal-mask .modal-box p,
body.theme-default .modal-mask .modal-box span {
    color: #6b6b70 !important;
}

/* 弹窗按钮：禁止绿色，统一灰/黑 */
body.theme-default .modal-mask .modal-box button {
    border-radius: 10px !important;
}
body.theme-default .modal-mask .modal-box button[style*="background:#07c160"],
body.theme-default .modal-mask .modal-box button[style*="background: #07c160"],
body.theme-default .modal-mask .modal-box button[style*="background-color:#07c160"],
body.theme-default .modal-mask .modal-box button[style*="background-color: #07c160"] {
    background: #2c2c2e !important;
    color: #ffffff !important;
}

/* confirm弹窗确认按钮（通常是绿色的）统一改黑 */
body.theme-default .modal-mask .modal-box .modal-btn-confirm,
body.theme-default .modal-mask .modal-box button:last-child:not(.modal-btn-cancel) {
    background: #2c2c2e !important;
    color: #ffffff !important;
    border: none !important;
}
body.theme-default .modal-mask .modal-box .modal-btn-cancel {
    background: #f0f0f0 !important;
    color: #3a3a3c !important;
    border: none !important;
}

/* Toast 提示：灰韩系 */
body.theme-default #toast {
    background: rgba(44, 44, 46, 0.92) !important;
    color: #ffffff !important;
    border: none !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
}

/* 微信搜索框背景调灰 */
body.theme-default #contact-search-bar {
    background: #f3f3f4 !important;
    border-bottom: none !important;
}
body.theme-default #contact-search-bar input {
    background: #e8e8ea !important;
    border: none !important;
    color: #2c2c2e !important;
}

/* 加号菜单韩系化 */
body.theme-default .add-menu {
    background: #ffffff !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10) !important;
    border-radius: 14px !important;
}
body.theme-default .add-menu .add-item {
    color: #3a3a3c !important;
}
body.theme-default .add-menu .add-item i {
    color: #8a8a8f !important;
}

/* ===================================================================
   微信"我的"界面：去便签风，改为白底圆角卡片（覆盖 wechat_me_anime_style.css）
   =================================================================== */
body.theme-default #tab-me {
    background: #f3f3f4 !important;
}
body.theme-default #tab-me > .scroll-y {
    background: #f3f3f4 !important;
    background-image: none !important;
}
/* 关闭便签纸左侧红线、涂鸦装饰 */
body.theme-default #tab-me .scroll-y::before,
body.theme-default #tab-me .scroll-y::after {
    display: none !important;
    content: none !important;
}
/* 个人信息卡片：白底圆角，去掉边框/硬阴影/旋转 */
body.theme-default #tab-me > .scroll-y > div:first-child {
    background: #ffffff !important;
    border: none !important;
    border-radius: 14px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
    margin: 12px 12px 12px !important;
    padding: 18px 16px !important;
    transform: none !important;
}
/* 关闭个人卡片的便签纹理/纸张撕裂/胶带装饰 */
body.theme-default #tab-me > .scroll-y > div:first-child::before,
body.theme-default #tab-me > .scroll-y > div:first-child::after,
body.theme-default #tab-me .group-box:first-of-type::before {
    display: none !important;
    content: none !important;
}
/* 头像：去手绘边框和灰度滤镜 */
body.theme-default #tab-me #my-avatar {
    border: none !important;
    border-radius: var(--avatar-radius, 12px) !important;
    box-shadow: none !important;
    filter: none !important;
}
body.theme-default #tab-me #my-name {
    color: #2c2c2e !important;
    font-weight: 600 !important;
    font-size: 20px !important;
    text-shadow: none !important;
    letter-spacing: 0 !important;
}
body.theme-default #tab-me #my-wxid {
    color: #8a8a8f !important;
    font-family: inherit !important;
}
body.theme-default #tab-me > .scroll-y > div:first-child .fa-chevron-right {
    color: #c7c7cc !important;
    opacity: 1 !important;
}
/* 功能分组卡片：白底圆角，去便签边框/硬阴影/旋转 */
body.theme-default #tab-me .group-box {
    background: #ffffff !important;
    border: none !important;
    border-radius: 14px !important;
    margin: 0 12px 12px !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05) !important;
    transform: none !important;
}
/* 关闭分组卡片的便签纹理和贴纸装饰(★♪✿) */
body.theme-default #tab-me .group-box::before,
body.theme-default #tab-me .group-box::after,
body.theme-default #tab-me .group-box:nth-child(2)::after,
body.theme-default #tab-me .group-box:nth-child(3)::after,
body.theme-default #tab-me .group-box:nth-child(4)::after {
    display: none !important;
    content: none !important;
}
/* 列表项：细实线分隔替代手绘虚线 */
body.theme-default #tab-me .list-item {
    background: transparent !important;
    border-bottom: 0.5px solid #ededed !important;
}
body.theme-default #tab-me .list-item:last-child {
    border-bottom: none !important;
}
body.theme-default #tab-me .list-item:active {
    background: #f5f5f5 !important;
}
/* 关闭首个列表项前的手写"→"标注 */
body.theme-default #tab-me .list-item:first-child::before {
    display: none !important;
    content: none !important;
}
body.theme-default #tab-me .list-item i {
    color: #8a8a8f !important;
    filter: none !important;
}
body.theme-default #tab-me .list-title {
    color: #2c2c2e !important;
    font-family: inherit !important;
    font-weight: 500 !important;
}
body.theme-default #tab-me .list-sub {
    color: #8a8a8f !important;
    font-family: inherit !important;
}
/* 开关：去手绘黑框，改用韩系灰/黑 */
body.theme-default #tab-me .switch {
    border: none !important;
}
body.theme-default #tab-me .switch .slider {
    background: #e0e0e2 !important;
}
body.theme-default #tab-me .switch input:checked + .slider {
    background: #2c2c2e !important;
}
body.theme-default #tab-me .switch .slider::before {
    background: #ffffff !important;
    border-radius: 50% !important;
}
/* 表单单元格分隔线 */
body.theme-default #tab-me .form-cell {
    border-bottom: 0.5px solid #ededed !important;
}
body.theme-default #tab-me .form-cell:last-child {
    border-bottom: none !important;
}
body.theme-default #tab-me .form-label {
    color: #2c2c2e !important;
    font-family: inherit !important;
}
body.theme-default #tab-me #wallet-balance {
    color: #2c2c2e !important;
}