wui-components-v2 1.1.70 → 1.1.72

package/styles/dark-mode.scss

@@ -1,498 +1,498 @@
-/**
- * 暗黑模式全局样式覆盖
- * 用于强制覆盖 wot-design-uni 组件内部样式（:deep() 无法穿透的场景）
- *
- * 注意：此文件不能使用 scoped，否则无法穿透第三方组件
- *
- * @package wui-components-v2
- *
- * 使用方式：在项目 main.ts 中 import 此文件
- *   import 'wui-components-v2/styles/dark-mode'
- */
-
-/* ====== CSS 变量定义（修正命名不匹配问题）====== */
-/* wot-design-uni 的 kebabCase 转换会把 darkBackground2 → --wot-dark-background-2 */
-/* 但项目中模板引用的是 --wot-dark-background2，需手动补齐 */
-:root,
-.wot-theme-dark {
-  --wot-dark-background: #1b1b1e;
-  --wot-dark-background2: #161616;
-  --wot-dark-background3: #1e1e1e;
-  --wot-dark-background4: #262626;
-  --wot-dark-background5: #333333;
-  --wot-dark-color: #ffffff;
-  --wot-dark-color2: #e8e8e8;
-  --wot-dark-color3: #999999;
-}
-
-/* ====== 暗黑模式下 wot-design-uni 组件内部文字颜色覆盖 ====== */
-.wot-theme-dark {
-  /* Cell 组件 */
-  .wd-cell__title {
-    color: #e8e8e8 !important;
-  }
-
-  .wd-cell__right {
-    color: #666666 !important;
-  }
-
-  .wd-cell__icon {
-    color: #666666 !important;
-  }
-
-  /* CellGroup */
-  .wd-cell-group {
-    background-color: #111111 !important;
-  }
-
-  .wd-cell {
-    background-color: #161616 !important;
-    border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
-
-    &:active {
-      background-color: #1b1b1e !important;
-    }
-  }
-
-  /* Switch 开关 */
-  .wd-switch__node {
-    background-color: #3d3d3d !important;
-  }
-
-  .wd-switch__node--checked {
-    background-color: var(--wot-color-primary, #2164f3) !important;
-  }
-
-  /* Input 输入框 */
-  .wd-input {
-    --wot-input-bg: #252530;
-    --wot-input-inner-color: #e8e8e8;
-    --wot-input-inner-placeholder-color: #fff;
-  }
-
-  /* 原生 input 元素 - 必须用 uni- 前缀类名才能在小程序中命中 */
-  .uni-input-input,
-  .wd-input__input,
-  .wd-input.is-compact .uni-input-input {
-    color: var(--wot-input-inner-color, #e8e8e8) !important;
-    caret-color: var(--wot-color-primary, #2164f3) !important;
-    background-color: transparent !important;
-  }
-
-  .uni-input-placeholder,
-  .wd-input__placeholder,
-  .wd-input.is-compact .uni-input-placeholder {
-    color: #fff !important;
-  }
-
-  /* InputNumber 数字输入框 */
-  .wd-input-number {
-    --wot-input-number-bg: #252530;
-    --wot-input-number-inner-color: #000000;
-  }
-
-  .wd-input-number .uni-input-input,
-  .wd-input-number__input {
-    color: var(--wot-input-number-inner-color, #000000) !important;
-    caret-color: var(--wot-color-primary, #2164f3) !important;
-    background-color: transparent !important;
-  }
-
-  .wd-input-number .uni-input-placeholder,
-  .wd-input-number__input::placeholder,
-  .wd-input-number__placeholder {
-    color: #fff !important;
-  }
-
-  /* Textarea 多行文本输入框 */
-  .wd-textarea {
-    --wot-textarea-bg: #252530;
-    --wot-textarea-inner-color: #e8e8e8;
-    --wot-textarea-inner-placeholder-color: #fff;
-  }
-
-  .wd-textarea__inner {
-    color: var(--wot-textarea-inner-color, #e8e8e8) !important;
-    caret-color: var(--wot-color-primary, #2164f3) !important;
-    background-color: transparent !important;
-  }
-
-  .wd-textarea__inner::placeholder,
-  .wd-textarea__placeholder {
-    color: #fff !important;
-  }
-
-  /* Form 表单 */
-  .wd-form {
-    background-color: transparent;
-  }
-
-  .wd-form-item {
-    background-color: transparent !important;
-
-    .wd-cell {
-      background-color: transparent !important;
-    }
-  }
-
-  .wd-form-item__label,
-  .wd-form-item__title {
-    color: var(--wot-dark-color2, #e8e8e8) !important;
-  }
-
-  .wd-form-item__body {
-    background-color: transparent;
-  }
-
-  /* Button 按钮 */
-  .wd-button--primary {
-    --wd-button-primary-bg-color: var(--wot-color-primary, #2164f3) !important;
-  }
-
-  /* Popup 弹窗 */
-  .wd-popup {
-    background-color: transparent !important;
-  }
-
-  .wd-popup__container {
-    background-color: #161616 !important;
-  }
-
-  .wd-popup__body {
-    background-color: #1b1b1e !important;
-  }
-
-  /* ActionSheet */
-  .wd-action-sheet {
-    background-color: #161616 !important;
-  }
-
-  .wd-action-sheet__title {
-    color: var(--wot-dark-color, #fff) !important;
-  }
-
-  .wd-action-sheet__item {
-    color: var(--wot-dark-color2, #e0e0e0) !important;
-  }
-
-  .wd-action-sheet__action {
-    background-color: #1b1b1e !important;
-  }
-
-  /* Checkbox 复选框 */
-  .wd-checkbox__label {
-    color: var(--wot-dark-color, #fff) !important;
-  }
-
-  /* SelectPicker 选择器弹窗 */
-  .wd-select-picker__wrapper {
-    background-color: #1b1b1e;
-  }
-
-  .wd-select-picker__popup {
-    background-color: #161616 !important;
-  }
-
-  .wd-select-picker__checkbox-label,
-  .wd-select-picker__radio-label {
-    color: var(--wot-dark-color2, #e8e8e8) !important;
-  }
-
-  .wd-select-picker__text-active {
-    color: var(--wot-color-primary, #2164f3) !important;
-  }
-
-  .wd-select-picker__footer {
-    background-color: #161616;
-  }
-
-  /* Calendar 日历选择器弹窗 */
-  .wd-calendar__wrapper {
-    background-color: #1b1b1e;
-  }
-
-  .wd-calendar__popup {
-    background-color: #161616 !important;
-  }
-
-  .wd-calendar__header {
-    color: var(--wot-dark-color, #fff);
-  }
-
-  /* Calendar 日历日期单元格暗黑适配（覆盖 wot-design-uni 内部变量）*/
-  .wd-calendar__view,
-  .wd-month-panel {
-    --wot-calendar-view-day-color: #e8e8e8; /* 日期数字 */
-    --wot-calendar-view-week-color: #999999; /* 星期头（日一二三四五六） */
-    --wot-calendar-view-panel-title-color: #ccc; /* 面板标题（2026年6月） */
-    --wot-calendar-view-control-icon-color: #aaa; /* 左右箭头图标 */
-    --wot-calendar-view-control-color-disabled: #444; /* 禁用箭头 */
-    --wot-calendar-view-color-disabled: #555555; /* 禁用/不可选日期 */
-    --wot-calendar-view-time-picker-color: #e8e8e8; /* 时间选择器文字 */
-    --wot-calendar-view-time-picker-bg: #252530; /* 时间选择器背景 */
-    --wot-calendar-view-range-color: #e8e8e8; /* 区间模式文字色 */
-    background-color: transparent !important;
-  }
-
-  .wd-calendar__tabs {
-    color: var(--wot-dark-color3, #999999) !important;
-  }
-
-  .wd-calendar__shortcuts {
-    border-bottom-color: rgba(255, 255, 255, 0.06);
-  }
-
-  .wd-calendar__view {
-    background-color: transparent;
-    color: var(--wot-dark-color2, #e8e8e8);
-  }
-
-  .wd-calendar__range-item.is-placeholder {
-    color: var(--wot-dark-color3, #666666) !important;
-  }
-
-  .wd-calendar__range-separator {
-    color: var(--wot-dark-color3, #666666) !important;
-  }
-
-  /* YearPanel 年份选择器 */
-  .wd-year-panel {
-    --wot-calendar-bg: #1b1b1e;
-    --wot-picker-view-bg: #1b1b1e;
-    background-color: #1b1b1e;
-  }
-
-  .wd-picker-view {
-    --wot-picker-view-bg: #1b1b1e;
-    --wot-picker-view-mask-start-color: rgba(0, 0, 0, 0.85);
-    --wot-picker-view-mask-end-color: rgba(0, 0, 0, 0.2);
-    --wot-picker-view-roller-bg: #2a2a30;
-    --wot-picker-view-column-item-color: #e8e8e8;
-    background-color: #1b1b1e;
-  }
-
-  /* picker-view 滚轮遮罩 - 暗黑模式下去掉白色渐变 */
-  .wd-picker-view__mask {
-    background-image:
-      linear-gradient(180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2)),
-      linear-gradient(0deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2)) !important;
-  }
-
-  .wd-picker-view__roller {
-    background-color: #2a2a30 !important;
-  }
-
-  .wd-picker-view__column-item {
-    color: #e8e8e8 !important;
-  }
-
-  .wd-picker-view__column-item--active {
-    color: var(--wot-dark-color, #fff) !important;
-  }
-
-  .wd-year-panel__text {
-    color: var(--wot-dark-color2, #e8e8e8);
-  }
-
-  .wd-year-panel__item.is-active .wd-year-panel__text,
-  .wd-year-panel__item.is-active {
-    color: var(--wot-color-primary, #2164f3) !important;
-  }
-
-  /* DateTimePicker 时间选择器弹窗 */
-  .wd-datetime-picker__wrapper {
-    background-color: #1b1b1e;
-    color: var(--wot-dark-color2, #e8e8e8);
-  }
-
-  .wd-datetime-picker__popup {
-    background-color: #161616 !important;
-  }
-
-  &::after {
-    background-color: transparent !important;
-  }
-
-  /* Toast / Notify */
-  .wd-toast {
-    color: #fff !important;
-  }
-
-  /* Picker */
-  .wd-picker__title,
-  .wd-picker__toolbar {
-    color: var(--wot-dark-color2, #e0e0) !important;
-  }
-
-  /* Dialog */
-  .wd-dialog {
-    color: var(--wot-dark-color2, #e0e0e0) !important;
-  }
-
-  .wd-dialog__header {
-    color: var(--wot-dark-color, #fff) !important;
-  }
-
-  /* Loading */
-  .wd-loading-text {
-    color: var(--wot-dark-color3, #a0a0a0) !important;
-  }
-
-  /* Tag 标签 */
-  .wd-tag {
-    color: #fff !important;
-  }
-
-  /* Collapse 折叠面板 */
-  .wd-collapse {
-    background-color: transparent !important;
-  }
-
-  .wd-collapse-item__title {
-    color: var(--wot-dark-color2, #e0e0e0) !important;
-  }
-
-  /* Tabbar tab栏 */
-  .wd-tabbar {
-    background-color: #111111 !important;
-    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
-  }
-
-  /* 未选中：白色 */
-  .wd-tabbar-item {
-    color: #ffffff;
-  }
-  .wd-tabbar-item__body .is-inactive {
-    color: #ffffff !important;
-  }
-
-  /* 选中态：蓝色（同权重，后定义覆盖前） */
-  .wd-tabbar-item--active {
-    color: var(--wot-color-primary, #2164f3) !important;
-  }
-  .wd-tabbar-item--active .wd-icon,
-  .wd-tabbar-item--active .wd-tabbar-item__icon {
-    color: var(--wot-color-primary, #2164f3) !important;
-  }
-  .wd-tabbar-item--active .wd-tabbar-item__body-title {
-    color: var(--wot-color-primary, #2164f3) !important;
-  }
-
-  /* Navbar 导航栏 */
-  .wd-navbar {
-    background-color: #1b1b1e !important;
-  }
-
-  /* Cell 右侧箭头图标 */
-  .wd-cell__arrow {
-    color: #555555 !important;
-  }
-
-  /* Cell 左侧图标 */
-  .wd-cell__left-icon {
-    color: #e0e0e0 !important;
-  }
-
-  /* Card 卡片 - 菜单卡片暗黑背景 */
-  .wd-card {
-    background: linear-gradient(180deg, #1e1e23 0%, #19191e 100%) !important;
-    box-shadow:
-      0 8rpx 32rpx rgba(0, 0, 0, 0.25),
-      0 2rpx 8rpx rgba(0, 0, 0, 0.15) !important;
-    border-color: rgba(255, 255, 255, 0.06) !important;
-  }
-
-  .wd-card__title {
-    color: #f9fafb !important;
-  }
-
-  /* Grid 网格 */
-  .wd-grid-item__text,
-  .wd-grid-item__content text {
-    color: #e5e7eb !important;
-  }
-
-  /* Grid 图标区域 - 去掉白色背景 */
-  .wd-grid-item__wrapper,
-  .wd-grid-item__content {
-    background-color: transparent !important;
-  }
-
-  .wd-grid-item {
-    background-color: transparent !important;
-  }
-
-  /* 快速访问区域（section-menus） */
-  .recent-section {
-    background-color: #1e1e23 !important;
-    box-shadow:
-      0 4px 16px rgba(0, 0, 0, 0.2),
-      inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
-    border: 1px solid rgba(255, 255, 255, 0.06) !important;
-  }
-
-  .recent-label {
-    color: #d1d5db !important;
-  }
-
-  /* 非TabBar区域内的普通图标（排除tabbar避免干扰选中态） */
-  .wd-cell .wd-icon,
-  .wd-navbar .wd-icon,
-  .wd-button .wd-icon {
-    color: #e0e0e0 !important;
-
-    svg,
-    path {
-      fill: currentColor !important;
-      color: currentColor !important;
-    }
-  }
-
-  /* Search 搜索栏 */
-  .wd-search,
-  .wd-search.is-light,
-  .wd-search.is-plain {
-    background: transparent !important;
-    --wot-search-input-bg: #252530 !important;
-    --wot-search-cover-bg: #252530 !important;
-    --wot-search-placeholder-color: #666666 !important;
-    --wot-search-cancel-color: var(--wot-color-primary, #2164f3) !important;
-    --wot-search-icon-color: #888888 !important;
-
-    .wd-search__block {
-      background-color: #252530 !important;
-    }
-
-    .wd-search__cover {
-      background-color: #252530 !important;
-    }
-  }
-
-  /* Rate 评分星级 - 暗黑模式下恢复星星选中效果 */
-  .wd-rate {
-    --wot-rate-color: #555555;
-    --wot-rate-active-color: #f5a623;
-  }
-
-  /* 恢复 wd-rate 星级颜色：放弃 background-clip:text（小程序不支持），改用原生 color 控制 SVG fill */
-  .wd-rate .wd-rate__item-star {
-    background: none !important;
-    -webkit-background-clip: initial !important;
-    background-clip: initial !important;
-    color: var(--wot-rate-color, #555555) !important;
-
-    svg,
-    path {
-      fill: currentColor !important;
-    }
-
-    &.wd-rate__item-star--active {
-      color: var(--wot-rate-active-color, #f5a623) !important;
-
-      svg,
-      path {
-        fill: currentColor !important;
-      }
-    }
-  }
-}
+/**
+ * 暗黑模式全局样式覆盖
+ * 用于强制覆盖 wot-design-uni 组件内部样式（:deep() 无法穿透的场景）
+ *
+ * 注意：此文件不能使用 scoped，否则无法穿透第三方组件
+ *
+ * @package wui-components-v2
+ *
+ * 使用方式：在项目 main.ts 中 import 此文件
+ *   import 'wui-components-v2/styles/dark-mode'
+ */
+
+/* ====== CSS 变量定义（修正命名不匹配问题）====== */
+/* wot-design-uni 的 kebabCase 转换会把 darkBackground2 → --wot-dark-background-2 */
+/* 但项目中模板引用的是 --wot-dark-background2，需手动补齐 */
+:root,
+.wot-theme-dark {
+  --wot-dark-background: #1b1b1e;
+  --wot-dark-background2: #161616;
+  --wot-dark-background3: #1e1e1e;
+  --wot-dark-background4: #262626;
+  --wot-dark-background5: #333333;
+  --wot-dark-color: #ffffff;
+  --wot-dark-color2: #e8e8e8;
+  --wot-dark-color3: #999999;
+}
+
+/* ====== 暗黑模式下 wot-design-uni 组件内部文字颜色覆盖 ====== */
+.wot-theme-dark {
+  /* Cell 组件 */
+  .wd-cell__title {
+    color: #e8e8e8 !important;
+  }
+
+  .wd-cell__right {
+    color: #666666 !important;
+  }
+
+  .wd-cell__icon {
+    color: #666666 !important;
+  }
+
+  /* CellGroup */
+  .wd-cell-group {
+    background-color: #111111 !important;
+  }
+
+  .wd-cell {
+    background-color: #161616 !important;
+    border-bottom: 1px solid rgba(255, 255, 255, 0.04) !important;
+
+    &:active {
+      background-color: #1b1b1e !important;
+    }
+  }
+
+  /* Switch 开关 */
+  .wd-switch__node {
+    background-color: #3d3d3d !important;
+  }
+
+  .wd-switch__node--checked {
+    background-color: var(--wot-color-primary, #2164f3) !important;
+  }
+
+  /* Input 输入框 */
+  .wd-input {
+    --wot-input-bg: #252530;
+    --wot-input-inner-color: #e8e8e8;
+    --wot-input-inner-placeholder-color: #fff;
+  }
+
+  /* 原生 input 元素 - 必须用 uni- 前缀类名才能在小程序中命中 */
+  .uni-input-input,
+  .wd-input__input,
+  .wd-input.is-compact .uni-input-input {
+    color: var(--wot-input-inner-color, #e8e8e8) !important;
+    caret-color: var(--wot-color-primary, #2164f3) !important;
+    background-color: transparent !important;
+  }
+
+  .uni-input-placeholder,
+  .wd-input__placeholder,
+  .wd-input.is-compact .uni-input-placeholder {
+    color: #fff !important;
+  }
+
+  /* InputNumber 数字输入框 */
+  .wd-input-number {
+    --wot-input-number-bg: #252530;
+    --wot-input-number-inner-color: #000000;
+  }
+
+  .wd-input-number .uni-input-input,
+  .wd-input-number__input {
+    color: var(--wot-input-number-inner-color, #000000) !important;
+    caret-color: var(--wot-color-primary, #2164f3) !important;
+    background-color: transparent !important;
+  }
+
+  .wd-input-number .uni-input-placeholder,
+  .wd-input-number__input::placeholder,
+  .wd-input-number__placeholder {
+    color: #fff !important;
+  }
+
+  /* Textarea 多行文本输入框 */
+  .wd-textarea {
+    --wot-textarea-bg: #252530;
+    --wot-textarea-inner-color: #e8e8e8;
+    --wot-textarea-inner-placeholder-color: #fff;
+  }
+
+  .wd-textarea__inner {
+    color: var(--wot-textarea-inner-color, #e8e8e8) !important;
+    caret-color: var(--wot-color-primary, #2164f3) !important;
+    background-color: transparent !important;
+  }
+
+  .wd-textarea__inner::placeholder,
+  .wd-textarea__placeholder {
+    color: #fff !important;
+  }
+
+  /* Form 表单 */
+  .wd-form {
+    background-color: transparent;
+  }
+
+  .wd-form-item {
+    background-color: transparent !important;
+
+    .wd-cell {
+      background-color: transparent !important;
+    }
+  }
+
+  .wd-form-item__label,
+  .wd-form-item__title {
+    color: var(--wot-dark-color2, #e8e8e8) !important;
+  }
+
+  .wd-form-item__body {
+    background-color: transparent;
+  }
+
+  /* Button 按钮 */
+  .wd-button--primary {
+    --wd-button-primary-bg-color: var(--wot-color-primary, #2164f3) !important;
+  }
+
+  /* Popup 弹窗 */
+  .wd-popup {
+    background-color: transparent !important;
+  }
+
+  .wd-popup__container {
+    background-color: #161616 !important;
+  }
+
+  .wd-popup__body {
+    background-color: #1b1b1e !important;
+  }
+
+  /* ActionSheet */
+  .wd-action-sheet {
+    background-color: #161616 !important;
+  }
+
+  .wd-action-sheet__title {
+    color: var(--wot-dark-color, #fff) !important;
+  }
+
+  .wd-action-sheet__item {
+    color: var(--wot-dark-color2, #e0e0e0) !important;
+  }
+
+  .wd-action-sheet__action {
+    background-color: #1b1b1e !important;
+  }
+
+  /* Checkbox 复选框 */
+  .wd-checkbox__label {
+    color: var(--wot-dark-color, #fff) !important;
+  }
+
+  /* SelectPicker 选择器弹窗 */
+  .wd-select-picker__wrapper {
+    background-color: #1b1b1e;
+  }
+
+  .wd-select-picker__popup {
+    background-color: #161616 !important;
+  }
+
+  .wd-select-picker__checkbox-label,
+  .wd-select-picker__radio-label {
+    color: var(--wot-dark-color2, #e8e8e8) !important;
+  }
+
+  .wd-select-picker__text-active {
+    color: var(--wot-color-primary, #2164f3) !important;
+  }
+
+  .wd-select-picker__footer {
+    background-color: #161616;
+  }
+
+  /* Calendar 日历选择器弹窗 */
+  .wd-calendar__wrapper {
+    background-color: #1b1b1e;
+  }
+
+  .wd-calendar__popup {
+    background-color: #161616 !important;
+  }
+
+  .wd-calendar__header {
+    color: var(--wot-dark-color, #fff);
+  }
+
+  /* Calendar 日历日期单元格暗黑适配（覆盖 wot-design-uni 内部变量）*/
+  .wd-calendar__view,
+  .wd-month-panel {
+    --wot-calendar-view-day-color: #e8e8e8; /* 日期数字 */
+    --wot-calendar-view-week-color: #999999; /* 星期头（日一二三四五六） */
+    --wot-calendar-view-panel-title-color: #ccc; /* 面板标题（2026年6月） */
+    --wot-calendar-view-control-icon-color: #aaa; /* 左右箭头图标 */
+    --wot-calendar-view-control-color-disabled: #444; /* 禁用箭头 */
+    --wot-calendar-view-color-disabled: #555555; /* 禁用/不可选日期 */
+    --wot-calendar-view-time-picker-color: #e8e8e8; /* 时间选择器文字 */
+    --wot-calendar-view-time-picker-bg: #252530; /* 时间选择器背景 */
+    --wot-calendar-view-range-color: #e8e8e8; /* 区间模式文字色 */
+    background-color: transparent !important;
+  }
+
+  .wd-calendar__tabs {
+    color: var(--wot-dark-color3, #999999) !important;
+  }
+
+  .wd-calendar__shortcuts {
+    border-bottom-color: rgba(255, 255, 255, 0.06);
+  }
+
+  .wd-calendar__view {
+    background-color: transparent;
+    color: var(--wot-dark-color2, #e8e8e8);
+  }
+
+  .wd-calendar__range-item.is-placeholder {
+    color: var(--wot-dark-color3, #666666) !important;
+  }
+
+  .wd-calendar__range-separator {
+    color: var(--wot-dark-color3, #666666) !important;
+  }
+
+  /* YearPanel 年份选择器 */
+  .wd-year-panel {
+    --wot-calendar-bg: #1b1b1e;
+    --wot-picker-view-bg: #1b1b1e;
+    background-color: #1b1b1e;
+  }
+
+  .wd-picker-view {
+    --wot-picker-view-bg: #1b1b1e;
+    --wot-picker-view-mask-start-color: rgba(0, 0, 0, 0.85);
+    --wot-picker-view-mask-end-color: rgba(0, 0, 0, 0.2);
+    --wot-picker-view-roller-bg: #2a2a30;
+    --wot-picker-view-column-item-color: #e8e8e8;
+    background-color: #1b1b1e;
+  }
+
+  /* picker-view 滚轮遮罩 - 暗黑模式下去掉白色渐变 */
+  .wd-picker-view__mask {
+    background-image:
+      linear-gradient(180deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2)),
+      linear-gradient(0deg, rgba(0, 0, 0, 0.85), rgba(0, 0, 0, 0.2)) !important;
+  }
+
+  .wd-picker-view__roller {
+    background-color: #2a2a30 !important;
+  }
+
+  .wd-picker-view__column-item {
+    color: #e8e8e8 !important;
+  }
+
+  .wd-picker-view__column-item--active {
+    color: var(--wot-dark-color, #fff) !important;
+  }
+
+  .wd-year-panel__text {
+    color: var(--wot-dark-color2, #e8e8e8);
+  }
+
+  .wd-year-panel__item.is-active .wd-year-panel__text,
+  .wd-year-panel__item.is-active {
+    color: var(--wot-color-primary, #2164f3) !important;
+  }
+
+  /* DateTimePicker 时间选择器弹窗 */
+  .wd-datetime-picker__wrapper {
+    background-color: #1b1b1e;
+    color: var(--wot-dark-color2, #e8e8e8);
+  }
+
+  .wd-datetime-picker__popup {
+    background-color: #161616 !important;
+  }
+
+  &::after {
+    background-color: transparent !important;
+  }
+
+  /* Toast / Notify */
+  .wd-toast {
+    color: #fff !important;
+  }
+
+  /* Picker */
+  .wd-picker__title,
+  .wd-picker__toolbar {
+    color: var(--wot-dark-color2, #e0e0) !important;
+  }
+
+  /* Dialog */
+  .wd-dialog {
+    color: var(--wot-dark-color2, #e0e0e0) !important;
+  }
+
+  .wd-dialog__header {
+    color: var(--wot-dark-color, #fff) !important;
+  }
+
+  /* Loading */
+  .wd-loading-text {
+    color: var(--wot-dark-color3, #a0a0a0) !important;
+  }
+
+  /* Tag 标签 */
+  .wd-tag {
+    color: #fff !important;
+  }
+
+  /* Collapse 折叠面板 */
+  .wd-collapse {
+    background-color: transparent !important;
+  }
+
+  .wd-collapse-item__title {
+    color: var(--wot-dark-color2, #e0e0e0) !important;
+  }
+
+  /* Tabbar tab栏 */
+  .wd-tabbar {
+    background-color: #111111 !important;
+    border-top: 1px solid rgba(255, 255, 255, 0.06) !important;
+  }
+
+  /* 未选中：白色 */
+  .wd-tabbar-item {
+    color: #ffffff;
+  }
+  .wd-tabbar-item__body .is-inactive {
+    color: #ffffff !important;
+  }
+
+  /* 选中态：蓝色（同权重，后定义覆盖前） */
+  .wd-tabbar-item--active {
+    color: var(--wot-color-primary, #2164f3) !important;
+  }
+  .wd-tabbar-item--active .wd-icon,
+  .wd-tabbar-item--active .wd-tabbar-item__icon {
+    color: var(--wot-color-primary, #2164f3) !important;
+  }
+  .wd-tabbar-item--active .wd-tabbar-item__body-title {
+    color: var(--wot-color-primary, #2164f3) !important;
+  }
+
+  /* Navbar 导航栏 */
+  .wd-navbar {
+    background-color: #1b1b1e !important;
+  }
+
+  /* Cell 右侧箭头图标 */
+  .wd-cell__arrow {
+    color: #555555 !important;
+  }
+
+  /* Cell 左侧图标 */
+  .wd-cell__left-icon {
+    color: #e0e0e0 !important;
+  }
+
+  /* Card 卡片 - 菜单卡片暗黑背景 */
+  .wd-card {
+    background: linear-gradient(180deg, #1e1e23 0%, #19191e 100%) !important;
+    box-shadow:
+      0 8rpx 32rpx rgba(0, 0, 0, 0.25),
+      0 2rpx 8rpx rgba(0, 0, 0, 0.15) !important;
+    border-color: rgba(255, 255, 255, 0.06) !important;
+  }
+
+  .wd-card__title {
+    color: #f9fafb !important;
+  }
+
+  /* Grid 网格 */
+  .wd-grid-item__text,
+  .wd-grid-item__content text {
+    color: #e5e7eb !important;
+  }
+
+  /* Grid 图标区域 - 去掉白色背景 */
+  .wd-grid-item__wrapper,
+  .wd-grid-item__content {
+    background-color: transparent !important;
+  }
+
+  .wd-grid-item {
+    background-color: transparent !important;
+  }
+
+  /* 快速访问区域（section-menus） */
+  .recent-section {
+    background-color: #1e1e23 !important;
+    box-shadow:
+      0 4px 16px rgba(0, 0, 0, 0.2),
+      inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
+    border: 1px solid rgba(255, 255, 255, 0.06) !important;
+  }
+
+  .recent-label {
+    color: #d1d5db !important;
+  }
+
+  /* 非TabBar区域内的普通图标（排除tabbar避免干扰选中态） */
+  .wd-cell .wd-icon,
+  .wd-navbar .wd-icon,
+  .wd-button .wd-icon {
+    color: #e0e0e0 !important;
+
+    svg,
+    path {
+      fill: currentColor !important;
+      color: currentColor !important;
+    }
+  }
+
+  /* Search 搜索栏 */
+  .wd-search,
+  .wd-search.is-light,
+  .wd-search.is-plain {
+    background: transparent !important;
+    --wot-search-input-bg: #252530 !important;
+    --wot-search-cover-bg: #252530 !important;
+    --wot-search-placeholder-color: #666666 !important;
+    --wot-search-cancel-color: var(--wot-color-primary, #2164f3) !important;
+    --wot-search-icon-color: #888888 !important;
+
+    .wd-search__block {
+      background-color: #252530 !important;
+    }
+
+    .wd-search__cover {
+      background-color: #252530 !important;
+    }
+  }
+
+  /* Rate 评分星级 - 暗黑模式下恢复星星选中效果 */
+  .wd-rate {
+    --wot-rate-color: #555555;
+    --wot-rate-active-color: #f5a623;
+  }
+
+  /* 恢复 wd-rate 星级颜色：放弃 background-clip:text（小程序不支持），改用原生 color 控制 SVG fill */
+  .wd-rate .wd-rate__item-star {
+    background: none !important;
+    -webkit-background-clip: initial !important;
+    background-clip: initial !important;
+    color: var(--wot-rate-color, #555555) !important;
+
+    svg,
+    path {
+      fill: currentColor !important;
+    }
+
+    &.wd-rate__item-star--active {
+      color: var(--wot-rate-active-color, #f5a623) !important;
+
+      svg,
+      path {
+        fill: currentColor !important;
+      }
+    }
+  }
+}