/* =========================================================================
   ZaFeed 明暗主题
   浅色为默认值；暗色通过 <html data-theme="dark"> 切换。
   组件里的白底 / 白玻璃 / 墨蓝浅影已改为下列变量，因此暗色只需替换变量值，
   少数写死颜色的组件在文件末尾单独补充。须在其他样式之后引入。
   ========================================================================= */
:root {
  --zf-surface-rgb: 255 255 255;
  --zf-surface-2-rgb: 241 245 248;
  --zf-shade-rgb: 16 42 67;
  --zf-tint: #F2FBF6;
  --zf-tint-warm: #FFFBF1;
  --zf-page-bg: linear-gradient(180deg, #F6FAF8 0%, #F2F7F4 55%, #F4F8F6 100%);
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
  /* 底与面 */
  --zf-bg: #0A1522;
  --zf-bg-2: #0C1A29;
  --zf-surface: #112033;
  --zf-surface-2: #0E1B2B;
  --zf-surface-rgb: 17 32 51;
  --zf-surface-2-rgb: 14 27 43;
  --zf-shade-rgb: 220 232 244;
  --zf-glass: rgba(17, 32, 51, .62);
  --zf-glass-strong: rgba(20, 37, 58, .88);
  --zf-line: rgba(220, 232, 244, .09);
  --zf-line-2: rgba(220, 232, 244, .16);
  --zf-tint: rgba(47, 190, 121, .07);
  --zf-tint-warm: rgba(224, 160, 40, .07);
  --zf-page-bg: linear-gradient(180deg, #0B1828 0%, #0A1522 60%, #09131F 100%);
  /* 文字 */
  --zf-text: #E7EEF5;
  --zf-text-2: #A8BBCD;
  --zf-text-3: #7388A0;
  /* 墨蓝阶：浅阶变为半透明亮色，深阶保留为深色块 */
  --zf-ink-50: rgba(220, 232, 244, .06);
  --zf-ink-100: rgba(220, 232, 244, .10);
  --zf-ink-200: rgba(220, 232, 244, .20);
  --zf-ink-300: #5F7690;
  --zf-ink-600: #3B5878;
  --zf-ink-800: #1C3450;
  --zf-ink-900: #081321;
  /* 品牌绿：按钮保持 Logo 绿，文字与浅底提亮 */
  --zf-green-50: rgba(47, 190, 121, .10);
  --zf-green-100: rgba(47, 190, 121, .16);
  --zf-green-200: rgba(47, 190, 121, .30);
  --zf-green-300: #3FCB86;
  --zf-green-700: #4FD394;
  --zf-green-800: #7EE0AE;
  --zf-green-900: #BDEFD4;
  /* 涨跌 */
  --zf-up: #2FCB7E;
  --zf-up-tint: rgba(47, 203, 126, .15);
  --zf-down: #FF6B70;
  --zf-down-tint: rgba(255, 107, 112, .15);
  /* 阴影改为纯暗色，玻璃内高光减弱 */
  --zf-sh-1: 0 1px 2px rgba(0, 0, 0, .45);
  --zf-sh-2: 0 10px 28px -10px rgba(0, 0, 0, .6), 0 2px 6px rgba(0, 0, 0, .3);
  --zf-sh-3: 0 28px 64px -22px rgba(0, 0, 0, .75), 0 10px 24px -10px rgba(0, 0, 0, .45);
  --zf-sh-inset: inset 0 1px 0 rgba(255, 255, 255, .06);
  --zf-sh-glow: 0 12px 30px -10px rgba(16, 168, 98, .55);
  --zf-focus: 0 0 0 4px rgba(47, 190, 121, .26);
}
:root[data-theme="dark"][data-quote="cn"] {
  --zf-up: #FF6B70; --zf-up-tint: rgba(255, 107, 112, .15);
  --zf-down: #2FCB7E; --zf-down-tint: rgba(47, 203, 126, .15);
}

/* 切换主题时颜色平滑过渡 */
html.zf-theming, html.zf-theming *, html.zf-theming *::before, html.zf-theming *::after {
  transition: background-color 400ms var(--zf-ease), border-color 400ms var(--zf-ease), color 400ms var(--zf-ease), fill 400ms var(--zf-ease), box-shadow 400ms var(--zf-ease) !important;
}

body { background: var(--zf-page-bg); }

/* 字标：暗色下使用反白字标（绿色图标不变） */
.logo-dark { display: none !important; }
[data-theme="dark"] .logo-light { display: none !important; }
[data-theme="dark"] .logo-dark { display: block !important; }

/* 主题切换按钮 */
.theme-btn { position: relative; overflow: hidden; }
.theme-btn [data-icon] { position: absolute; inset: 0; transition: transform 500ms var(--zf-ease-spring), opacity 300ms var(--zf-ease); }
.theme-btn .t-moon { transform: translateY(120%) rotate(-40deg); opacity: 0; }
[data-theme="dark"] .theme-btn .t-sun { transform: translateY(-120%) rotate(40deg); opacity: 0; }
[data-theme="dark"] .theme-btn .t-moon { transform: none; opacity: 1; }

/* ================= 暗色下的组件补充 ================= */
[data-theme="dark"] ::selection { background: rgba(47, 190, 121, .35); color: #fff; }
[data-theme="dark"] .page-bg {
  background: radial-gradient(900px 520px at 78% 18%, rgba(47, 190, 121, .16), transparent 65%), radial-gradient(700px 420px at 12% 8%, rgba(43, 120, 240, .10), transparent 70%);
}
[data-theme="dark"] .page-bg svg { opacity: .45; }
[data-theme="dark"] .blk2--glow-r::before { background: radial-gradient(760px 440px at 94% 16%, rgba(47,190,121,.10), transparent 70%), radial-gradient(560px 340px at 2% 92%, rgba(43,120,240,.07), transparent 70%); }
[data-theme="dark"] .blk2--glow-l::before { background: radial-gradient(760px 440px at 4% 20%, rgba(47,190,121,.10), transparent 70%), radial-gradient(560px 340px at 98% 88%, rgba(43,120,240,.07), transparent 70%); }

/* 玻璃与面板：白色描边改为极淡亮边 */
[data-theme="dark"] .zf-glass, [data-theme="dark"] .rp, [data-theme="dark"] .tile, [data-theme="dark"] .pstat, [data-theme="dark"] .rule,
[data-theme="dark"] .tcard, [data-theme="dark"] .closures-wrap, [data-theme="dark"] .mk2__regions, [data-theme="dark"] .keycard,
[data-theme="dark"] .doc__nav, [data-theme="dark"] .mem__nav, [data-theme="dark"] .zf-dock { border-color: rgba(220, 232, 244, .08); }
[data-theme="dark"] .panel2, [data-theme="dark"] .mk2__list, [data-theme="dark"] .cap .panel { box-shadow: 0 1px 2px rgba(0,0,0,.4), 0 20px 44px -26px rgba(0,0,0,.7); }
[data-theme="dark"] .keycard .kc-flag, [data-theme="dark"] .qbadge { box-shadow: inset 0 0 0 1px rgba(255,255,255,.08); }

/* 导航与超级菜单 */
[data-theme="dark"] .nav.is-scrolled, [data-theme="dark"] .nav.is-mega { background: rgba(10, 21, 34, .78); border-bottom-color: rgba(220,232,244,.07); }
[data-theme="dark"] .mega__arrow { background: var(--zf-glass-strong); border-color: rgba(220,232,244,.08); }
[data-theme="dark"] .mega__feature { background: linear-gradient(160deg, rgba(47,190,121,.10), transparent 70%); border-color: rgba(47,190,121,.18); }

/* 深色块在暗底上需要分层 */
[data-theme="dark"] .dev-band { background: linear-gradient(180deg, #0F243B 0%, #0C1D30 100%); border: 1px solid rgba(220,232,244,.07); }
[data-theme="dark"] .mkbar { background: rgba(20, 37, 58, .95); box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 30px 64px -26px rgba(0,0,0,.75); }
[data-theme="dark"] .zf-tip, [data-theme="dark"] .zf-chart__tip:not(.zf-chart__tip--ohlc) { background: #22384F; box-shadow: 0 10px 24px -8px rgba(0,0,0,.6); }
[data-theme="dark"] .json, [data-theme="dark"] .cblock, [data-theme="dark"] .endpoint { background: #07111D; border-color: rgba(220,232,244,.08); }
[data-theme="dark"] .zf-btn--ink { background: #243F60; }
[data-theme="dark"] .zf-btn--ink:hover { background: #2C4C72; }
[data-theme="dark"] .zf-btn--secondary { background: rgba(220,232,244,.05); }
[data-theme="dark"] .zf-btn--secondary:hover { background: rgba(47,190,121,.12); color: var(--zf-green-800); }
[data-theme="dark"] .zf-kbd { background: rgba(220,232,244,.06); }
[data-theme="dark"] .proto-flag { background: rgba(28, 52, 80, .92); }
[data-theme="dark"] .zf-modal__scrim, [data-theme="dark"] .zf-scrim { background: rgba(2, 8, 15, .6); }
[data-theme="dark"] .zf-msg--in { background: var(--zf-surface); }

/* 状态色在暗底上提亮 */
[data-theme="dark"] .pill--holiday, [data-theme="dark"] .closure__k { color: #FF8C90; background: rgba(255,107,112,.14); }
[data-theme="dark"] .pill--half, [data-theme="dark"] .pill--break, [data-theme="dark"] .pill--pre, [data-theme="dark"] .closure__k--half { color: #F4BB55; background: rgba(244,187,85,.13); }
[data-theme="dark"] .mcal__d.lv1 { background: rgba(255,107,112,.14); color: #FF9DA0; }
[data-theme="dark"] .mcal__d.lv2 { background: rgba(255,107,112,.28); color: #FFC2C4; }
[data-theme="dark"] .callout { color: var(--zf-green-900); }
[data-theme="dark"] .callout--warn { background: rgba(244,187,85,.08); border-color: rgba(244,187,85,.22); color: #F6D59A; }
[data-theme="dark"] .req { color: #FF8C90; background: rgba(255,107,112,.14); }
[data-theme="dark"] .zf-modal__icon { background: rgba(255,107,112,.14); color: #FF8C90; }
[data-theme="dark"] .zf-menu__item--danger:hover { background: rgba(255,107,112,.12); color: #FF8C90; }
[data-theme="dark"] .zf-demo-chip { background: rgba(220,232,244,.07); }
[data-theme="dark"] .zf-acc__item.is-open .zf-acc__icon { color: #fff; }
[data-theme="dark"] .star { color: rgba(220,232,244,.22); }
[data-theme="dark"] .step4 .n { color: rgba(220,232,244,.08); }
[data-theme="dark"] .mem__avatar { box-shadow: inset 0 0 0 1px rgba(255,255,255,.1); }
[data-theme="dark"] .auth__brand { background: linear-gradient(160deg, #0D2238, #0F2A45 60%, #0B2033); }
[data-theme="dark"] .auth__keys .keycard { background: rgba(17,32,51,.7); }

/* 暗色下绿色 700 用作文字色（提亮），以下几处把它当背景，固定为深绿 */
[data-theme="dark"] .zf-btn--primary:hover { background: linear-gradient(180deg, #13A45F 0%, #007A3F 100%); }
[data-theme="dark"] .zf-dock__btn--chat:hover, [data-theme="dark"] .zf-dock__btn--chat.is-open, [data-theme="dark"] .zf-chat__form .zf-iconbtn:hover { background: #007A3F; }
[data-theme="dark"] .qbadge--index, [data-theme="dark"] .keycard--2 .kc-flag { background: #007A3F; }
[data-theme="dark"] .mem__avatar { background: linear-gradient(135deg, #10A862, #007A3F); }
[data-theme="dark"] .zf-link { color: var(--zf-green-700); }
[data-theme="dark"] .alertbar { background: rgba(244,187,85,.07); border-color: rgba(244,187,85,.22); }
[data-theme="dark"] .mem__nav a .badge--warn, [data-theme="dark"] .kexp small.warn { color: #F4BB55; }
[data-theme="dark"] .pay__qr { background: #fff; }
[data-theme="dark"] .batchbar { background: rgba(22,42,66,.94); }
[data-theme="dark"] .term { background: #07111D; border-color: rgba(220,232,244,.08); }
[data-theme="dark"] .dov-hero { background: linear-gradient(135deg, #0F243B, #133A5E 70%); border: 1px solid rgba(220,232,244,.07); }
[data-theme="dark"] .exp__preview, [data-theme="dark"] .exp__out { background: #07111D; }
[data-theme="dark"] .dsec code:not(pre code), [data-theme="dark"] .ptable code { color: var(--zf-text); }
[data-theme="dark"] .ptable td:first-child code { color: var(--zf-green-800) !important; }

/* r13：统一玻璃卡在暗色下的描边与阴影；代码窗恢复暗色语法色 */
:root[data-theme="dark"] {
  --zf-card-bg: rgba(20, 37, 58, .62);
  --zf-card-line: rgba(220, 232, 244, .08);
  --zf-card-sh: inset 0 1px 0 rgba(255,255,255,.05), 0 1px 2px rgba(0,0,0,.4), 0 28px 60px -30px rgba(0,0,0,.7);
}
[data-theme="dark"] .mkbar__flag { border-color: #14253A; }
[data-theme="dark"] .mchip.is-sel .mchip__flag, [data-theme="dark"] .mkbar__flag { background: #2A4A6E; border-color: #2A4A6E; }
[data-theme="dark"] .mkbar__flag { border-color: #14253A; }
[data-theme="dark"] .code--tile pre .k { color: #9CC9FF; } [data-theme="dark"] .code--tile pre .f { color: #7FD7AA; }
[data-theme="dark"] .code--tile pre .s { color: #F6C177; } [data-theme="dark"] .code--tile pre .n { color: #B9D7FF; }
[data-theme="dark"] .code--tile pre .c { color: #5C7690; }
[data-theme="dark"] .code--tile .code__sub--res, [data-theme="dark"] .code--tile .code__res { background: rgba(7, 17, 29, .45); }
