/* ============================================================================
 * floatbar.css —— 右侧浮动栏样式（配合 floatbar.js）
 * ----------------------------------------------------------------------------
 * 变量全部取自 theme.css / tool.css 的既有定义，不引新色：
 *   --gold（填充金，只做「填充 + 深字」）/ --ink / --surface / --line
 * 微字号红线 12px（全站红线，守卫会查）—— 本文件最小字号 12px。
 * ========================================================================== */

.fb{
  position:fixed; right:14px; bottom:88px; z-index:60;
  font-family:inherit; font-size:13px; color:var(--ink);
}
.fb *{box-sizing:border-box}

/* ---------- 小屏收纳按钮（默认隐藏，≤860px 显示） ---------- */
.fb-btn-mini{
  display:none; width:46px; height:46px; border-radius:50%;
  border:1px solid var(--line); background:var(--surface); color:var(--ink);
  font-size:18px; line-height:1; cursor:pointer;
  box-shadow:0 4px 14px rgba(51,39,29,.14);
}
.fb-btn-mini:hover{border-color:var(--gold-2)}

/* ---------- 右侧竖排 ---------- */
.fb-rail{
  display:flex; flex-direction:column; gap:6px;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:6px; box-shadow:0 6px 22px rgba(51,39,29,.10);
}
.fb-ic-btn{
  position:relative; width:52px; padding:8px 4px 6px;
  border:0; border-radius:10px; background:transparent; color:var(--ink-2);
  cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:3px;
  transition:background .15s,color .15s;
}
.fb-ic-btn:hover{background:var(--surface-2); color:var(--ink)}
.fb-ic-btn.is-on{background:var(--gold-soft); color:var(--ink)}
.fb-ic{font-size:17px; line-height:1}
.fb-lb{font-size:12px; line-height:1.2; letter-spacing:.02em}

/* 购物车计数徽标 */
/* 全站最小字号红线 12px（_ux-guards 会扫源码字面量，写 11px 再被下面覆盖也会报）。 */
.fb-badge{
  position:absolute; top:3px; right:5px; min-width:18px; height:18px;
  padding:0 4px; border-radius:9px; background:var(--gold); color:var(--ink);
  font-size:12px; font-weight:700; line-height:18px; text-align:center;
  font-style:normal;
}

/* ---------- 面板 ---------- */
.fb-panel{
  position:absolute; right:calc(100% + 10px); bottom:0;
  width:310px; max-height:min(70vh,520px); overflow:hidden;
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  box-shadow:0 10px 34px rgba(51,39,29,.16);
  display:flex; flex-direction:column;
}
.fb-panel[hidden]{display:none}
.fb-head{
  display:flex; align-items:center; justify-content:space-between;
  padding:11px 13px; border-bottom:1px solid var(--line);
}
.fb-head b{font-size:14px; font-weight:650}
.fb-x{
  border:0; background:transparent; color:var(--ink-3);
  font-size:18px; line-height:1; cursor:pointer; padding:0 2px;
}
.fb-x:hover{color:var(--ink)}
.fb-body{padding:12px 13px; overflow-y:auto}

.fb-p{font-size:12.5px; line-height:1.7; color:var(--ink-2); margin:0 0 10px}
.fb-hint{font-size:12px; line-height:1.6; color:var(--ink-3); margin:10px 0 0}
.fb-empty{font-size:12.5px; line-height:1.8; color:var(--ink-3); padding:14px 2px; text-align:center}

/* 邮件地址块 */
.fb-mail{
  background:var(--surface-3); border:1px solid var(--gold-line); border-radius:10px;
  padding:9px 11px; margin-bottom:12px; text-align:center;
}
.fb-mail a{color:var(--ink); font-weight:650; text-decoration:none; font-size:13px; word-break:break-all}
.fb-mail a:hover{color:var(--gold-2)}

/* 表单 */
.fb-form{display:flex; flex-direction:column; gap:9px}
.fb-form label{display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--ink-2)}
.fb-form input,.fb-form select,.fb-form textarea{
  width:100%; padding:7px 9px; font:inherit; font-size:12.5px; color:var(--ink);
  background:var(--surface); border:1px solid var(--line); border-radius:8px;
  resize:vertical;
}
.fb-form input:focus,.fb-form select:focus,.fb-form textarea:focus{
  outline:none; border-color:var(--gold-2); box-shadow:0 0 0 3px var(--gold-soft);
}

/* 按钮 */
.fb-btn{
  width:100%; padding:9px 12px; border-radius:9px; cursor:pointer;
  font:inherit; font-size:13px; font-weight:650;
  background:var(--gold); color:var(--ink); border:1px solid var(--gold-2);
}
.fb-btn:hover{background:var(--gold-3)}
.fb-btn.ghost{background:transparent; border-color:var(--line); color:var(--ink-2); font-weight:500}
.fb-btn.ghost:hover{border-color:var(--gold-2); color:var(--ink)}

/* 列表行（购物车 / 足迹） */
.fb-list{display:flex; flex-direction:column; gap:8px; margin-bottom:10px}
.fb-row{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:8px 9px; background:var(--surface-2); border-radius:9px;
}
.fb-row-t{
  flex:1; min-width:0; font-size:12.5px; color:var(--ink); text-decoration:none;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.fb-row-t:hover{color:var(--gold-2)}
/* 授权配置副行：换行到标题下方，占满整行（权益 · 期限 · 档位）
   字号取全站微字号下限 12px —— 11~11.8px 是 _ux-guards 明令禁止的可读性下限。 */
.fb-row-cfg{
  flex-basis:100%; order:9; font-size:12px; color:var(--ink-3);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.fb-row-p{font-size:12.5px; font-weight:650; color:var(--ink); white-space:nowrap}
.fb-row-tm{font-size:12px; color:var(--ink-3); white-space:nowrap}
.fb-row-x{
  border:0; background:transparent; color:var(--ink-4); cursor:pointer;
  font-size:15px; line-height:1; padding:0 2px;
}
.fb-row-x:hover{color:var(--gold-2)}

.fb-sum{
  display:flex; align-items:center; justify-content:space-between;
  padding:9px 2px; border-top:1px solid var(--line); margin-bottom:10px;
  font-size:13px;
}
.fb-sum b{font-size:15px; color:var(--ink)}

/* ---------- 轻提示 ---------- */
.fb-toast{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%) translateY(10px);
  background:var(--ink); color:var(--surface); font-size:12.5px;
  padding:9px 16px; border-radius:999px; z-index:70;
  opacity:0; pointer-events:none; transition:opacity .2s, transform .2s;
  max-width:86vw; text-align:center;
}
.fb-toast.is-on{opacity:1; transform:translateX(-50%) translateY(0)}

/* ---------- 小屏：收成圆钮，展开为底部面板 ---------- */
@media (max-width:860px){
  .fb{right:12px; bottom:74px}
  .fb-btn-mini{display:block}
  .fb-rail{display:none}
  .fb.is-open .fb-btn-mini{display:none}
  .fb.is-open .fb-rail{display:flex; flex-direction:row; padding:5px; gap:4px}
  .fb-ic-btn{width:46px; padding:6px 2px 5px}
  .fb-lb{font-size:12px}
  .fb-panel{
    position:fixed; right:12px; left:12px; bottom:12px; top:auto;
    width:auto; max-height:72vh;
  }
}

/* ---------- 打印时隐藏 ---------- */
@media print{.fb{display:none!important}}