/* ============================================================
   运营参谋 · 工具集（advisor）样式
   视觉语言参考 Win11 通知中心：独立亮卡浮在面板底上、弱边框、分组小标题、
   卡内细分割行动条。值一律取 tokens.css 变量，零裸色值（tools/check-tokens 会扫，
   注释里也不许写色值字面量——连注释都进正则）。
   ------------------------------------------------------------------
   为什么面板底用实色而不是亚克力半透明：
     原型阶段验证过半透明（backdrop-filter + rgba 白底）观感确实好，但那是在单一
     浅色场景下测的。本系统有 [data-theme="dark"] 暗色主题，半透明底叠在海报预览上
     会让文字对比度随内容变化、无法保证可读。故落地版用 var(--card) 实色 + 三级阴影，
     亚克力感靠阴影与圆角承载，明暗两套主题都稳。
   ------------------------------------------------------------------
   批一〇六（李叔 10-06「入口不显眼、页面有点平」）新增三条硬约束，改前必读：
     ① 卡片根 class 恒为 class="adv-card"，一个字不许动——守闸⑦ 按这个精确串数
        应季卡片条数。要分级/分色一律走 data 属性（data-urg）或子元素（.adv-rk）。
     ② 入口三处（顶栏 .adv-top / 右下 .adv-fab / 首登 .adv-hint）共用一枚数字徽标，
        徽标只在缓存里已有数据时才显示，绝不为了显眼提前拉请求（纪律①的延伸）。
     ③ 新增视觉只用 tokens 里已存在的令牌，不许为了好看现造色（守闸⑩ 会查未定义令牌）。
   ============================================================ */

.adv { position: fixed; right: 24px; bottom: 24px; z-index: 60; font-family: var(--font-sans); }

/* ---- 顶栏常驻入口：全站任何页面都能一键叫出参谋 ----
   放在 .info-group 胶囊里（与天气/费用同级），不给边框，靠品牌浅底立住；
   徽标数字 = 未来 14 天营销节点数，无缓存时不显示。 */
.adv-top {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: var(--t-weak); color: var(--brand); font-family: inherit;
  background: var(--brand-soft); border: 0; border-radius: 999px;
  padding: 3px 9px; cursor: pointer; transition: box-shadow .15s;
}
.adv-top:hover { box-shadow: var(--shadow-1); }
.adv-top.on { background: var(--brand); color: #fff; }
.adv-top.on .adv-badge { background: #fff; color: var(--brand); }

/* ---- 主入口：胶囊（图标 + 文字 + 徽标）----
   批一〇六：56px 裸圆球没人知道是啥，改成带字胶囊。仍是页面唯一的绿色实心按钮。 */
.adv-fab {
  height: 40px; padding: 0 15px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--brand); color: #fff;
  display: flex; align-items: center; gap: 7px;
  box-shadow: var(--shadow-2); transition: transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.adv-fab:hover { transform: translateY(-1px); box-shadow: var(--shadow-3); }
.adv-fab-t { font-size: var(--t-body); font-weight: 600; letter-spacing: .2px; }
.adv.open .adv-fab { opacity: .5; transform: scale(.97); }

/* ---- 首登引导气泡：只出现一次（localStorage 记），不点开面板也看得见 ---- */
.adv-hint {
  position: absolute; right: 0; bottom: 52px; width: 232px;
  background: var(--card); border: 1px solid var(--line-strong); border-radius: var(--r-l);
  box-shadow: var(--shadow-3); padding: 11px 13px;
}
.adv-hint-t { font-size: var(--t-aux); color: var(--text); line-height: 1.6; }
.adv-hint-t b { color: var(--brand); font-weight: 600; }
.adv-hint-f { margin-top: 8px; display: flex; align-items: center; gap: 10px; }
.adv-hint-ok {
  border: 0; background: var(--brand-soft); color: var(--brand);
  font-size: var(--t-aux); font-weight: 600; font-family: inherit;
  padding: 4px 12px; border-radius: var(--r-s); cursor: pointer;
}
.adv-hint-x { border: 0; background: transparent; color: var(--text-3); font-size: var(--t-weak); cursor: pointer; font-family: inherit; }

/* ---- 悬停微览：不点开也能扫一眼（只在已有缓存时显示真数据） ---- */
.adv-peek {
  position: absolute; right: 68px; bottom: 8px; width: 216px;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l);
  box-shadow: var(--shadow-2); padding: 10px 12px;
  opacity: 0; transform: translateX(6px); pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}
.adv:not(.open) .adv-fab:hover + .adv-peek, .adv:not(.open):hover .adv-peek { opacity: 1; transform: none; }
.adv.open .adv-peek { opacity: 0; }
.adv-pk-r { font-size: var(--t-aux); color: var(--text-2); line-height: 1.9; }
.adv-pk-r:first-child { color: var(--text); }

/* ---- 面板 ---- */
.adv-panel {
  position: absolute; right: 0; bottom: 52px; width: 372px; max-height: 62vh;
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-l);
  box-shadow: var(--shadow-3); display: none; flex-direction: column; overflow: hidden;
}
.adv.open .adv-panel { display: flex; }
/* 收纳态：收成一条标题条（李叔「可折叠收纳」） */
.adv.open.mini .adv-panel .adv-conc, .adv.open.mini .adv-panel .adv-tabs, .adv.open.mini .adv-panel .adv-body { display: none; }

.adv-head {
  display: flex; align-items: center; gap: 8px;
  padding: 12px 14px; border-bottom: 1px solid var(--line); background: var(--card);
}
.adv-title { font-size: var(--t-body); font-weight: 600; color: var(--text); }
.adv-sub { font-size: var(--t-weak); color: var(--text-3); }
.adv-sp { flex: 1; }
.adv-min, .adv-x {
  border: 0; background: transparent; color: var(--text-2); cursor: pointer;
  font-size: 15px; line-height: 1; padding: 4px 6px; border-radius: var(--r-s);
}
.adv-min:hover, .adv-x:hover { background: var(--hover); color: var(--text); }

/* ---- 今日结论条（批一〇六核心）：参谋给结论，不是摆三堆数据 ----
   只吃已有缓存，不主动拉任何一路（纪律①）；一路都没缓存时整条不显示。 */
.adv-conc {
  margin: 10px 14px 0; padding: 9px 11px; border-radius: var(--r-m);
  background: var(--brand-soft); display: flex; align-items: center; gap: 8px;
}
.adv-conc-t { flex: 1; font-size: var(--t-aux); color: var(--brand); line-height: 1.5; }
.adv-conc-t b { font-weight: 600; }
.adv-conc-a {
  font-size: var(--t-aux); color: var(--brand); font-weight: 600; white-space: nowrap;
  border-left: 1px solid var(--line-strong); padding-left: 8px; cursor: pointer;
}
.adv-conc-a:hover { text-decoration: underline; }

/* 行动闭环反馈：面板内提示，不弹全局 toast（不干扰主流程） */
.adv-flash {
  margin: 8px 14px 0; padding: 7px 10px; border-radius: var(--r-s);
  background: var(--brand-soft); color: var(--brand); font-size: var(--t-aux);
}

.adv-tabs { display: flex; border-bottom: 1px solid var(--line); background: var(--card); }
.adv-tab {
  flex: 1; border: 0; background: transparent; cursor: pointer; position: relative;
  padding: 10px 0; font-size: var(--t-aux); color: var(--text-2); font-family: inherit;
}
.adv-tab svg { vertical-align: -2px; margin-right: 3px; }
.adv-tab.on { color: var(--brand); font-weight: 600; }
.adv-tab.on::after {
  content: ''; position: absolute; left: 24%; right: 24%; bottom: 0; height: 2px;
  background: var(--brand); border-radius: 2px;
}
.adv-badge {
  display: inline-block; margin-left: 3px; min-width: 16px; padding: 0 4px;
  background: var(--brand); color: #fff; border-radius: 999px;
  font-size: var(--t-weak); line-height: 16px; text-align: center;
}
.adv-tab.on .adv-badge { background: var(--brand); }

.adv-body { padding: 12px 14px 14px; overflow-y: auto; }
.adv-sec { font-size: var(--t-weak); color: var(--text-3); margin: 2px 0 8px; }
.adv-sec:not(:first-child) { margin-top: 14px; }

/* 独立亮卡（Win11 通知条目同节奏）
   批一〇六：根 class 恒为 adv-card（守闸⑦ 精确计数），分级一律走 data 属性。 */
.adv-card {
  background: var(--card-2); border: 1px solid var(--line); border-radius: var(--r-m);
  padding: 10px 12px; margin-bottom: 8px; transition: box-shadow .15s, border-color .15s;
}
.adv-card:hover { box-shadow: var(--shadow-1); border-color: var(--line-strong); }
/* 日历紧迫度：今天红 / 3 天内橙 / 其余灰——左边条 3px，卡片本体不动 */
.adv-card[data-urg="today"] { border-left: 3px solid var(--danger); }
.adv-card[data-urg="soon"] { border-left: 3px solid var(--warn); }
.adv-card[data-urg="later"] { border-left: 3px solid var(--line-strong); }
.adv-c-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.adv-c-n { font-size: var(--t-body); color: var(--text); font-weight: 600; }
.adv-c-d { font-size: var(--t-weak); color: var(--text-3); white-space: nowrap; }
.adv-c-s { font-size: var(--t-aux); color: var(--text-2); margin-top: 3px; }
.adv-c-act {
  margin-top: 8px; padding-top: 7px; border-top: 1px solid var(--line);
  font-size: var(--t-aux); color: var(--brand); cursor: pointer;
}
.adv-c-act:hover { text-decoration: underline; }
.adv-empty, .adv-loading { font-size: var(--t-aux); color: var(--text-3); padding: 10px 2px; }
.adv-more { font-size: var(--t-weak); color: var(--text-3); text-align: center; padding: 2px 0; }

/* 倒计时 pill（日历） */
.adv-cd { font-size: var(--t-weak); border-radius: 999px; padding: 1px 7px; white-space: nowrap; }
.adv-cd.today { background: var(--danger-soft); color: var(--danger); }
.adv-cd.soon { background: var(--warn-soft); color: var(--warn); }
.adv-cd.later { color: var(--text-3); }

/* 应季序号推荐位：Top1 用品牌色，其余弱化为灰——有主次，不是流水账 */
.adv-rk { font-size: 17px; font-weight: 600; line-height: 1; margin-right: 9px; color: var(--text-3); flex: none; }
.adv-rk.top { color: var(--brand); }

/* 天气 */
.adv-now { display: flex; gap: 14px; align-items: center; }
.adv-now-l { min-width: 96px; }
.adv-temp { font-size: 36px; line-height: 1.05; color: var(--text); font-weight: 600; }
.adv-unit { font-size: 16px; font-weight: 400; }
.adv-now-t { font-size: var(--t-aux); color: var(--text-2); margin-top: 4px; }
.adv-now-r { flex: 1; }
.adv-day { display: flex; justify-content: space-between; font-size: var(--t-aux); color: var(--text-2); line-height: 2; }
.adv-day-n { color: var(--text-3); }
.adv-day-w { flex: 1; text-align: center; color: var(--text-2); }
.adv-day-t { color: var(--text); }

/* 参谋建议 / 降级横幅 */
.adv-call {
  margin-top: 8px; padding: 8px 10px; border-radius: var(--r-s);
  background: var(--brand-soft); color: var(--brand); font-size: var(--t-aux); line-height: 1.6;
}
.adv-call-warn { background: var(--warn-soft); color: var(--warn); }

/* 单模块降级：只占自己 tab，不弹全局 */
.adv-err { background: var(--warn-soft); border-color: var(--warn); }
.adv-err-t { font-size: var(--t-body); color: var(--warn); font-weight: 600; }
.adv-err-s { font-size: var(--t-aux); color: var(--text-2); margin-top: 4px; }
.adv-err-f { font-size: var(--t-weak); color: var(--text-3); margin-top: 6px; }

/* 徽标 */
.adv-pill {
  display: inline-block; padding: 0 5px; border-radius: var(--r-s);
  font-size: var(--t-weak); line-height: 16px; vertical-align: 1px;
}
.adv-pill.peak { background: var(--brand-soft); color: var(--brand); }
.adv-pill.a { background: var(--warn-soft); color: var(--warn); }

/* 溯源三件套：状态点 + 来源 + 更新时间 */
.adv-foot {
  margin-top: 10px; padding-top: 8px; border-top: 1px solid var(--line);
  font-size: var(--t-weak); color: var(--text-3); display: flex; align-items: center; gap: 5px; flex-wrap: wrap;
}
.adv-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--text-3); flex: none; }
.adv-dot.ok { background: var(--brand); }
.adv-dot.warn { background: var(--warn); }
.adv-dot.err { background: var(--danger); }
.adv-foot-r { width: 100%; color: var(--warn); }