/* 微信夜间 UI
 * 复用 theme-wechat 的结构与交互，只在 theme-wechat-dark 下覆盖色板。
 * 用户自定义 CSS 仍位于主题文件之后，保持原有覆盖能力。
 */
body.theme-wechat-dark {
    color-scheme: dark;
    --wxd-bg: #111214;
    --wxd-surface: #191a1c;
    --wxd-surface-2: #232426;
    --wxd-input: #2b2c2f;
    --wxd-text: #e7e7e7;
    --wxd-text-2: #a7a8aa;
    --wxd-text-3: #747579;
    --wxd-line: rgba(255,255,255,.09);
    --wxd-green: #07c160;
    --wxd-green-muted: #1f7a46;
    --wxd-bubble-me: #1f7a46;
    --wxd-bubble-other: #252629;
}

body.theme-wechat-dark,
body.theme-wechat-dark #device,
body.theme-wechat-dark .page,
body.theme-wechat-dark .layer:not(#layer-voice-call):not(#layer-video-call),
body.theme-wechat-dark .scroll-y {
    background-color: var(--wxd-bg) !important;
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark .nav-bar,
body.theme-wechat-dark #layer-wechat .wx-header,
body.theme-wechat-dark #layer-wechat > .wx-tab-bar,
body.theme-wechat-dark #chat-input-bar,
body.theme-wechat-dark #layer-chat .input-bar {
    background: var(--wxd-surface) !important;
    border-color: var(--wxd-line) !important;
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark .nav-title,
body.theme-wechat-dark .nav-icon,
body.theme-wechat-dark .wx-title,
body.theme-wechat-dark .settings-nav-title,
body.theme-wechat-dark .beauty-menu-title {
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark .wx-contact-item,
body.theme-wechat-dark #contact-list .list-item,
body.theme-wechat-dark .settings-nav-item,
body.theme-wechat-dark .beauty-menu-item,
body.theme-wechat-dark .beauty-section-card,
body.theme-wechat-dark .settings-section,
body.theme-wechat-dark .setting-item,
body.theme-wechat-dark .modal-content,
body.theme-wechat-dark .sheet-content,
body.theme-wechat-dark .popup-content {
    background-color: var(--wxd-surface) !important;
    border-color: var(--wxd-line) !important;
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark .wx-contact-name,
body.theme-wechat-dark #contact-list .list-title,
body.theme-wechat-dark #contact-list .contact-list-name,
body.theme-wechat-dark .setting-label,
body.theme-wechat-dark label,
body.theme-wechat-dark h1,
body.theme-wechat-dark h2,
body.theme-wechat-dark h3 {
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark .wx-contact-msg,
body.theme-wechat-dark .wx-contact-time,
body.theme-wechat-dark #contact-list .list-sub,
body.theme-wechat-dark #contact-list .contact-list-time,
body.theme-wechat-dark .beauty-menu-desc,
body.theme-wechat-dark .settings-nav-desc,
body.theme-wechat-dark .setting-desc,
body.theme-wechat-dark small {
    color: var(--wxd-text-2) !important;
}

body.theme-wechat-dark input,
body.theme-wechat-dark textarea,
body.theme-wechat-dark select,
body.theme-wechat-dark #chat-input,
body.theme-wechat-dark #layer-chat .input-field {
    background-color: var(--wxd-input) !important;
    border-color: var(--wxd-line) !important;
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark input::placeholder,
body.theme-wechat-dark textarea::placeholder {
    color: var(--wxd-text-3) !important;
}

body.theme-wechat-dark #layer-chat,
body.theme-wechat-dark #chat-history:not(.has-custom-bg),
body.theme-wechat-dark #layer-wechat {
    background: var(--wxd-bg) !important;
}

/* 全局壁纸由带 gwp-has-wallpaper 的页面容器持有，内容层必须透明才能露出壁纸。 */
body.theme-wechat-dark .gwp-has-wallpaper,
body.theme-wechat-dark .gwp-has-wallpaper > .scroll-y,
body.theme-wechat-dark #tab-contacts.gwp-has-wallpaper,
body.theme-wechat-dark #tab-contacts.gwp-has-wallpaper #contact-list,
body.theme-wechat-dark #tab-me.gwp-has-wallpaper > .scroll-y,
body.theme-wechat-dark #layer-beauty.gwp-has-wallpaper .beauty-subpage > .scroll-y,
body.theme-wechat-dark #layer-settings.gwp-has-wallpaper .settings-subpage > .scroll-y {
    background-color: transparent !important;
}

body.theme-wechat-dark #tab-contacts.gwp-has-wallpaper #contact-list .list-item {
    background: rgba(25,26,28,.90) !important;
}

body.theme-wechat-dark #contact-list .list-item:active {
    background: var(--wxd-surface-2) !important;
}

body.theme-wechat-dark #layer-chat .msg-row:not(.me) .bubble {
    background: var(--wxd-bubble-other) !important;
    border-color: var(--wxd-bubble-other) !important;
    color: var(--wxd-text) !important;
}

body.theme-wechat-dark #layer-chat .msg-row.me .bubble {
    background: var(--wxd-bubble-me) !important;
    border-color: var(--wxd-bubble-me) !important;
    color: #f4fff8 !important;
}

body.theme-wechat-dark #layer-chat .msg-row:not(.me) .bubble::before,
body.theme-wechat-dark #layer-chat .msg-row:not(.me) .bubble::after {
    border-right-color: var(--wxd-bubble-other) !important;
}

body.theme-wechat-dark #layer-chat .msg-row.me .bubble::before,
body.theme-wechat-dark #layer-chat .msg-row.me .bubble::after {
    border-left-color: var(--wxd-bubble-me) !important;
}

body.theme-wechat-dark #layer-wechat > .wx-tab-bar .nav-tab,
body.theme-wechat-dark #layer-wechat > .wx-tab-bar .nav-tab i {
    color: var(--wxd-text-2) !important;
}

body.theme-wechat-dark #layer-wechat > .wx-tab-bar .nav-tab.active,
body.theme-wechat-dark #layer-wechat > .wx-tab-bar .nav-tab.active i,
body.theme-wechat-dark a {
    color: var(--wxd-green) !important;
}

body.theme-wechat-dark .btn-primary,
body.theme-wechat-dark .beauty-action-btn,
body.theme-wechat-dark #layer-chat .btn-send {
    background-color: var(--wxd-green-muted) !important;
    border-color: var(--wxd-green-muted) !important;
    color: #fff !important;
}

body.theme-wechat-dark .theme-card {
    background: var(--wxd-surface-2) !important;
    border-color: var(--wxd-line) !important;
}

body.theme-wechat-dark .theme-card.active {
    border-color: var(--wxd-green) !important;
}

.theme-preview-wechat-dark {
    background: #111214;
}
.theme-preview-wechat-dark .tp-nav,
.theme-preview-wechat-dark .tp-bar { background: #191a1c; }
.theme-preview-wechat-dark .tp-card { background: #252629; }
.theme-preview-wechat-dark .tp-card.tp-wechat-right { background: #1f7a46; }
