/* ============================================================
   云律执 H5 · 三主题注入层（白 / 蓝 / 中国红）
   来源：桌面「主页三主题」(ylz-color-themes) 的白/蓝/红方案
   用法：置于 /h5/assets/ylz-theme.css，在 /h5/index.html 引用，
         由 ylz-theme.js 在 .portal-app 上切换 data-theme。
   说明：全部规则限定在 .portal-app[data-theme=ylz-*] 作用域内，
         不选择主题时不产生任何影响（默认 green 主题原样保留）。
   ============================================================ */

/* ---------- 公共：切换按钮 ---------- */
.ylz-theme-switch {
  position: fixed;
  right: 14px;
  bottom: 78px;
  z-index: 9999;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 6px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.1);
  background: rgba(255, 255, 255, 0.94);
  box-shadow: 0 8px 26px rgba(0, 0, 0, 0.22);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  font-family: -apple-system, BlinkMacSystemFont, "Microsoft YaHei", sans-serif;
}
.ylz-theme-switch .ylz-ts-label {
  font-size: 10px;
  letter-spacing: 0.14em;
  color: #5c7291;
  padding: 0 7px 0 6px;
}
.ylz-theme-switch button {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 11px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  font-size: 12px;
  font-weight: 600;
  color: #0b2e5c;
  cursor: pointer;
}
.ylz-theme-switch button .dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex: none;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.14);
}
.ylz-theme-switch button:hover { background: rgba(11, 46, 92, 0.08); }
.ylz-theme-switch button.is-on { background: #0b2e5c; color: #ffffff; }
.ylz-theme-switch button.is-on .dot { box-shadow: none; }
.ylz-theme-switch .dot--white { background: #ffffff; }
.ylz-theme-switch .dot--blue  { background: #2a6be0; }
.ylz-theme-switch .dot--red   { background: #b81c22; }

/* ============================================================
   主题一 · 白（ylz-white）：白底、深蓝结构、红 CTA
   ============================================================ */
.portal-app[data-theme="ylz-white"] {
  --accent: #0b2e5c !important;
  --deep: #0b2e5c !important;
  --soft: #f5f8fd !important;
  --gold: #b81c22 !important;
  --text: #0b2e5c !important;
  --muted: #5c7291 !important;
  --bg: #ffffff !important;
  --line: #e4eaf3 !important;
}
/* ---------- 页面底色（写在 body 上，由 ylz-theme.js 同步标记） ---------- */
body[data-ylz-theme="ylz-white"],
body[data-ylz-theme="ylz-white"] uni-page-body { background: #ffffff !important; }

.portal-app[data-theme="ylz-white"] .head { background: #ffffff !important; border-bottom: 1px solid #e4eaf3 !important; }
.portal-app[data-theme="ylz-white"] .brand .logo { background: #0b2e5c !important; color: #ffffff !important; }
.portal-app[data-theme="ylz-white"] .search { background: #f5f8fd !important; color: #5c7291 !important; }

.portal-app[data-theme="ylz-white"] .hero {
  background: linear-gradient(115deg, #0b2e5c, #1a4b88) !important;
}
.portal-app[data-theme="ylz-white"] .go { background: #b81c22 !important; color: #ffffff !important; }

.portal-app[data-theme="ylz-white"] .notice { background: #f5f8fd !important; color: #5c7291 !important; }
.portal-app[data-theme="ylz-white"] .promo {
  background: linear-gradient(100deg, #eef3fb, #f7f9fd) !important;
  color: #0b2e5c !important;
}
.portal-app[data-theme="ylz-white"] .promo-subtitle { color: #5c7291 !important; }

.portal-app[data-theme="ylz-white"] .cards { background: #ffffff !important; }
.portal-app[data-theme="ylz-white"] .cover {
  background: #f5f8fd !important;
  color: #0b2e5c !important;
}
.portal-app[data-theme="ylz-white"] .cover-en { color: #5c7291 !important; }

.portal-app[data-theme="ylz-white"] .bottom-tabs {
  background: rgba(255, 255, 255, 0.96) !important;
  border-top: 1px solid #e4eaf3 !important;
}
.portal-app[data-theme="ylz-white"] .bottom-tabs .active { color: #0b2e5c !important; }

.portal-app[data-theme="ylz-white"] .page-head { background: #ffffff !important; }
.portal-app[data-theme="ylz-white"] .searchform { background: #ffffff !important; }
.portal-app[data-theme="ylz-white"] .cats { background: #ffffff !important; }

/* ============================================================
   主题二 · 蓝（ylz-blue）：深蓝场、半透明卡、红 CTA
   ============================================================ */
.portal-app[data-theme="ylz-blue"] {
  --accent: #6ea0ff !important;
  --deep: #07213f !important;
  --soft: rgba(255, 255, 255, 0.1) !important;
  --gold: #ff8a8a !important;
  --text: #ffffff !important;
  --muted: rgba(255, 255, 255, 0.72) !important;
  --bg: #0b2e5c !important;
  --line: rgba(255, 255, 255, 0.22) !important;
}
body[data-ylz-theme="ylz-blue"],
body[data-ylz-theme="ylz-blue"] uni-page-body {
  background: radial-gradient(1100px 720px at 76% 12%, #123763 0%, #0b2e5c 58%, #07213f 100%) !important;
  background-attachment: fixed !important;
}

.portal-app[data-theme="ylz-blue"] .head {
  background: rgba(7, 33, 63, 0.92) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
}
.portal-app[data-theme="ylz-blue"] .brand .logo { background: #ffffff !important; color: #0b2e5c !important; }
.portal-app[data-theme="ylz-blue"] .brand-name { color: #ffffff !important; }
.portal-app[data-theme="ylz-blue"] .search {
  background: rgba(255, 255, 255, 0.12) !important;
  color: rgba(255, 255, 255, 0.78) !important;
}

.portal-app[data-theme="ylz-blue"] .hero {
  background: radial-gradient(1100px 720px at 76% 18%, #1a4b88 0%, #0b2e5c 55%, #07213f 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.18) !important;
}
.portal-app[data-theme="ylz-blue"] .go { background: #b81c22 !important; color: #ffffff !important; }

.portal-app[data-theme="ylz-blue"] .notice {
  background: rgba(255, 255, 255, 0.075) !important;
  color: rgba(255, 255, 255, 0.75) !important;
}
.portal-app[data-theme="ylz-blue"] .promo {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}
.portal-app[data-theme="ylz-blue"] .promo-subtitle { color: rgba(255, 255, 255, 0.68) !important; }

.portal-app[data-theme="ylz-blue"] .cards {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
}
.portal-app[data-theme="ylz-blue"] .cover {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
}
.portal-app[data-theme="ylz-blue"] .cover-en { color: rgba(255, 255, 255, 0.55) !important; }
.portal-app[data-theme="ylz-blue"] .card-title { color: #ffffff !important; }

.portal-app[data-theme="ylz-blue"] .bottom-tabs {
  background: rgba(7, 33, 63, 0.94) !important;
  border-top: 1px solid rgba(255, 255, 255, 0.14) !important;
}
.portal-app[data-theme="ylz-blue"] .bottom-tabs .active { color: #6ea0ff !important; }

.portal-app[data-theme="ylz-blue"] .page-head {
  background: rgba(7, 33, 63, 0.92) !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
}
.portal-app[data-theme="ylz-blue"] .searchform { background: rgba(7, 33, 63, 0.92) !important; }
.portal-app[data-theme="ylz-blue"] .mini { background: rgba(255, 255, 255, 0.1) !important; color: #6ea0ff !important; }
.portal-app[data-theme="ylz-blue"] .cats {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

/* ============================================================
   主题三 · 中国红（ylz-red）：红渐变满屏、深蓝正文、CTA 反转
   ============================================================ */
.portal-app[data-theme="ylz-red"] {
  --accent: #b81c22 !important;
  --deep: #8e141b !important;
  --soft: #ffffff !important;
  --gold: #0b2e5c !important;
  --text: #0b2e5c !important;
  --muted: #5c7291 !important;
  --bg: #f5f8fd !important;
  --line: #e4eaf3 !important;
}
body[data-ylz-theme="ylz-red"],
body[data-ylz-theme="ylz-red"] uni-page-body { background: #f5f8fd !important; }

.portal-app[data-theme="ylz-red"] .head { background: #ffffff !important; border-bottom: 1px solid #e4eaf3 !important; }
.portal-app[data-theme="ylz-red"] .brand .logo { background: #b81c22 !important; color: #ffffff !important; }
.portal-app[data-theme="ylz-red"] .search { background: #f5f8fd !important; color: #5c7291 !important; }

.portal-app[data-theme="ylz-red"] .hero {
  background: linear-gradient(118deg, #c02027 0%, #b81c22 46%, #8e141b 100%) !important;
  border-right: 6px solid #0b2e5c !important;
}
.portal-app[data-theme="ylz-red"] .go {
  background: #ffffff !important;
  color: #b81c22 !important;
}

.portal-app[data-theme="ylz-red"] .notice { background: #ffffff !important; color: #5c7291 !important; }
.portal-app[data-theme="ylz-red"] .promo {
  background: #ffffff !important;
  color: #0b2e5c !important;
  border: 1px solid #e4eaf3 !important;
  border-left: 4px solid #b81c22 !important;
}
.portal-app[data-theme="ylz-red"] .promo-subtitle { color: #5c7291 !important; }

.portal-app[data-theme="ylz-red"] .cards { background: #ffffff !important; }
.portal-app[data-theme="ylz-red"] .cover {
  background: #fdf1f0 !important;
  color: #8e141b !important;
}
.portal-app[data-theme="ylz-red"] .cover-en { color: #b06a66 !important; }

.portal-app[data-theme="ylz-red"] .bottom-tabs {
  background: rgba(255, 255, 255, 0.96) !important;
  border-top: 1px solid #e4eaf3 !important;
}
.portal-app[data-theme="ylz-red"] .bottom-tabs .active { color: #b81c22 !important; }

.portal-app[data-theme="ylz-red"] .page-head { background: #ffffff !important; }
.portal-app[data-theme="ylz-red"] .searchform { background: #ffffff !important; }
.portal-app[data-theme="ylz-red"] .cats { background: #ffffff !important; }

/* ============================================================
   知识店铺入口（/store）—— 由 ylz-theme.js 注入首页 hero 之后。
   只使用主题变量，白 / 蓝 / 中国红三套配色自动适配。
   ============================================================ */
.portal-app .ylz-store-entry {
  /* 两列网格固定图标与文案；点击提示直接写在副标题里，避免 uni-app
     button 的 overflow:hidden 把额外的第三列元素裁掉。 */
  display: grid !important;
  grid-template-columns: 40px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 12px !important;
  overflow: visible !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 14px 0 18px !important;
  padding: 13px 15px !important;
  border: 1px solid var(--line, #e4eaf3) !important;
  border-radius: 14px !important;
  background: var(--soft, #f5f8fd) !important;
  color: var(--text, #0b2e5c) !important;
  text-align: left !important;
  cursor: pointer !important;
  font: inherit !important;
  line-height: 1.4 !important;
  -webkit-tap-highlight-color: transparent !important;
}
/* uni-app 的 button 自带 ::after 边框，必须去掉 */
.portal-app .ylz-store-entry::after { display: none !important; }
.portal-app .ylz-se-icon {
  flex: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 40px !important;
  height: 40px !important;
  border-radius: 10px !important;
  background: #b81c22 !important;
  color: #ffffff !important;
  font-size: 16px !important;
  font-weight: 700 !important;
}
.portal-app .ylz-se-text {
  min-width: 0 !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 3px !important;
}
.portal-app .ylz-se-title,
.portal-app .ylz-se-sub {
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.portal-app .ylz-se-title {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--text, #0b2e5c) !important;
}
.portal-app .ylz-se-sub {
  font-size: 11px !important;
  color: var(--muted, #5c7291) !important;
}
.portal-app .ylz-store-entry:active { transform: scale(0.99) !important; }
.portal-app .ylz-store-entry.ylz-se-busy { opacity: 0.72 !important; cursor: wait !important; }