/* ─── 复用主页 navbar（品牌 + 中部导航 + 右上角浮动用户菜单）───
   与 index.html 顶栏 1:1 对齐，供 wallet.html / transactions.html 引用。
   仅新增类名 + 覆盖 .nav-inner，不影响其它静态信息页。 */

/* nav-inner：与页面主体同宽（1280），中部链接绝对居中需 position:relative；
   用户菜单已移入 navbar 右侧，需 overflow:visible 让下拉不被裁切 */
.navbar{
  height:64px;display:flex;align-items:center;overflow:visible;
}
.navbar .nav-inner{
  width:100%;max-width:1280px;padding:0 32px;position:relative;height:44px;
}
.nav-brand{padding:6px 0}

.nav-links{
  display:flex;gap:4px;
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
}
.nav-links a{
  font-size:14px;font-weight:500;color:var(--text-2);
  padding:8px 14px;border-radius:7px;
  transition:background .15s,color .15s;white-space:nowrap;
}
.nav-links a:hover{background:var(--bg);color:var(--text)}
.nav-ctas{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-shrink:0}
.nav-auth{display:flex;gap:10px;align-items:center}

.btn{
  display:inline-flex;align-items:center;gap:6px;
  height:36px;font-size:14px;font-weight:500;padding:0 20px;
  border-radius:7px;border:none;cursor:pointer;
  transition:all .15s;white-space:nowrap;
}
.btn-outline{
  color:var(--text);background:transparent;
  border:1px solid var(--border-2);
}
.btn-outline:hover{border-color:var(--blue);color:var(--blue);background:var(--blue-light)}

/* ─── 用户菜单（位于 navbar 右侧区域，随内容 1440 容器右对齐）─── */
.user-fab{position:relative;z-index:300}
.user-fab[hidden]{display:none}
.user-fab-trigger{
  display:inline-flex;align-items:center;gap:8px;
  padding:6px 14px 6px 6px;height:36px;border-radius:8px;
  background:#fff;border:1px solid var(--border);
  cursor:pointer;transition:border-color .15s,background .15s;font-family:inherit;
}
.user-fab-trigger:hover{border-color:var(--dark);background:var(--bg)}
.user-fab-avatar{
  width:24px;height:24px;border-radius:6px;background:var(--dark);
  color:#fff;font-size:12px;font-weight:600;letter-spacing:.02em;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.user-fab-name{font-size:13px;font-weight:500;color:var(--text);max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-fab-caret{width:10px;height:10px;color:var(--text-3);flex-shrink:0;transition:transform .15s}
.user-fab:hover .user-fab-caret,
.user-fab.is-open .user-fab-caret{transform:rotate(180deg);color:var(--text-2)}
.user-fab-menu{
  position:absolute;top:calc(100% + 6px);right:0;min-width:260px;background:#fff;
  border:1px solid var(--border);border-radius:12px;
  box-shadow:0 12px 32px rgba(15,23,42,.14);padding:6px;
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .15s,transform .15s,visibility .15s;
}
.user-fab:hover .user-fab-menu,
.user-fab.is-open .user-fab-menu{opacity:1;visibility:visible;transform:translateY(0)}
.user-fab::after{content:'';position:absolute;top:100%;left:0;right:0;height:8px}
.user-fab-menu-header{padding:10px 12px 12px;border-bottom:1px solid var(--border);margin-bottom:6px}
.user-fab-menu-name{font-size:14px;font-weight:600;color:var(--text);line-height:1.3}
.user-fab-menu-email{font-size:12px;color:var(--text-3);margin-top:2px;line-height:1.3;word-break:break-all}
.user-fab-menu-item{
  display:flex;align-items:center;gap:10px;padding:9px 12px;border-radius:7px;
  font-size:13px;color:var(--text);cursor:pointer;transition:background .12s;
  text-decoration:none;border:none;background:none;width:100%;text-align:left;font-family:inherit;
}
.user-fab-menu-item:hover{background:var(--bg)}
/* display:flex 会覆盖 UA 的 [hidden]{display:none}，需显式补一条，否则 hidden 属性无效（我的钱包入口永远可见） */
.user-fab-menu-item[hidden]{display:none}
.user-fab-menu-icon{
  width:28px;height:28px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.user-fab-menu-icon.wallet{background:#FEF3C7;color:#B45309}
.user-fab-menu-icon.factory{background:#0F172A;color:#fff}
.user-fab-menu-icon.supply{background:#ECFDF5;color:var(--green)}
.user-fab-menu-icon.logout{background:#FEF2F2;color:#DC2626}
.user-fab-menu-item-meta{display:flex;flex-direction:column;gap:1px;flex:1;min-width:0}
.user-fab-menu-item-title{font-size:13px;font-weight:500;color:var(--text)}
.user-fab-menu-item-sub{font-size:11px;color:var(--text-3)}
.user-fab-menu-divider{height:1px;background:var(--border);margin:6px 4px}

@media (max-width:860px){
  .nav-links{display:none}
}
@media (max-width:640px){
  .navbar .nav-inner{padding:0 20px}
  .user-fab-name{max-width:80px}
}