/* ============================================================
   云舟 IDC · 官网门户主题层（web.css）
   ------------------------------------------------------------
   定位：官方 base.css / all.min.css / management.css 之后的主题层。
        官方 CSS 副本中的硬编码颜色已全部替换为 --yz-* 变量
        （见 portal-tools/replace-colors.py，约 1500 处），
        本文件定义变量值 + 主题切换按钮 + 少量 yz- 增强。
   浅色主题变量值 = 官方原值（零回归）；深色主题换值为
        会员中心同款暗色观测站语言（--surface #131A26 / --accent #FFB224）。
   ============================================================ */
:root {
  /* 浅色主题：界面值 = 官方原值；强调色 = 品牌琥珀（会员中心浅色同值 #F0A415）*/
  --yz-surface: #FFFFFF;
  --yz-surface-2: #F5F5F5;
  --yz-border: #E0E0E0;
  --yz-text: #333333;
  --yz-text-2: #4C525B;
  --yz-text-3: #777777;
  --yz-text-body: #637283;
  --yz-header-fixed: #151C2C;   /* 官方滚动固定态深底（白字配深底，双主题通用）*/
  --yz-accent: #F0A415;         /* 琥珀强调（会员中心浅色同值）*/
  --yz-accent-strong: #C87E00;  /* hover/active 加深（白底 AA）*/
  --yz-accent-soft: rgba(240, 164, 21, 0.10);
  --yz-page-bg: #F4F6F9;
  /* 页脚/实心深头背景体系（官方两段式页脚：CTA 浅带 .foot + 深青主页脚 .footer）。
     修复记录（1.8.1，客户 10-30 回执 P0）：官方 .footer 背景 #1f2533 曾被颜色
     变量化误映射到 --yz-text（文字变量）——浅色主题蒙混过关（#333 与 #1f2533
     都算深底），深色主题 --yz-text 翻白，页脚白字浅底对比仅 1.15:1。
     现拆为专用背景变量：浅色 = 官方原值（零回归），深色 = 观测站同族深色。 */
  --yz-foot-bg: #F6F7FA;      /* 页脚 CTA 带背景（.foot，官方原值）*/
  --yz-footer-bg: #1f2533;    /* 主页脚背景（.footer，官方原值）*/
  --yz-header-solid: #1e212c; /* 实心深色头（.header:hover / ≤767px，官方原值）*/
  --yz-shadow: 0 2px 12px rgba(15, 23, 42, 0.08);
  --yz-radius: 10px;
}

/* 深色主题：暗色观测站（与会员中心 yunzhou.css 深色值同源）*/
[data-theme="dark"] {
  --yz-surface: #131A26;
  --yz-surface-2: #0E141D;
  --yz-border: #2A3441;
  --yz-text: #E7ECF3;
  --yz-text-2: #A8B3C1;
  --yz-text-3: #8D9BB0;
  --yz-text-body: #A8B3C1;
  --yz-header-fixed: #0E141D;
  --yz-accent: #FFB224;
  --yz-accent-strong: #FFC54D;
  --yz-accent-soft: rgba(255, 178, 36, 0.14);
  --yz-page-bg: #0B0F16;
  /* 页脚体系深色值：CTA 带比表面深一档、主页脚再深一档（保持官方三段层次：
     表面 → 浅带 → 深锚）；实心深头与 fixed 态同值（#0E141D）*/
  --yz-foot-bg: #1A2230;
  --yz-footer-bg: #0E141D;
  --yz-header-solid: #0E141D;
  --yz-shadow: 0 2px 12px rgba(0, 0, 0, 0.45);
}

/* body 底色：官方 body 用 var(--yz-surface)，浅色纯白（官方原值），
   深色观测站深底。层次由卡片白/深表面差区分，不引入第三色。 */

/* ---------- 主题切换按钮（theme.js v0.3 自动绑定 [data-theme-toggle]）---------- */
.yz-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-left: 10px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  cursor: pointer;
  transition: border-color .2s, background .2s, color .2s;
  vertical-align: middle;
}
.yz-theme-toggle:hover { border-color: var(--yz-accent); color: var(--yz-accent); }
.yz-theme-toggle svg { width: 16px; height: 16px; display: block; }
.yz-i-sun { opacity: 0; transform: rotate(-90deg) scale(0.4); transition: all .25s; }
.yz-i-moon { opacity: 1; transform: rotate(0) scale(1); transition: all .25s; }
[data-theme="light"] .yz-theme-toggle { border-color: rgba(0, 0, 0, 0.15); background: rgba(0, 0, 0, 0.04); color: #4C525B; }
[data-theme="light"] .yz-i-sun { opacity: 1; transform: rotate(0) scale(1); }
[data-theme="light"] .yz-i-moon { opacity: 0; transform: rotate(90deg) scale(0.4); }

/* ---------- 深色主题适配补充（官方规则之外的结构性对抗）---------- */
/* 输入框/下拉：Bootstrap 表单控件浅色底已在变量化范围；深色下 placeholder 提亮 */
[data-theme="dark"] .form-control::placeholder { color: #5C6B7E; }
/* 深色主题：官方深底 banner/hero 区文字保持亮色（功能性浅色字，不随表面变量变暗）。
   官方设计：.swiper-slide/.content-slide/.page-hero/.newHomePageBackground/.bg-holder.overlay/.map-service
   均为深底 + 浅色字；其 color 源规则（.content-slide 官方 #f5f5f5）变量化后
   深色主题会解析为深灰，故此处恢复亮色（浅色主题官方原值不受影响）。 */
[data-theme="dark"] .swiper-slide,
[data-theme="dark"] .content-slide,
[data-theme="dark"] .page-hero,
[data-theme="dark"] .newHomePageBackground,
[data-theme="dark"] .bg-holder.overlay,
[data-theme="dark"] .map-service { color: #E7ECF3; }
/* 深色主题下官方硬编码白底图片插槽（内容图，非 chrome）不处理——见交付说明「已知限制」 */

/* ---------- yz- 增强：琥珀化关键交互（与官方规则同级，不靠 !important）---------- */
/* 说明：官方按钮/链接主色已通过变量化替换为 --yz-accent，此处仅补
   header 导航当前项与 footer CTA 的品牌一致性。 */
.navbar-nav > li.active > a,
.navbar-nav > li > a:focus { color: var(--yz-accent); }

/* 深色主题下 header fixed 态的导航链接保持白字（官方深底设计延续）*/
[data-theme="dark"] .header.fixed .navbar-nav > li > a { color: rgba(255, 255, 255, 0.85); }
[data-theme="dark"] .header.fixed .navbar-nav > li > a:hover { color: var(--yz-accent); }