/* ============================================================
   theme-tokens.css · 全站全局设计层  v20261027t1
   作用：以"变量重定义 + Element 控件统一"的方式，让会员中心
        所有页面（含插件页）与购物车主题 shiguangyun222 共享
        同一套腾讯云风格设计系统（浅蓝 #0052d9 / 价格红 #f0142f）
   原则：1. 不改任何既有文件，本文件独立可回滚（header.php 删一行即下线）
        2. 颜色优先靠变量传导（--color-* 全站已变量化），
           控件只统一圆角/阴影/过渡等观感关键项
        3. 布局类规则一律不碰（页面布局归各页面 css 管）
   说明：theme/index.js 会动态在 head 末尾追加 theme/default/index.css，
        其变量定义与本项目同名，故变量重定义必须带 !important
   ============================================================ */

/* ============ 1. 设计令牌（变量重定义） ============ */
:root[theme='default'] {
  /* 主色：腾讯云蓝（原 #1A56DB） */
  --color-primary: #3d7bff !important;
  --color-primary-hover: #2b6de5;
  --color-primary-light: #ecf2fe;
  /* 语义色微调（与购物车主题一致） */
  --color-success: #16b779 !important;
  --color-warning: #ff7d00 !important;
  --color-danger: #e54545 !important;
  --color-info: #8c8c8c !important;
  /* 价格/优惠（保持系统既有红色系不变） */
  --color-price-text: #f0142f;
  --color-discount-num: #f99600;
  --color-cash-num: #f0142f;
  /* 设计令牌别名：与购物车主题 goods/settlement css 同名互通 */
  --cz-primary: #3d7bff;
  --cz-primary-hover: #2b6de5;
  --cz-primary-light: #ecf2fe;
  --cz-bg: #f4f6fa;
  --cz-card: #ffffff;
  --cz-text: #232a3d;
  --cz-text-2: #5c6780;
  --cz-text-3: #939cad;
  --cz-border: #e5e9f2;
  --cz-price: #f0142f;
  --cz-radius: 12px;
  --cz-radius-s: 8px;
  --cz-shadow: 0 1px 4px rgba(15, 34, 87, 0.06);
  --cz-shadow-md: 0 4px 16px rgba(15, 34, 87, 0.08);
}

/* ============ 2. 基础观感 ============ */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* 文本选中色与主色呼应 */
::selection {
  background: var(--color-primary-light);
  color: var(--color-text, #232a3d);
}
/* 全站滚动条统一（WebKit） */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}
::-webkit-scrollbar-thumb {
  background: #ccd3e0;
  border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
  background: #b2bccf;
}
::-webkit-scrollbar-track {
  background: transparent;
}

/* ============ 3. Element 控件统一 ============ */
/* ---- 按钮：统一圆角与过渡，颜色由变量自动传导 ---- */
.el-button {
  border-radius: 8px !important;
  transition: all 0.2s ease;
}
.el-button--primary {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.el-button--primary:hover,
.el-button--primary:focus {
  background-color: var(--color-primary-hover);
  border-color: var(--color-primary-hover);
}
.el-button--mini,
.el-button--small {
  border-radius: 6px !important;
}
/* ---- 输入框 / 文本域 / 选择器 ---- */
.el-input__inner {
  border-radius: 8px !important;
  transition: border-color 0.2s ease;
}
.el-input__inner:hover {
  border-color: #b8c4dd;
}
.el-textarea__inner {
  border-radius: 8px !important;
  transition: border-color 0.2s ease;
}
.el-select-dropdown__item.selected {
  color: var(--color-primary);
  font-weight: 600;
}
/* ---- 复选框 / 单选框 / 开关 ---- */
.el-checkbox__inner {
  border-radius: 3px;
}
.el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.el-radio__input.is-checked .el-radio__inner {
  border-color: var(--color-primary);
  background: var(--color-primary);
}
.el-radio__input.is-checked + .el-radio__label {
  color: var(--color-primary);
}
.el-switch.is-checked .el-switch__core {
  border-color: var(--color-primary);
  background-color: var(--color-primary);
}
/* ---- 标签 ---- */
.el-tag {
  border-radius: 6px;
}
/* ---- 标签页 ---- */
.el-tabs__item.is-active {
  color: var(--color-primary);
}
.el-tabs__active-bar {
  background-color: var(--color-primary);
}
.el-tabs__item:hover {
  color: var(--color-primary);
}
/* ---- 弹窗 / 气泡 / 消息 ---- */
.el-dialog {
  border-radius: 12px;
  overflow: hidden;
}
.el-dialog__title {
  font-weight: 600;
}
.el-message-box {
  border-radius: 12px;
}
.el-popover {
  border-radius: 10px;
}
.el-message {
  border-radius: 10px;
}
/* ---- 表格：表头文字层次 ---- */
.el-table th.el-table__cell {
  color: #5c6780;
  font-weight: 600;
}
.el-table .el-table__cell {
  transition: background 0.15s ease;
}
/* ---- 分页 ---- */
.el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: var(--color-primary);
}
.el-pagination.is-background .el-pager li:not(.disabled):hover {
  color: var(--color-primary);
}
/* ---- 加载动画颜色随主色 ---- */
.el-loading-spinner .path {
  stroke: var(--color-primary);
}
/* ---- 空状态 ---- */
.el-empty__description p {
  color: var(--cz-text-3, #939cad);
}

/* ============ 4. 卡片悬停（克制版，仅阴影与边框，无位移） ============ */
.el-card {
  border-radius: 12px;
  border-color: var(--cz-border, #e5e9f2);
  box-shadow: var(--cz-shadow, 0 1px 4px rgba(15, 34, 87, 0.06));
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}
.el-card:hover {
  box-shadow: var(--cz-shadow-md, 0 4px 16px rgba(15, 34, 87, 0.08));
  border-color: #d5deee;
}

/* ============ 5. 骨架屏工具类（供页面按需使用） ============ */
.sg-skeleton {
  position: relative;
  overflow: hidden;
  background: #edf0f6;
  border-radius: 6px;
}
.sg-skeleton::after {
  content: "";
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.55) 50%,
    rgba(255, 255, 255, 0) 100%
  );
  animation: sg-shimmer 1.4s infinite;
}
@keyframes sg-shimmer {
  100% {
    transform: translateX(100%);
  }
}
/* 组合：标题行 + 内容块骨架 */
.sg-skeleton--text {
  height: 14px;
  width: 60%;
}
.sg-skeleton--btn {
  height: 36px;
  width: 96px;
  border-radius: 8px;
}

/* ============ 8. 插件页适配 ============ */
/* 拼团（group_buy_gzhx，页面类名前缀 gzhx-）：
   原设计为橙红营销色，统一到全站主题蓝（#0052d9）。
   仅覆盖色彩层，不改动插件布局与逻辑。 */
.gzhx-hero-btn {
  background: linear-gradient(90deg, #0052d9, #2b6de5) !important;
  box-shadow: 0 4px 14px rgba(0, 82, 217, 0.3) !important;
}
.gzhx-hero {
  background: linear-gradient(
    120deg,
    #ecf2fe 0%,
    #ffffff 55%,
    #f4f6fa 100%
  ) !important;
}
.gzhx-cta {
  color: #0052d9 !important;
}
.gzhx-cta:hover {
  color: #2b6de5 !important;
}
.gzhx-back {
  color: var(--cz-text-2, #5c6780) !important;
}

/* ============ 7. 结算底栏（st-footer）跨页残留修复 ============ */
/* 结算页的底部结算条是 fixed 定位；从结算页经侧边栏切往其他页面时，
   该底栏可能随页面切换残留在目标页上。全局层默认隐藏，
   仅结算页（其 HTML 含 settlement.css 引入）通过 :has 恢复显示。 */
.st-footer,
.st-footer__inner {
  display: none !important;
}
html:has(link[href*="settlement.css"]) .st-footer, body.sg-page-settle .st-footer {
  display: block !important;
}
html:has(link[href*="settlement.css"]) .st-footer__inner, body.sg-page-settle .st-footer__inner {
  display: flex !important;
}

/* ============ 6. 移动端微调（<=768px，仅控件级） ============ */
@media screen and (max-width: 768px) {
  /* 触控目标最小高度：按钮 / 输入 / 分页项 */
  .el-button {
    min-height: 36px;
  }
  .el-input__inner {
    height: 36px;
    line-height: 36px;
  }
  /* 弹窗贴边更自然 */
  .el-dialog {
    width: 92% !important;
    margin-top: 8vh !important;
  }
  .el-message {
    max-width: 92vw;
    min-width: auto;
  }
}

/* ============ 9. 顶栏暗色模式按钮 ============ */
/* 20261028t10 顶栏图标布局重调：
   1) 功能图标(首页/通知/月亮/语言)之间间距 20px -> 12px
   2) 月亮按钮与其它图标统一为 32px 圆形并加浅灰圆边框(#F2F3F5，与 SVG 自带描边一致)
   3) 购物车 -> 头像 使用第二档间距 24px */
.el-header .yfx-header-home,
.el-header .yfx-header-notice,
.el-header .yfx-header-lau {
  margin-right: 12px !important;
}
.el-header .yfx-header-dark {
  flex-shrink: 0;
  margin-right: 12px !important;
}
/* ---- 20261028t10 暗色切换开关：Uiverse.io Creatlydev (massive-quail-70) 适配版 ----
   原组件 56px，适配顶栏 32px 圆形规格；#switch -> #sg-dark-switch */
.el-header .sg-toggle {
  background-color: #fff;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 1px solid #F2F3F5;
  box-sizing: border-box;
  display: grid;
  place-items: center;
  cursor: pointer;
  line-height: 1;
  transition: box-shadow 0.2s ease;
}
.el-header .sg-toggle:hover {
  box-shadow: 0 0 0 4px rgba(0, 82, 217, 0.06);
}
.el-header .sg-toggle .input {
  display: none;
}
.el-header .sg-toggle .icon {
  grid-column: 1 / 1;
  grid-row: 1 / 1;
  transition: transform 500ms;
  line-height: 0.1;
  display: flex;
  align-items: center;
  justify-content: center;
}
.el-header .sg-toggle .icon svg {
  width: 18px;
  height: 18px;
}
.el-header .sg-toggle .icon--moon {
  transition-delay: 200ms;
  color: #5c6780;
}
.el-header .sg-toggle .icon--sun {
  transform: scale(0);
  color: #ffd166;
}
.el-header .sg-toggle .input:checked + .icon--moon {
  transform: rotate(360deg) scale(0);
}
.el-header .sg-toggle .input:checked ~ .icon--sun {
  transition-delay: 200ms;
  transform: scale(1) rotate(360deg);
}
/* 登录态头像与顶栏右缘保持间距 */
.el-header .yfx-header-name {
  margin-right: 8px;
}
/* 购物车 -> 头像：第二档间距(功能图标间距的 2 倍) */
.el-header .yfx-header-shop {
  margin-right: 24px !important;
}


/* ============ 10. Dark mode root tokens (high specificity) ============ */
:root[theme='default'][data-mode='dark'] {
  --color-primary: #4d8dff;
  --cz-primary: #4d8dff;
  --cz-primary-hover: #6ba1ff;
  --cz-primary-light: #1c2a45;
  --cz-bg: #10141c;
  --cz-card: #171c26;
  --cz-text: #e5e9f2;
  --cz-text-2: #a8b3c7;
  --cz-text-3: #6b7690;
  --cz-border: #2a3140;
  --cz-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
  --cz-shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5);
  color-scheme: dark;
}

/* ============ 6. Mobile tweaks (controls only) ============ */
@media screen and (max-width: 768px) {
  .el-button {
    min-height: 36px;
  }
  .el-input__inner {
    height: 36px;
    line-height: 36px;
  }
  .el-dialog {
    width: 92% !important;
    margin-top: 8vh !important;
  }
  .el-message {
    max-width: 92vw;
    min-width: auto;
  }
}

/* ============ 11. Dark mode v2: page-level cards fallback ============ */
html[data-mode='dark'] body .yfx-boxle-b,
html[data-mode='dark'] body .yfx-boxle-b1,
html[data-mode='dark'] body .yfx-boxle-b1r,
html[data-mode='dark'] body .yfx-bzhbox,
html[data-mode='dark'] body .money-box,
html[data-mode='dark'] body .money-credit,
html[data-mode='dark'] body .stat-card,
html[data-mode='dark'] body .product-list-box,
html[data-mode='dark'] body .right-box,
html[data-mode='dark'] body .el-tabs__nav-wrap,
html[data-mode='dark'] body .el-collapse,
html[data-mode='dark'] body .el-collapse-item__header,
html[data-mode='dark'] body .el-collapse-item__wrap,
html[data-mode='dark'] body .el-descriptions__body,
html[data-mode='dark'] body .el-dropdown-menu,
html[data-mode='dark'] body .el-popover,
html[data-mode='dark'] body .el-tooltip__popper,
html[data-mode='dark'] body .sc-card,
html[data-mode='dark'] body .st-card,
html[data-mode='dark'] body .g-card,
html[data-mode='dark'] body .gl-card,
html[data-mode='dark'] body .gl-hero,
html[data-mode='dark'] body .gl-domain__main,
html[data-mode='dark'] body .gl-domain__side,
html[data-mode='dark'] body .gl-car-item {
  background-color: var(--cz-card) !important;
  color: #d7dceb;
}
html[data-mode='dark'] body .yfx-bzhbox,
html[data-mode='dark'] body .stat-card,
html[data-mode='dark'] body .money-box,
html[data-mode='dark'] body .money-credit {
  background-color: #1b2231 !important;
}
html[data-mode='dark'] body .el-tabs__item {
  color: #8b95ad;
}
html[data-mode='dark'] body .el-tabs__item.is-active {
  color: var(--color-primary);
}
html[data-mode='dark'] body .el-dropdown-menu__item {
  color: #d7dceb;
}
html[data-mode='dark'] body .el-dropdown-menu__item:hover {
  background: #26304a;
  color: #fff;
}

/* ============ 12. Dark mode v3: containers + global text layer ============ */
html[data-mode='dark'] body .template,
html[data-mode='dark'] body .el-container,
html[data-mode='dark'] body .el-container:nth-child(2),
html[data-mode='dark'] body .main-content,
html[data-mode='dark'] body .yfx-boxle-b,
html[data-mode='dark'] body .yfx-boxle-b1,
html[data-mode='dark'] body .yfx-boxle-b1r,
html[data-mode='dark'] body .product-list-box,
html[data-mode='dark'] body .right-box {
  background: var(--cz-card) !important;
  background-image: none !important;
  color: #d7dceb;
}
html[data-mode='dark'] body .template a:not(.el-button) {
  color: var(--color-primary);
}
html[data-mode='dark'] body .el-tabs__nav-wrap::after {
  background-color: var(--cz-border);
}
html[data-mode='dark'] body .el-table td,
html[data-mode='dark'] body .el-table th.is-leaf {
  border-bottom-color: var(--cz-border);
}

/* ============ 12. 顶栏图标点击交互 + 动画汉堡（20261028t11） ============ */
/* 12.1 功能图标统一 hover/按压反馈（首页/铃铛/语言/购物车） */
.el-header .yfx-header-home,
.el-header .yfx-header-notice,
.el-header .yfx-header-lau,
.el-header .yfx-header-shop,
.el-header .el-dropdown-country,
.el-header .el-dropdown-header,
.el-header .yfx-header-namebox,
.el-header .yfx-header-avatarbox {
  transition: transform 0.18s ease, box-shadow 0.18s ease;
  will-change: transform;
}
.el-header .yfx-header-home:hover,
.el-header .yfx-header-notice:hover,
.el-header .yfx-header-lau:hover,
.el-header .yfx-header-shop:hover,
.el-header .el-dropdown-country:hover,
.el-header .el-dropdown-header:hover,
.el-header .yfx-header-namebox:hover,
.el-header .yfx-header-avatarbox:hover {
  transform: scale(1.1);
}
.el-header .yfx-header-home:active,
.el-header .yfx-header-notice:active,
.el-header .yfx-header-lau:active,
.el-header .yfx-header-shop:active,
.el-header .el-dropdown-country:active,
.el-header .el-dropdown-header:active,
.el-header .yfx-header-namebox:active,
.el-header .yfx-header-avatarbox:active {
  transform: scale(0.86);
}

/* 12.2 点击动画 keyframes */
/* 铃铛：摇铃 */
@keyframes yfxSwing {
  0% { transform: rotate(0); }
  15% { transform: rotate(14deg); }
  30% { transform: rotate(-11deg); }
  45% { transform: rotate(8deg); }
  60% { transform: rotate(-5deg); }
  75% { transform: rotate(2deg); }
  100% { transform: rotate(0); }
}
.yfx-anim-swing {
  animation: yfxSwing 0.7s ease;
  transform-origin: 50% 12%;
}
/* 语言：翻面一圈 */
@keyframes yfxFlip {
  0% { transform: rotateY(0); }
  100% { transform: rotateY(360deg); }
}
.yfx-anim-flip {
  animation: yfxFlip 0.6s ease-in-out;
  backface-visibility: visible;
}
/* 购物车：弹跳 */
@keyframes yfxBounce {
  0% { transform: translateY(0); }
  30% { transform: translateY(-5px); }
  55% { transform: translateY(0); }
  75% { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}
.yfx-anim-bounce {
  animation: yfxBounce 0.5s ease;
}
/* 头像：按压回弹 + 光环 */
@keyframes yfxPop {
  0% { transform: scale(1); box-shadow: 0 0 0 0 rgba(0, 82, 217, 0); }
  35% { transform: scale(0.9); box-shadow: 0 0 0 0 rgba(0, 82, 217, 0.25); }
  70% { transform: scale(1.06); box-shadow: 0 0 0 6px rgba(0, 82, 217, 0); }
  100% { transform: scale(1); box-shadow: 0 0 0 0 rgba(0, 82, 217, 0); }
}
.yfx-anim-pop {
  animation: yfxPop 0.6s ease;
  border-radius: 50%;
}

/* 12.3 动画汉堡（Uiverse hoshikawamaki/cowardly-cougar-86 适配版，灰黑 #4E5969） */
/* 仅移动端顶栏显示（与原 .menu-img 可见窗口一致），桌面沿用 .menu-img{display:none} */
@media screen and (max-width: 750px) {
  .el-header .menu-burger {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: auto;
    height: 0.56rem;
    padding: 0 8px;
    cursor: pointer;
    border-radius: 8px;
    box-sizing: border-box;
    flex-shrink: 0;
    transition: background 0.2s ease;
  }
  .el-header .menu-burger:hover {
    background: rgba(0, 82, 217, 0.06);
  }
  .el-header .menu-burger-input {
    display: none;
  }
  .el-header .menu-burger-line {
    display: block;
    height: 4px;
    border-radius: 4px;
    background: #4e5969;
    transition: all 0.3s ease;
  }
  .el-header .menu-burger-line--1 {
    width: 17px;
    transform-origin: right center;
  }
  .el-header .menu-burger-line--2 {
    width: 25px;
    transform-origin: center center;
  }
  .el-header .menu-burger-line--3 {
    width: 17px;
    transform-origin: right center;
  }
  /* 勾选（抽屉打开）：三线变箭头 */
  .el-header .menu-burger-input:checked ~ .menu-burger-line--1 {
    width: 25px;
    transform: rotate(-30deg) translateY(-6px);
  }
  .el-header .menu-burger-input:checked ~ .menu-burger-line--2 {
    transform: rotate(90deg) translateX(5px);
  }
  .el-header .menu-burger-input:checked ~ .menu-burger-line--3 {
    width: 25px;
    transform: rotate(30deg) translateY(6px);
  }
}

/* ============ 13. 侧边栏展开/收起把手（20261028t13 腾讯云风格） ============ */
/* 细长贴边条 + 精细双箭头（» 展开 / « 收起），去文字，hover 品牌蓝 #0052d9 */

/* 13.1 浮动展开把手（屏幕左缘中部，抽屉关闭时显示，仅移动端） */
body .drawer-open-tab {
  position: fixed;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 72px;
  background: rgba(255, 255, 255, 0.96);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid #e7eaef;
  border-left: none;
  border-radius: 0 10px 10px 0;
  box-shadow: 3px 4px 14px rgba(15, 23, 42, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 100;
  cursor: pointer;
  color: #4e5969;
  animation: drawerTabBreath 3s ease-in-out infinite;
  transition: color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
body .drawer-open-tab:hover {
  color: #0052d9;
  box-shadow: 3px 5px 16px rgba(0, 82, 217, 0.16);
}
body .drawer-open-tab:active {
  transform: translateY(-50%) scale(0.94);
}
body .drawer-open-tab .drawer-tab-icon {
  width: 14px;
  height: 14px;
  display: block;
}
/* 呼吸光圈（更细腻：品牌蓝极淡扩散） */
@keyframes drawerTabBreath {
  0%, 100% { box-shadow: 3px 4px 14px rgba(15, 23, 42, 0.08), 0 0 0 0 rgba(0, 82, 217, 0.12); }
  55% { box-shadow: 3px 4px 14px rgba(15, 23, 42, 0.08), 0 0 0 6px rgba(0, 82, 217, 0); }
}

/* 13.2 收起把手（抽屉右缘中部，镜像；覆盖 shell-redesign 的玫红大色块） */
.el-drawer .drawer-close-tab {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 72px;
  background: rgba(255, 255, 255, 0.96);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border: 1px solid #e7eaef;
  border-right: none;
  border-radius: 10px 0 0 10px;
  box-shadow: -3px 4px 14px rgba(15, 23, 42, 0.08);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  cursor: pointer;
  color: #4e5969;
  transition: color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}
.el-drawer .drawer-close-tab:hover {
  color: #0052d9;
  box-shadow: -3px 5px 16px rgba(0, 82, 217, 0.16);
}
.el-drawer .drawer-close-tab:active {
  transform: translateY(-50%) scale(0.94);
}
.el-drawer .drawer-close-tab .drawer-tab-icon {
  width: 14px;
  height: 14px;
  display: block;
}

/* ============ 14. 全站暗色模式深度适配（20261028t14，腾讯云风格暗色体系） ============ */
/* 层次：底 #10141c / 卡片 #171c26 / 浮层输入 #1c212c / 高亮 #1c2a45 / 边框 #2a3140 / 文字 #e5e9f2 #a8b3c7 #6b7690 */

/* 14.0 全局基底：底色与默认文字 */
html[data-mode='dark'] body {
  background: #10141c !important;
  color: #e5e9f2;
}
html[data-mode='dark'] body h1,
html[data-mode='dark'] body h2,
html[data-mode='dark'] body h3,
html[data-mode='dark'] body h4,
html[data-mode='dark'] body h5,
html[data-mode='dark'] body h6 {
  color: #e5e9f2;
}

/* 14.1 顶栏胶囊（覆盖 shell-redesign 白色 !important） */
html[data-mode='dark'] .el-header {
  background: #1e2534 !important;
  border-color: #323b4f !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.55), 0 8px 10px -6px rgba(0, 0, 0, 0.45) !important;
}
/* 顶栏 SVG 背景图标变亮（filter 只作用于图标 div 自身的背景图） */
html[data-mode='dark'] .el-header .yfx-header-home,
html[data-mode='dark'] .el-header .yfx-header-notice,
html[data-mode='dark'] .el-header .yfx-header-lau,
html[data-mode='dark'] .el-header .yfx-header-shop {
  filter: brightness(0) invert(0.88);
}
html[data-mode='dark'] .el-header .menu-burger-line {
  background: #cfd6e4;
}
html[data-mode='dark'] .el-header .menu-burger:hover {
  background: rgba(255, 255, 255, 0.08);
}
/* 暗色切换开关容器与边框 */
html[data-mode='dark'] .el-header .sg-toggle {
  background-color: #262e40;
  border-color: #3a4358;
}
html[data-mode='dark'] .el-header .sg-toggle:hover {
  box-shadow: 0 0 0 4px rgba(77, 141, 255, 0.14);
}
/* 外层容器不做 hover 背景（非圆形会露出方角）；hover 光圈由圆形 .sg-toggle 提供 */

/* 14.2 桌面侧边栏浮卡 */
html[data-mode='dark'] .el-aside {
  background: #1a2130 !important;
  border-color: #323b4f !important;
  box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.5), 0 8px 10px -6px rgba(0, 0, 0, 0.4) !important;
}
html[data-mode='dark'] .el-aside .menu-top .el-menu-item,
html[data-mode='dark'] .el-aside .menu-top .el-submenu__title {
  color: #a8b3c7 !important;
  background: transparent !important;
}
html[data-mode='dark'] .el-aside .menu-top .el-menu-item:hover,
html[data-mode='dark'] .el-aside .menu-top .el-submenu__title:hover {
  background: #1c222e !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] .el-aside .menu-top .el-menu-item.is-active {
  background: #1c2a45 !important;
  color: #4d8dff !important;
}
html[data-mode='dark'] .el-aside .menu-top .el-menu-item.menu-group-title {
  color: #6b7690 !important;
}
html[data-mode='dark'] .el-aside .menu-top .el-submenu__title .el-submenu__icon-arrow,
html[data-mode='dark'] .el-aside .menu-top .el-menu-item .iconfont {
  color: #6b7690;
}

/* 14.3 移动端抽屉与把手 */
html[data-mode='dark'] .el-drawer {
  background: #1a2130 !important;
}
html[data-mode='dark'] .el-drawer__body {
  background: #1a2130 !important;
}
html[data-mode='dark'] .drawer-menu {
  background: #1a2130 !important;
}
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-menu-item,
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-submenu__title {
  color: #a8b3c7 !important;
  background: transparent !important;
}
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-menu-item i,
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-submenu__title i {
  color: #6b7690 !important;
}
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-menu-item.is-active {
  background: #1c2a45 !important;
  color: #4d8dff !important;
}
html[data-mode='dark'] .drawer-menu-list-top .menu-top .el-menu-item.menu-group-title {
  color: #6b7690 !important;
}
html[data-mode='dark'] .drawer-menu .drawer-menu-logo {
  filter: none;
}
html[data-mode='dark'] .drawer-open-tab,
html[data-mode='dark'] .el-drawer .drawer-close-tab {
  background: rgba(28, 33, 44, 0.96);
  border-color: #2a3140;
  color: #cfd6e4;
  box-shadow: 3px 4px 14px rgba(0, 0, 0, 0.45);
}
html[data-mode='dark'] .el-drawer .drawer-close-tab {
  box-shadow: -3px 4px 14px rgba(0, 0, 0, 0.45);
}
html[data-mode='dark'] .el-drawer .drawer-menu .el-menu {
  background: transparent !important;
}

/* 14.4 内容区卡片与文字（补遗漏） */
html[data-mode='dark'] body .zcaq-boxr-a,
html[data-mode='dark'] body .my-voucher-entry,
html[data-mode='dark'] body .yfx-bzhboxr,
html[data-mode='dark'] body .mixed-tabs,
html[data-mode='dark'] body .mixed-tabs .more,
html[data-mode='dark'] body .sc-footer,
html[data-mode='dark'] body .gl-card__desc,
html[data-mode='dark'] body .el-card {
  background: #171c26 !important;
  color: #e5e9f2;
}
html[data-mode='dark'] body .zcaq-boxr-a,
html[data-mode='dark'] body .my-voucher-entry,
html[data-mode='dark'] body .yfx-bzhboxr,
html[data-mode='dark'] body .mixed-tabs,
html[data-mode='dark'] body .gl-card__desc {
  border-color: #2a3140;
}
html[data-mode='dark'] body .yfx-bzhboxr,
html[data-mode='dark'] body .my-voucher-entry,
html[data-mode='dark'] body .mixed-tabs {
  box-shadow: none !important;
}
html[data-mode='dark'] body .sg-check-item {
  background: #1c212c !important;
  color: #e5e9f2;
  border-color: #2a3140;
}

/* 14.5 表格 */
html[data-mode='dark'] body .el-table,
html[data-mode='dark'] body .el-table tr,
html[data-mode='dark'] body .el-table th.el-table__cell,
html[data-mode='dark'] body .el-table td.el-table__cell {
  background: #171c26 !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .el-table th.el-table__cell {
  background: #1c212c !important;
  color: #a8b3c7 !important;
}
html[data-mode='dark'] body .el-table--enable-row-hover .el-table__body tr:hover > td.el-table__cell {
  background: #1c222e !important;
}
html[data-mode='dark'] body .el-table td.el-table__cell,
html[data-mode='dark'] body .el-table th.el-table__cell.is-leaf {
  border-bottom-color: #2a3140 !important;
}
html[data-mode='dark'] body .el-table::before {
  background: #2a3140;
}
html[data-mode='dark'] body .el-table__empty-text {
  color: #6b7690;
}

/* 14.6 表单 */
html[data-mode='dark'] body .el-input__inner,
html[data-mode='dark'] body .el-textarea__inner {
  background: #1c212c !important;
  border-color: #2a3140 !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .el-input__inner::placeholder,
html[data-mode='dark'] body .el-textarea__inner::placeholder {
  color: #6b7690;
}
html[data-mode='dark'] body .el-input__icon {
  color: #6b7690;
}
html[data-mode='dark'] body .el-select-dropdown,
html[data-mode='dark'] body .el-select-dropdown__item {
  background: #1c212c;
  color: #e5e9f2;
  border-color: #2a3140;
}
html[data-mode='dark'] body .el-select-dropdown__item.hover,
html[data-mode='dark'] body .el-select-dropdown__item:hover {
  background: #1c222e;
}
html[data-mode='dark'] body .el-select-dropdown__item.selected {
  color: #4d8dff;
}
html[data-mode='dark'] body .el-checkbox__label,
html[data-mode='dark'] body .el-radio__label {
  color: #a8b3c7;
}
html[data-mode='dark'] body .el-form-item__label {
  color: #a8b3c7;
}

/* 14.7 弹窗 / 消息 / 分页 / 按钮 / 加载 */
html[data-mode='dark'] body .el-dialog,
html[data-mode='dark'] body .el-dialog__header,
html[data-mode='dark'] body .el-dialog__body,
html[data-mode='dark'] body .el-dialog__footer {
  background: #171c26 !important;
}
html[data-mode='dark'] body .el-dialog__title {
  color: #e5e9f2;
}
html[data-mode='dark'] body .el-message {
  background: #1c212c !important;
  border-color: #2a3140 !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .el-message .el-message__content {
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .el-message-box,
html[data-mode='dark'] body .el-message-box__header,
html[data-mode='dark'] body .el-message-box__content,
html[data-mode='dark'] body .el-message-box__btns {
  background: #171c26 !important;
}
html[data-mode='dark'] body .el-message-box__title,
html[data-mode='dark'] body .el-message-box__message {
  color: #e5e9f2;
}
html[data-mode='dark'] body .el-button--default {
  background: #1c212c !important;
  border-color: #2a3140 !important;
  color: #cfd6e4 !important;
}
html[data-mode='dark'] body .el-button--default:hover,
html[data-mode='dark'] body .el-button--default:focus {
  background: #1c222e !important;
  color: #4d8dff !important;
  border-color: #2a3140 !important;
}
html[data-mode='dark'] body .el-pagination button,
html[data-mode='dark'] body .el-pagination .el-pager li {
  background: #1c212c !important;
  color: #cfd6e4 !important;
}
html[data-mode='dark'] body .el-pagination .el-pager li.active {
  color: #4d8dff !important;
}
html[data-mode='dark'] body .el-pagination__total,
html[data-mode='dark'] body .el-pagination__jump {
  color: #a8b3c7 !important;
}
html[data-mode='dark'] body .el-loading-mask {
  background: rgba(16, 20, 28, 0.75) !important;
}
html[data-mode='dark'] body .el-empty__description p {
  color: #a8b3c7;
}
html[data-mode='dark'] body .el-dropdown-menu,
html[data-mode='dark'] body .el-popover,
html[data-mode='dark'] body .el-tooltip__popper {
  background: #171c26 !important;
  border-color: #2a3140 !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .el-dropdown-menu__item {
  color: #cfd6e4 !important;
}
html[data-mode='dark'] body .el-dropdown-menu__item:hover {
  background: #1c222e !important;
  color: #4d8dff !important;
}

/* 14.8 登录/注册页 */
html[data-mode='dark'] body .login-container .login,
html[data-mode='dark'] body .login-container .container-before,
html[data-mode='dark'] body .login .login-text {
  background: #171c26;
}
html[data-mode='dark'] body .login .login-text-title,
html[data-mode='dark'] body .login .login-text {
  color: #e5e9f2;
}

/* 14.9 滚动条与其它 */
html[data-mode='dark'] ::-webkit-scrollbar-thumb {
  background: rgba(42, 49, 64, 0.9);
}
html[data-mode='dark'] ::-webkit-scrollbar-thumb:hover {
  background: #3a4354;
}
html[data-mode='dark'] body a:not(.el-button):not(.t-button) {
  color: #4d8dff;
}
html[data-mode='dark'] body .el-divider {
  background: #2a3140;
}
html[data-mode='dark'] body .el-alert {
  background: #1c212c;
  color: #e5e9f2;
}

/* 14.10 el-tag 与插件组件补漏（20261028t16） */
html[data-mode='dark'] body .el-tag--light {
  background: #1c212c !important;
  border-color: #2a3140 !important;
}
html[data-mode='dark'] body .el-tag--success.el-tag--light { color: #67c23a !important; }
html[data-mode='dark'] body .el-tag--danger.el-tag--light { color: #f56c6c !important; }
html[data-mode='dark'] body .el-tag--warning.el-tag--light { color: #e6a23c !important; }
html[data-mode='dark'] body .el-tag--info.el-tag--light { color: #a8b3c7 !important; }
/* 拼团秒杀插件（gzhx） */
html[data-mode='dark'] body .gzhx-card,
html[data-mode='dark'] body .gzhx-level {
  background: #171c26 !important;
  color: #e5e9f2;
  border-color: #2a3140;
}
html[data-mode='dark'] body .gzhx-tag {
  background: #1c212c !important;
  color: #a8b3c7 !important;
}
html[data-mode='dark'] body .gzhx-tag.success { color: #67c23a !important; }
html[data-mode='dark'] body .gzhx-tag.forming { color: #e6a23c !important; }

/* 14.11 登录页与零散补漏（20261028t17） */
html[data-mode='dark'] body .login-container {
  background: transparent;
}
html[data-mode='dark'] body .login-top {
  background: rgba(28, 33, 44, 0.65) !important;
  border-color: #2a3140;
}
html[data-mode='dark'] body .login-top .login-email,
html[data-mode='dark'] body .login-top .login-phone {
  color: #a8b3c7;
}
html[data-mode='dark'] body .login-top .login-email.active,
html[data-mode='dark'] body .login-top .login-phone.active {
  color: #4d8dff;
}
html[data-mode='dark'] body .sg-form-retry {
  background: #1c212c !important;
  border-color: #2a3140 !important;
  color: #cfd6e4 !important;
}

html[data-mode='dark'] body .login-top::before {
  background: rgba(38, 46, 64, 0.95) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35) !important;
}

html[data-mode='dark'] body .right-box .more,
html[data-mode='dark'] body .WorkOrder-title .more {
  background: #1c212c !important;
  color: #a8b3c7 !important;
}

html[data-mode='dark'] body #mainLoading,
html[data-mode='dark'] body #mainLoading.pro-des::before {
  background: #10141c !important;
}

/* 14.12 el-menu 内联背景与插件卡片补漏（20261028t21） */
/* el-menu 的 background-color="#fff" 属性生成内联样式，必须 !important 覆盖 */
html[data-mode='dark'] .el-drawer .el-menu,
html[data-mode='dark'] .el-aside .el-menu {
  background-color: transparent !important;
}
html[data-mode='dark'] .el-drawer .el-menu-item,
html[data-mode='dark'] .el-drawer .el-submenu__title,
html[data-mode='dark'] .el-aside .el-menu-item,
html[data-mode='dark'] .el-aside .el-submenu__title {
  background-color: transparent !important;
  color: #a8b3c7 !important;
}
html[data-mode='dark'] .el-drawer .el-menu-item:hover,
html[data-mode='dark'] .el-drawer .el-submenu__title:hover,
html[data-mode='dark'] .el-aside .el-menu-item:hover,
html[data-mode='dark'] .el-aside .el-submenu__title:hover {
  background-color: #1c222e !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] .el-drawer .el-menu-item.is-active,
html[data-mode='dark'] .el-aside .el-menu-item.is-active {
  background-color: #1c2a45 !important;
  color: #4d8dff !important;
}
html[data-mode='dark'] .el-drawer .menu-group-title,
html[data-mode='dark'] .el-aside .menu-group-title {
  background-color: transparent !important;
  color: #6b7690 !important;
}
/* 已订购实例卡（mf_cloud 模块） */
html[data-mode='dark'] body .mp-card {
  background: #171c26 !important;
  color: #e5e9f2;
  border-color: #2a3140 !important;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.35) !important;
}
html[data-mode='dark'] body .mp-head-icon.mp-head-icon-default {
  background: #1c212c !important;
}
html[data-mode='dark'] body .mp-status-green {
  background: rgba(103, 194, 58, 0.14) !important;
  color: #67c23a !important;
  border-color: rgba(103, 194, 58, 0.35) !important;
}
html[data-mode='dark'] body .mp-btn.mp-btn-line {
  background: #1c212c !important;
  border-color: #2a3140 !important;
  color: #cfd6e4 !important;
}
/* 工单页 */
html[data-mode='dark'] body .main-card {
  background: #171c26 !important;
  color: #e5e9f2;
  border-color: #2a3140 !important;
}
/* 通用表格表头（非 el-table 场景，如 Token 充值页） */
html[data-mode='dark'] body th {
  background: #1c212c !important;
  color: #cfd6e4 !important;
  border-color: #2a3140 !important;
}
/* Bootstrap 组件（auto_article/oneapi 等插件页面） */
html[data-mode='dark'] body .card {
  background: #171c26 !important;
  color: #e5e9f2 !important;
  border-color: #2a3140 !important;
}
html[data-mode='dark'] body .card .card-header,
html[data-mode='dark'] body .card .card-footer {
  background: transparent !important;
  border-color: #2a3140 !important;
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .alert-light {
  background: #1c212c !important;
  color: #a8b3c7 !important;
  border-color: #2a3140 !important;
}
html[data-mode='dark'] body .oa-plan {
  background: #171c26 !important;
  color: #e5e9f2 !important;
  border-color: #2a3140 !important;
}
html[data-mode='dark'] body .oa-model-pill {
  background: #1c212c !important;
  color: #cfd6e4 !important;
}
html[data-mode='dark'] body .oa-tag {
  background: #1c212c !important;
  color: #a8b3c7 !important;
}

/* 14.13 goods.css 白色选择框覆盖（goods.css 同权重 !important 且后加载，此处以更高权重压制） */
html[data-mode='dark'] body .config-box .content .el-select .el-input__inner,
html[data-mode='dark'] body .f-order .time .el-select .el-input__inner,
html[data-mode='dark'] body .config-box .content .el-select .el-input__inner:hover,
html[data-mode='dark'] body .f-order .time .el-select .el-input__inner:hover {
  background: #1c212c !important;
  color: #e5e9f2 !important;
  border-color: #323b4f !important;
}

/* 14.14 home 页统计卡与资产安全卡文字（20261028t25） */
/* 余额卡：可使用余额标题/余额数字/余额提醒 */
html[data-mode='dark'] body .credit-title .credit-name,
html[data-mode='dark'] body .credit-title .create-notice,
html[data-mode='dark'] body .credit-title .notice-status {
  color: #a8b3c7 !important;
}
html[data-mode='dark'] body .credit-num,
html[data-mode='dark'] body .credit-num .s-24 {
  color: #e5e9f2 !important;
}
/* 底部四卡（待处理工单/待付订单/正在运行/7天内到期） */
html[data-mode='dark'] body .stat-name {
  color: #a8b3c7 !important;
}
html[data-mode='dark'] body .stat-num,
html[data-mode='dark'] body .stat-value,
html[data-mode='dark'] body .unit {
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .stat-card .stat-link,
html[data-mode='dark'] body .stat-card a {
  color: #4d8dff !important;
}
/* 资产安全右侧四小卡功能名（操作日志/拼团秒杀/优惠码/提交工单） */
html[data-mode='dark'] body .zcaq-boxr-name {
  color: #cfd6e4 !important;
}

/* ============ 14.15 消费统计卡与百分比标签（20261028t33） ============ */
/* 1) 本月/总消费两卡统一外观：同款底色、边框、圆角、内边距（原来总消费卡无底色无边框） */
html[data-mode='dark'] body .money-month,
html[data-mode='dark'] body .money-total {
  background: #1c212c !important;
  border: 1px solid #323b4f !important;
  border-radius: 12px !important;
  padding: 0.16rem 0.24rem !important;
  box-sizing: border-box !important;
  min-height: 1.1rem;
  align-content: center;
}
/* 未登录/亮色态下也保持一致（浅色背景 + 浅边框），避免两卡不对等 */
html:not([data-mode='dark']) body .money-month,
html:not([data-mode='dark']) body .money-total {
  background: #f7f8fa;
  border: 1px solid #eef0f4;
  border-radius: 12px;
  padding: 0.16rem 0.24rem;
  box-sizing: border-box;
  min-height: 1.1rem;
  align-content: center;
}

/* 兜底：若两卡被包在独立容器中（不同主题/账号结构），统一其容器外观 */
html[data-mode='dark'] body .statistics-bottom-right .money-month,
html[data-mode='dark'] body .statistics-bottom-right .money-total {
  background: #1c212c !important;
  border: 1px solid #323b4f !important;
  border-radius: 12px !important;
  padding: 0.16rem 0.24rem !important;
  box-sizing: border-box !important;
}
/* 两卡之间的间距，视觉更均衡 */
html body .statistics-bottom-right .money-month + .money-total,
html body .money-month + .money-total {
  margin-top: 0.12rem;
}

/* 2) 百分比标签：禁止被挤压（手机上 flex 收缩导致变窄/换行挤压） */
.money-month .percent-box-green,
.money-month .percent-box-red,
.percent-box-green,
.percent-box-red {
  flex: 0 0 auto;
  flex-shrink: 0;
  white-space: nowrap;
  line-height: 1.5;
  padding: 1px 6px;
  border-radius: 6px;
  font-size: 0.13rem;
  vertical-align: middle;
}
/* 窄屏：金额与标签允许换行，标签保持完整不压缩 */
@media screen and (max-width: 750px) {
  .money-month > div,
  .money-total > div {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px;
    row-gap: 4px;
    width: 100%;
  }
  .percent-box-green,
  .percent-box-red {
    margin-left: 4px;
    padding: 2px 8px;
    font-size: 0.12rem;
    min-width: max-content;
  }
}

/* 百分比涨跌语义色（红涨绿跌保持品牌语义，暗色下仅调整底色透明度） */
html[data-mode='dark'] body .percent-box-green {
  color: #50CD89 !important;
  background: rgba(80, 205, 136, 0.16) !important;
}
html[data-mode='dark'] body .percent-box-red {
  color: #F0142F !important;
  background: rgba(240, 20, 46, 0.16) !important;
}

/* ============ 14.16 yfx-bzhbox 统计卡百分比标签宽度自适应（20261028t28） ============ */
/* 原样式写死 width:50px 且不换行控制缺失，导致 ↑100% 等长文本被挤成两行溢出 */
.yfx-bzhbox-b2,
.yfx-bzhbox .yfx-bzhbox-b2 {
  width: auto !important;
  min-width: 50px;
  max-width: 100%;
  padding: 0 6px;
  box-sizing: border-box;
  white-space: nowrap;
  flex: 0 0 auto;
  flex-shrink: 0;
  line-height: 22px;
  height: 22px;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 父级允许换行时不挤压标签 */
.yfx-bzhbox-b {
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
}
.yfx-bzhbox-b1 {
  flex: 0 1 auto;
  min-width: 0;
}
/* 手机端：卡片内元素纵向留白收紧，标签保证完整显示 */
@media screen and (max-width: 750px) {
  .yfx-bzhbox-b2 {
    padding: 0 8px;
    font-size: 12px;
    min-width: 56px;
  }
  .yfx-bzhbox-b1 {
    margin-right: 8px;
    font-size: 14px;
  }
}

/* ============ 14.17 首字符头像（手机号账号无邮箱头像）兜底（20261028t29） ============ */
/* 手机号注册用户 email 为空 → 不生成头像图，改为显示用户名首字符圆形块 */
html body .el-header .yfx-header-namebox {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(135deg, #4d8dff, #0052d9);
  text-transform: uppercase;
  user-select: none;
}
html[data-mode='dark'] body .el-header .yfx-header-namebox {
  background: linear-gradient(135deg, #4d8dff, #2b5fd9);
  box-shadow: 0 0 0 1px #323b4f;
}

/* ============ 14.18 资产安全四小卡文字溢出修复（20261028t32） ============ */
/* 根因：.zcaq-boxr 实为 display:grid（非 flex），原 66% 宽 + 每卡 50% → 单卡仅 ~39px，
   卡名 4 汉字 ~44px 且 nowrap → 溢出底框。
   方案：grid 四等分（repeat(4,1fr)）+ 卡名居中可换行。 */
html body .zcaq-boxr {
  width: 100% !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 6px;
  padding: 0 2px;
  box-sizing: border-box;
  align-items: stretch;
  margin-top: -30px;
}
html body .zcaq-boxr .zcaq-boxr-a {
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  grid-column: auto !important;
  padding: 12px 3px;
  box-sizing: border-box;
  border-radius: 12px;
  background: rgba(0, 82, 217, 0.04);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  overflow: hidden;
}
html body .zcaq-boxr .zcaq-boxr-icon {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
}
html body .zcaq-boxr .zcaq-boxr-name {
  margin-top: 8px;
  font-size: 12px;
  line-height: 1.25;
  text-align: center;
  white-space: normal !important;
  word-break: break-all;
  overflow-wrap: anywhere;
  width: 100%;
  max-width: 100%;
  padding: 0 1px;
  box-sizing: border-box;
}
/* 暗色模式 */
html[data-mode='dark'] body .zcaq-boxr .zcaq-boxr-a {
  background: rgba(255, 255, 255, 0.05);
}
html[data-mode='dark'] body .zcaq-boxr .zcaq-boxr-a:hover {
  background: rgba(255, 255, 255, 0.09);
}
html[data-mode='dark'] body .zcaq-boxr .zcaq-boxr-name {
  color: #cfd6e4 !important;
}
/* 极窄屏：再降一档 */
@media screen and (max-width: 380px) {
  html body .zcaq-boxr { gap: 4px; }
  html body .zcaq-boxr .zcaq-boxr-a { padding: 10px 2px; }
  html body .zcaq-boxr .zcaq-boxr-name { font-size: 11px; }
  html body .zcaq-boxr .zcaq-boxr-icon { width: 34px; height: 34px; }
}

/* ============ 14.19 消费双卡（yfx-bzhbox 本月 / yfx-bzhboxr 总消费）暗色一致性（20261028t35） ============ */
/* 真实的消费卡片是 .yfx-bzhbox / .yfx-bzhboxr（不是 money-month/money-total） */
html[data-mode='dark'] body .yfx-bzhbox,
html[data-mode='dark'] body .yfx-bzhboxr {
  background: #1c212c !important;
  border: 1px solid #323b4f !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}
/* 保证两卡视觉完全对等（同高、同内边距、同圆角） */
html body .yfx-bzhbox,
html body .yfx-bzhboxr {
  border-radius: 12px !important;
  box-sizing: border-box !important;
}
/* 亮色态给同款浅边框，避免只有一侧有卡片感 */
html:not([data-mode='dark']) body .yfx-bzhbox,
html:not([data-mode='dark']) body .yfx-bzhboxr {
  background: #f7f8fa !important;
  border: 1px solid #eef0f4 !important;
}
/* 卡内文字：暗色下提亮 */
html[data-mode='dark'] body .yfx-bzhbox .yfx-bzhbox-b1,
html[data-mode='dark'] body .yfx-bzhboxr .yfx-bzhbox-b1 {
  color: #e5e9f2 !important;
}
html[data-mode='dark'] body .yfx-bzhbox-t,
html[data-mode='dark'] body .yfx-bzhbox .yfx-bzhbox-t span {
  color: #a8b3c7 !important;
}